From 230c4eb2475a16c136d001598570d8b4d0c25450 Mon Sep 17 00:00:00 2001
From: Dean Herbert <pe@ppy.sh>
Date: Mon, 16 Aug 2021 19:47:27 +0900
Subject: [PATCH] Fade in sidebar buttons after the load has completed

---
 osu.Game/Overlays/Settings/SidebarButton.cs |  3 +
 osu.Game/Overlays/SettingsPanel.cs          | 68 +++++++++++++--------
 2 files changed, 45 insertions(+), 26 deletions(-)

diff --git a/osu.Game/Overlays/Settings/SidebarButton.cs b/osu.Game/Overlays/Settings/SidebarButton.cs
index 30a53b351d..cf6a313a1f 100644
--- a/osu.Game/Overlays/Settings/SidebarButton.cs
+++ b/osu.Game/Overlays/Settings/SidebarButton.cs
@@ -22,6 +22,9 @@ namespace osu.Game.Overlays.Settings
         private readonly Box selectionIndicator;
         private readonly Container text;
 
+        // always consider as part of flow, even when not visible (for the sake of the initial animation).
+        public override bool IsPresent => true;
+
         private SettingsSection section;
 
         public SettingsSection Section
diff --git a/osu.Game/Overlays/SettingsPanel.cs b/osu.Game/Overlays/SettingsPanel.cs
index c191f61e60..388c809be8 100644
--- a/osu.Game/Overlays/SettingsPanel.cs
+++ b/osu.Game/Overlays/SettingsPanel.cs
@@ -135,54 +135,70 @@ namespace osu.Game.Overlays
             LoadComponentAsync(SectionsContainer, d =>
             {
                 ContentContainer.Add(d);
-                d.FadeInFromZero(500);
+                d.FadeInFromZero(750, Easing.OutQuint);
                 loading.Hide();
 
-                if (Sidebar != null)
-                {
-                    SectionsContainer.SelectedSection.ValueChanged += section =>
-                    {
-                        selectedSidebarButton.Selected = false;
-                        selectedSidebarButton = Sidebar.Children.Single(b => b.Section == section.NewValue);
-                        selectedSidebarButton.Selected = true;
-                    };
-                }
-
                 searchTextBox.Current.BindValueChanged(term => SectionsContainer.SearchContainer.SearchTerm = term.NewValue, true);
                 searchTextBox.TakeFocus();
+
+                if (Sidebar == null)
+                    return;
+
+                LoadComponentsAsync(createSidebarButtons(), buttons =>
+                {
+                    float delay = 0;
+
+                    foreach (var button in buttons)
+                    {
+                        Sidebar.Add(button);
+
+                        button.FadeOut()
+                              .Delay(delay)
+                              .FadeInFromZero(1000, Easing.OutQuint);
+
+                        delay += 30;
+                    }
+
+                    SectionsContainer.SelectedSection.BindValueChanged(section =>
+                    {
+                        if (selectedSidebarButton != null)
+                            selectedSidebarButton.Selected = false;
+
+                        selectedSidebarButton = Sidebar.Children.Single(b => b.Section == section.NewValue);
+                        selectedSidebarButton.Selected = true;
+                    }, true);
+                });
             });
         }
 
-        protected void AddSection(SettingsSection section)
+        private IEnumerable<SidebarButton> createSidebarButtons()
         {
-            SectionsContainer.Add(section);
-
-            if (Sidebar != null)
+            foreach (var section in SectionsContainer)
             {
-                var button = new SidebarButton
+                yield return new SidebarButton
                 {
                     Section = section,
                     Action = () =>
                     {
-                        // may not be loaded yet.
-                        if (SectionsContainer == null)
+                        if (!SectionsContainer.IsLoaded)
                             return;
 
                         SectionsContainer.ScrollTo(section);
                         Sidebar.State = ExpandedState.Contracted;
                     },
                 };
-
-                Sidebar.Add(button);
-
-                if (selectedSidebarButton == null)
-                {
-                    selectedSidebarButton = Sidebar.Children.First();
-                    selectedSidebarButton.Selected = true;
-                }
             }
         }
 
+        protected void AddSection(SettingsSection section)
+        {
+            if (IsLoaded)
+                // just to keep things simple. can be accommodated for if we ever need it.
+                throw new InvalidOperationException("All sections must be added before the panel is loaded.");
+
+            SectionsContainer.Add(section);
+        }
+
         protected virtual Drawable CreateHeader() => new Container();
 
         protected virtual Drawable CreateFooter() => new Container();