Implement basic appearance of download button

osu.Game.Tests/Visual/Beatmaps/TestSceneBeatmapCardDownloadButton.cs

@@ -6,12 +6,14 @@ using NUnit.Framework;
 using osu.Framework.Allocation;
 using osu.Framework.Bindables;
 using osu.Framework.Graphics;
+using osu.Framework.Testing;
 using osu.Game.Beatmaps;
 using osu.Game.Beatmaps.Drawables.Cards.Buttons;
 using osu.Game.Online;
 using osu.Game.Online.API.Requests.Responses;
 using osu.Game.Overlays;
 using osu.Game.Rulesets.Osu;
+using osu.Game.Screens.Ranking.Expanded.Accuracy;
 using osu.Game.Tests.Resources;
 using osuTK;
 
@@ -31,13 +33,25 @@ namespace osu.Game.Tests.Visual.Beatmaps
         public void TestDownloadableBeatmap()
         {
             createButton(true);
+
+            assertDownloadVisible(true);
             assertDownloadEnabled(true);
+            assertProgressVisible(false);
+            assertPlayVisible(false);
 
             AddStep("set downloading state", () => downloadButton.State.Value = DownloadState.Downloading);
+            assertDownloadVisible(false);
+            assertProgressVisible(true);
+            assertPlayVisible(false);
+
             AddStep("set progress to 30%", () => downloadButton.Progress.Value = 0.3f);
             AddStep("set progress to 100%", () => downloadButton.Progress.Value = 1f);
             AddStep("set importing state", () => downloadButton.State.Value = DownloadState.Importing);
+
             AddStep("set locally available state", () => downloadButton.State.Value = DownloadState.LocallyAvailable);
+            assertDownloadVisible(false);
+            assertProgressVisible(false);
+            assertPlayVisible(true);
         }
 
         [Test]
@@ -75,23 +89,22 @@ namespace osu.Game.Tests.Visual.Beatmaps
             });
         }
 
-        private void assertDownloadEnabled(bool enabled)
+        private void assertDownloadVisible(bool visible) => AddUntilStep($"download {(visible ? "visible" : "not visible")}", () => downloadButton.Download.IsPresent == visible);
-        {
+        private void assertDownloadEnabled(bool enabled) => AddAssert($"download {(enabled ? "enabled" : "disabled")}", () => downloadButton.Download.Enabled.Value == enabled);
-            AddAssert($"button {(enabled ? "enabled" : "disabled")}", () => downloadButton.Download.IsPresent && downloadButton.Download.Enabled.Value == enabled);
-        }
 
-        private APIBeatmapSet createSoleily()
+        private void assertProgressVisible(bool visible) => AddUntilStep($"progress {(visible ? "visible" : "not visible")}", () => downloadButton.ChildrenOfType<SmoothCircularProgress>().Single().IsPresent == visible);
+
+        private void assertPlayVisible(bool visible) => AddUntilStep($"play {(visible ? "visible" : "not visible")}", () => downloadButton.Play.IsPresent == visible);
+
+        private static APIBeatmapSet createSoleily() => new APIBeatmapSet
         {
-            return new APIBeatmapSet
+            OnlineID = 241526,
+            Availability = new BeatmapSetOnlineAvailability
             {
-                OnlineID = 241526,
+                DownloadDisabled = false,
-                Availability = new BeatmapSetOnlineAvailability
+                ExternalLink = string.Empty,
-                {
+            },
-                    DownloadDisabled = false,
+        };
-                    ExternalLink = string.Empty,
-                },
-            };
-        }
 
         private void createButtonWithBeatmap(APIBeatmapSet beatmap)
         {

osu.Game/Beatmaps/Drawables/Cards/Buttons/DownloadButton.cs

@@ -2,14 +2,14 @@
 // See the LICENCE file in the repository root for full licence text.
 
 using osu.Framework.Allocation;
-using osu.Framework.Bindables;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Sprites;
 using osu.Game.Online.API.Requests.Responses;
-using osu.Framework.Graphics.UserInterface;
+using osu.Game.Graphics;
 using osu.Game.Online;
 using osu.Game.Overlays;
+using osu.Game.Screens.Ranking.Expanded.Accuracy;
 using osuTK;
 
 namespace osu.Game.Beatmaps.Drawables.Cards.Buttons
@@ -20,36 +20,54 @@ namespace osu.Game.Beatmaps.Drawables.Cards.Buttons
         protected readonly PlayIcon Play;
         protected readonly BeatmapDownloadTracker Tracker;
 
-        private readonly CircularProgress downloadProgress;
+        private readonly SmoothCircularProgress downloadProgress;
+
+        [Resolved]
+        private OsuColour colours { get; set; }
+
+        [Resolved]
+        private OverlayColourProvider colourProvider { get; set; }
 
         public DownloadButton(APIBeatmapSet beatmapSet)
         {
             Anchor = Anchor.Centre;
             Origin = Anchor.Centre;
+            AutoSizeAxes = Axes.Both;
 
             InternalChildren = new Drawable[]
             {
                 Tracker = new BeatmapDownloadTracker(beatmapSet),
                 Download = new DownloadIcon(),
-                downloadProgress = new CircularProgress
+                downloadProgress = new SmoothCircularProgress
                 {
-                    Size = new Vector2(16),
+                    Size = new Vector2(12),
-                    InnerRadius = 0.1f,
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
+                    InnerRadius = 0.4f,
                 },
                 Play = new PlayIcon()
             };
         }
 
-        [BackgroundDependencyLoader]
-        private void load(OverlayColourProvider colourProvider)
-        {
-            downloadProgress.Colour = colourProvider.Highlight1;
-        }
-
         protected override void LoadComplete()
         {
             base.LoadComplete();
-            ((IBindable<double>)downloadProgress.Current).BindTo(Tracker.Progress);
+
+            Tracker.Progress.BindValueChanged(_ => updateState());
+            Tracker.State.BindValueChanged(_ => updateState(), true);
+            FinishTransforms(true);
+        }
+
+        private void updateState()
+        {
+            Download.FadeTo(Tracker.State.Value == DownloadState.NotDownloaded ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
+
+            downloadProgress.FadeTo(Tracker.State.Value == DownloadState.Downloading || Tracker.State.Value == DownloadState.Importing ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
+            downloadProgress.FadeColour(Tracker.State.Value == DownloadState.Importing ? colours.Yellow : colourProvider.Highlight1, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
+            if (Tracker.State.Value == DownloadState.Downloading)
+                downloadProgress.FillTo(Tracker.Progress.Value, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
+
+            Play.FadeTo(Tracker.State.Value == DownloadState.LocallyAvailable ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
         }
 
         protected class DownloadIcon : BeatmapCardIconButton