Merge pull request #28142 from frenzibyte/footer-v2-button-animation

Improve animation of new song select footer buttons

osu.Game/Screens/Select/FooterV2/BeatmapOptionsPopover.cs

@@ -188,9 +188,7 @@ namespace osu.Game.Screens.Select.FooterV2
         protected override void UpdateState(ValueChangedEvent<Visibility> state)
         {
             base.UpdateState(state);
-
+            footerButton.OverlayState.Value = state.NewValue;
-            if (state.NewValue == Visibility.Hidden)
-                footerButton.IsActive.Value = false;
         }
     }
 }

osu.Game/Screens/Select/FooterV2/FooterButtonOptionsV2.cs

@@ -2,9 +2,7 @@
 // See the LICENCE file in the repository root for full licence text.
 
 using osu.Framework.Allocation;
-using osu.Framework.Bindables;
 using osu.Framework.Extensions;
-using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Cursor;
 using osu.Framework.Graphics.Sprites;
 using osu.Framework.Graphics.UserInterface;
@@ -15,8 +13,6 @@ namespace osu.Game.Screens.Select.FooterV2
 {
     public partial class FooterButtonOptionsV2 : FooterButtonV2, IHasPopover
     {
-        public readonly BindableBool IsActive = new BindableBool();
-
         [BackgroundDependencyLoader]
         private void load(OsuColour colour)
         {
@@ -25,31 +21,7 @@ namespace osu.Game.Screens.Select.FooterV2
             AccentColour = colour.Purple1;
             Hotkey = GlobalAction.ToggleBeatmapOptions;
 
-            Action = () => IsActive.Toggle();
+            Action = this.ShowPopover;
-        }
-
-        protected override void LoadComplete()
-        {
-            base.LoadComplete();
-
-            IsActive.BindValueChanged(active =>
-            {
-                OverlayState.Value = active.NewValue ? Visibility.Visible : Visibility.Hidden;
-            });
-
-            OverlayState.BindValueChanged(state =>
-            {
-                switch (state.NewValue)
-                {
-                    case Visibility.Hidden:
-                        this.HidePopover();
-                        break;
-
-                    case Visibility.Visible:
-                        this.ShowPopover();
-                        break;
-                }
-            });
         }
 
         public Popover GetPopover() => new BeatmapOptionsPopover(this);

osu.Game/Screens/Select/FooterV2/FooterButtonV2.cs

@@ -24,8 +24,6 @@ namespace osu.Game.Screens.Select.FooterV2
 {
     public partial class FooterButtonV2 : OsuClickableContainer, IKeyBindingHandler<GlobalAction>
     {
-        private const int transition_length = 500;
-
         // This should be 12 by design, but an extra allowance is added due to the corner radius specification.
         private const float shear_width = 13.5f;
 
@@ -68,6 +66,7 @@ namespace osu.Game.Screens.Select.FooterV2
         protected Container TextContainer;
         private readonly Box bar;
         private readonly Box backgroundBox;
+        private readonly Box flashLayer;
 
         public FooterButtonV2()
         {
@@ -137,8 +136,15 @@ namespace osu.Game.Screens.Select.FooterV2
                         {
                             RelativeSizeAxes = Axes.Both,
                         }
-                    }
+                    },
-                }
+                    flashLayer = new Box
+                    {
+                        RelativeSizeAxes = Axes.Both,
+                        Colour = Colour4.White.Opacity(0.9f),
+                        Blending = BlendingParameters.Additive,
+                        Alpha = 0,
+                    },
+                },
             };
         }
 
@@ -154,7 +160,15 @@ namespace osu.Game.Screens.Select.FooterV2
 
         public GlobalAction? Hotkey;
 
-        private bool handlingMouse;
+        protected override bool OnClick(ClickEvent e)
+        {
+            if (Enabled.Value)
+                Flash();
+
+            return base.OnClick(e);
+        }
+
+        protected virtual void Flash() => flashLayer.FadeOutFromOne(800, Easing.OutQuint);
 
         protected override bool OnHover(HoverEvent e)
         {
@@ -162,20 +176,6 @@ namespace osu.Game.Screens.Select.FooterV2
             return true;
         }
 
-        protected override bool OnMouseDown(MouseDownEvent e)
-        {
-            handlingMouse = true;
-            updateDisplay();
-            return base.OnMouseDown(e);
-        }
-
-        protected override void OnMouseUp(MouseUpEvent e)
-        {
-            handlingMouse = false;
-            updateDisplay();
-            base.OnMouseUp(e);
-        }
-
         protected override void OnHoverLost(HoverLostEvent e) => updateDisplay();
 
         public virtual bool OnPressed(KeyBindingPressEvent<GlobalAction> e)
@@ -190,27 +190,23 @@ namespace osu.Game.Screens.Select.FooterV2
 
         private void updateDisplay()
         {
-            Color4 backgroundColour = colourProvider.Background3;
+            Color4 backgroundColour = OverlayState.Value == Visibility.Visible ? buttonAccentColour : colourProvider.Background3;
+            Color4 textColour = OverlayState.Value == Visibility.Visible ? colourProvider.Background6 : colourProvider.Content1;
+            Color4 accentColour = OverlayState.Value == Visibility.Visible ? colourProvider.Background6 : buttonAccentColour;
 
             if (!Enabled.Value)
-            {
+                backgroundColour = backgroundColour.Darken(1f);
-                backgroundColour = colourProvider.Background3.Darken(0.4f);
+            else if (IsHovered)
-            }
+                backgroundColour = backgroundColour.Lighten(0.2f);
-            else
-            {
-                if (OverlayState.Value == Visibility.Visible)
-                    backgroundColour = buttonAccentColour.Darken(0.5f);
 
-                if (IsHovered)
+            backgroundBox.FadeColour(backgroundColour, 150, Easing.OutQuint);
-                {
-                    backgroundColour = backgroundColour.Lighten(0.3f);
 
-                    if (handlingMouse)
+            if (!Enabled.Value)
-                        backgroundColour = backgroundColour.Lighten(0.3f);
+                textColour = textColour.Opacity(0.6f);
-                }
-            }
 
-            backgroundBox.FadeColour(backgroundColour, transition_length, Easing.OutQuint);
+            text.FadeColour(textColour, 150, Easing.OutQuint);
+            icon.FadeColour(accentColour, 150, Easing.OutQuint);
+            bar.FadeColour(accentColour, 150, Easing.OutQuint);
         }
     }
 }