diff --git a/osu.Game.Tests/Visual/TestCaseIconButton.cs b/osu.Game.Tests/Visual/TestCaseIconButton.cs
index 16363da527..14cba71ec8 100644
--- a/osu.Game.Tests/Visual/TestCaseIconButton.cs
+++ b/osu.Game.Tests/Visual/TestCaseIconButton.cs
@@ -25,11 +25,7 @@ namespace osu.Game.Tests.Visual
Children = new[]
{
new NamedIconButton("No change", new IconButton()),
- new NamedIconButton("Background colours", new IconButton
- {
- FlashColour = Color4.DarkGreen,
- HoverColour = Color4.Green,
- }),
+ new NamedIconButton("Background colours", new ColouredIconButton()),
new NamedIconButton("Full-width", new IconButton { ButtonSize = new Vector2(200, 30) }),
new NamedIconButton("Unchanging size", new IconButton(), false),
new NamedIconButton("Icon colours", new IconButton
@@ -41,6 +37,15 @@ namespace osu.Game.Tests.Visual
};
}
+ private class ColouredIconButton : IconButton
+ {
+ public ColouredIconButton()
+ {
+ FlashColour = Color4.DarkGreen;
+ HoverColour = Color4.Green;
+ }
+ }
+
private class NamedIconButton : Container
{
public NamedIconButton(string name, IconButton button, bool allowSizeChange = true)
diff --git a/osu.Game/Graphics/UserInterface/IconButton.cs b/osu.Game/Graphics/UserInterface/IconButton.cs
index 5a25fe641d..eca7bf57c8 100644
--- a/osu.Game/Graphics/UserInterface/IconButton.cs
+++ b/osu.Game/Graphics/UserInterface/IconButton.cs
@@ -3,31 +3,17 @@
using OpenTK;
using OpenTK.Graphics;
-using osu.Framework.Allocation;
-using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
-using osu.Framework.Graphics.Containers;
-using osu.Framework.Graphics.Shapes;
using osu.Framework.Input;
-using osu.Game.Graphics.Containers;
namespace osu.Game.Graphics.UserInterface
{
- public class IconButton : OsuClickableContainer
+ public class IconButton : OsuAnimatedButton
{
public const float BUTTON_SIZE = 30;
- private Color4? flashColour;
- ///
- /// The colour that should be flashed when the is clicked.
- ///
- public Color4 FlashColour
- {
- get { return flashColour ?? Color4.White; }
- set { flashColour = value; }
- }
-
private Color4? iconColour;
+
///
/// The icon colour. This does not affect .
///
@@ -42,6 +28,7 @@ namespace osu.Game.Graphics.UserInterface
}
private Color4? iconHoverColour;
+
///
/// The icon colour while the is hovered.
///
@@ -51,20 +38,6 @@ namespace osu.Game.Graphics.UserInterface
set { iconHoverColour = value; }
}
- private Color4? hoverColour;
- ///
- /// The background colour of the while it is hovered.
- ///
- public Color4 HoverColour
- {
- get { return hoverColour ?? Color4.White; }
- set
- {
- hoverColour = value;
- hover.Colour = value;
- }
- }
-
///
/// The icon.
///
@@ -88,93 +61,39 @@ namespace osu.Game.Graphics.UserInterface
///
public Vector2 ButtonSize
{
- get { return content.Size; }
- set { content.Size = value; }
+ get => Content.Size;
+ set
+ {
+ Content.RelativeSizeAxes = Axes.None;
+ Content.Size = value;
+ }
}
- private readonly Container content;
private readonly SpriteIcon icon;
- private readonly Box hover;
public IconButton()
{
AutoSizeAxes = Axes.Both;
+ ButtonSize = new Vector2(BUTTON_SIZE);
- Children = new Drawable[]
+ Add(icon = new SpriteIcon
{
- content = new Container
- {
- Origin = Anchor.Centre,
- Anchor = Anchor.Centre,
- Size = new Vector2(BUTTON_SIZE),
- CornerRadius = 5,
- Masking = true,
- EdgeEffect = new EdgeEffectParameters
- {
- Colour = Color4.Black.Opacity(0.04f),
- Type = EdgeEffectType.Shadow,
- Radius = 5,
- },
- Children = new Drawable[]
- {
- hover = new Box
- {
- RelativeSizeAxes = Axes.Both,
- Alpha = 0,
- },
- icon = new SpriteIcon
- {
- Origin = Anchor.Centre,
- Anchor = Anchor.Centre,
- Size = new Vector2(18),
- }
- }
- }
- };
- }
-
- [BackgroundDependencyLoader]
- private void load(OsuColour colours)
- {
- if (hoverColour == null)
- HoverColour = colours.Yellow.Opacity(0.6f);
-
- if (flashColour == null)
- FlashColour = colours.Yellow;
-
- Enabled.ValueChanged += enabled => this.FadeColour(enabled ? Color4.White : colours.Gray9, 200, Easing.OutQuint);
+ Origin = Anchor.Centre,
+ Anchor = Anchor.Centre,
+ Size = new Vector2(18),
+ });
}
protected override bool OnHover(InputState state)
{
- hover.FadeIn(500, Easing.OutQuint);
icon.FadeColour(IconHoverColour, 500, Easing.OutQuint);
return base.OnHover(state);
}
protected override void OnHoverLost(InputState state)
{
- hover.FadeOut(500, Easing.OutQuint);
icon.FadeColour(IconColour, 500, Easing.OutQuint);
base.OnHoverLost(state);
}
-
- protected override bool OnClick(InputState state)
- {
- hover.FlashColour(FlashColour, 800, Easing.OutQuint);
- return base.OnClick(state);
- }
-
- protected override bool OnMouseDown(InputState state, MouseDownEventArgs args)
- {
- content.ScaleTo(0.75f, 2000, Easing.OutQuint);
- return base.OnMouseDown(state, args);
- }
-
- protected override bool OnMouseUp(InputState state, MouseUpEventArgs args)
- {
- content.ScaleTo(1, 1000, Easing.OutElastic);
- return base.OnMouseUp(state, args);
- }
}
}
diff --git a/osu.Game/Graphics/UserInterface/OsuAnimatedButton.cs b/osu.Game/Graphics/UserInterface/OsuAnimatedButton.cs
new file mode 100644
index 0000000000..990a2f20a9
--- /dev/null
+++ b/osu.Game/Graphics/UserInterface/OsuAnimatedButton.cs
@@ -0,0 +1,109 @@
+// Copyright (c) 2007-2018 ppy Pty Ltd .
+// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
+
+using osu.Framework.Allocation;
+using osu.Framework.Extensions.Color4Extensions;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Shapes;
+using osu.Framework.Input;
+using osu.Game.Graphics.Containers;
+using OpenTK.Graphics;
+
+namespace osu.Game.Graphics.UserInterface
+{
+ ///
+ /// Highlight on hover, bounce on click.
+ ///
+ public class OsuAnimatedButton : OsuClickableContainer
+ {
+ ///
+ /// The colour that should be flashed when the is clicked.
+ ///
+ protected Color4 FlashColour = Color4.White.Opacity(0.3f);
+
+ private Color4 hoverColour = Color4.White.Opacity(0.1f);
+
+ ///
+ /// The background colour of the while it is hovered.
+ ///
+ protected Color4 HoverColour
+ {
+ get => hoverColour;
+ set
+ {
+ hoverColour = value;
+ hover.Colour = value;
+ }
+ }
+
+ protected override Container Content => content;
+
+ private readonly Container content;
+ private readonly Box hover;
+
+ public OsuAnimatedButton()
+ {
+ base.Content.Add(content = new Container
+ {
+ Origin = Anchor.Centre,
+ Anchor = Anchor.Centre,
+ RelativeSizeAxes = Axes.Both,
+ CornerRadius = 5,
+ Masking = true,
+ EdgeEffect = new EdgeEffectParameters
+ {
+ Colour = Color4.Black.Opacity(0.04f),
+ Type = EdgeEffectType.Shadow,
+ Radius = 5,
+ },
+ Children = new Drawable[]
+ {
+ hover = new Box
+ {
+ RelativeSizeAxes = Axes.Both,
+ Colour = HoverColour,
+ Blending = BlendingMode.Additive,
+ Alpha = 0,
+ },
+ }
+ });
+ }
+
+ [BackgroundDependencyLoader]
+ private void load(OsuColour colours)
+ {
+ Enabled.BindValueChanged(enabled => this.FadeColour(enabled ? Color4.White : colours.Gray9, 200, Easing.OutQuint), true);
+ }
+
+ protected override bool OnHover(InputState state)
+ {
+ hover.FadeIn(500, Easing.OutQuint);
+ return base.OnHover(state);
+ }
+
+ protected override void OnHoverLost(InputState state)
+ {
+ hover.FadeOut(500, Easing.OutQuint);
+ base.OnHoverLost(state);
+ }
+
+ protected override bool OnClick(InputState state)
+ {
+ hover.FlashColour(FlashColour, 800, Easing.OutQuint);
+ return base.OnClick(state);
+ }
+
+ protected override bool OnMouseDown(InputState state, MouseDownEventArgs args)
+ {
+ Content.ScaleTo(0.75f, 2000, Easing.OutQuint);
+ return base.OnMouseDown(state, args);
+ }
+
+ protected override bool OnMouseUp(InputState state, MouseUpEventArgs args)
+ {
+ Content.ScaleTo(1, 1000, Easing.OutElastic);
+ return base.OnMouseUp(state, args);
+ }
+ }
+}
diff --git a/osu.Game/Overlays/Direct/DownloadButton.cs b/osu.Game/Overlays/Direct/DownloadButton.cs
index 2d678c572c..5c5e4907ed 100644
--- a/osu.Game/Overlays/Direct/DownloadButton.cs
+++ b/osu.Game/Overlays/Direct/DownloadButton.cs
@@ -3,19 +3,16 @@
using osu.Framework.Allocation;
using osu.Framework.Graphics;
-using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
-using osu.Framework.Input;
using osu.Game.Beatmaps;
using osu.Game.Beatmaps.Drawables;
using osu.Game.Graphics;
-using osu.Game.Graphics.Containers;
+using osu.Game.Graphics.UserInterface;
using OpenTK;
-using OpenTK.Graphics;
namespace osu.Game.Overlays.Direct
{
- public class DownloadButton : OsuClickableContainer
+ public class DownloadButton : OsuAnimatedButton
{
private readonly SpriteIcon icon;
private readonly SpriteIcon checkmark;
@@ -26,17 +23,13 @@ namespace osu.Game.Overlays.Direct
public DownloadButton(BeatmapSetInfo set, bool noVideo = false)
{
- Children = new Drawable[]
+ AddRange(new Drawable[]
{
downloader = new BeatmapSetDownloader(set, noVideo),
- new CircularContainer
+ background = new Box
{
RelativeSizeAxes = Axes.Both,
- Masking = true,
- Child = background = new Box
- {
- RelativeSizeAxes = Axes.Both,
- },
+ Depth = float.MaxValue
},
icon = new SpriteIcon
{
@@ -53,18 +46,19 @@ namespace osu.Game.Overlays.Direct
Size = Vector2.Zero,
Icon = FontAwesome.fa_check,
}
- };
+ });
Action = () =>
{
- if (downloader.DownloadState.Value == BeatmapSetDownloader.DownloadStatus.Downloading)
+ if (downloader.DownloadState == BeatmapSetDownloader.DownloadStatus.Downloading)
{
+ // todo: replace with ShakeContainer after https://github.com/ppy/osu/pull/2909 is merged.
Content.MoveToX(-5, 50, Easing.OutSine).Then()
.MoveToX(5, 100, Easing.InOutSine).Then()
.MoveToX(-5, 100, Easing.InOutSine).Then()
.MoveToX(0, 50, Easing.InSine);
}
- else if (downloader.DownloadState.Value == BeatmapSetDownloader.DownloadStatus.Downloaded)
+ else if (downloader.DownloadState == BeatmapSetDownloader.DownloadStatus.Downloaded)
{
// TODO: Jump to song select with this set when the capability is implemented
}
@@ -73,54 +67,24 @@ namespace osu.Game.Overlays.Direct
downloader.Download();
}
};
-
- downloader.DownloadState.ValueChanged += _ => updateState();
-
- Colour = Color4.White;
}
protected override void LoadComplete()
{
base.LoadComplete();
- updateState();
+ downloader.DownloadState.BindValueChanged(updateState, true);
}
- [BackgroundDependencyLoader(permitNulls:true)]
+ [BackgroundDependencyLoader(permitNulls: true)]
private void load(OsuColour colours)
{
this.colours = colours;
}
- protected override bool OnMouseDown(InputState state, MouseDownEventArgs args)
+ private void updateState(BeatmapSetDownloader.DownloadStatus state)
{
- Content.ScaleTo(0.9f, 1000, Easing.Out);
- return base.OnMouseDown(state, args);
- }
-
- protected override bool OnMouseUp(InputState state, MouseUpEventArgs args)
- {
- Content.ScaleTo(1f, 500, Easing.OutElastic);
- return base.OnMouseUp(state, args);
- }
-
- protected override bool OnHover(InputState state)
- {
- Content.ScaleTo(1.1f, 500, Easing.OutElastic);
- return base.OnHover(state);
- }
-
- protected override void OnHoverLost(InputState state)
- {
- Content.ScaleTo(1f, 500, Easing.OutElastic);
- }
-
- private void updateState()
- {
- if (!IsLoaded)
- return;
-
- switch (downloader.DownloadState.Value)
+ switch (state)
{
case BeatmapSetDownloader.DownloadStatus.NotDownloaded:
background.FadeColour(colours.Gray4, 500, Easing.InOutExpo);
diff --git a/osu.Game/Overlays/MusicController.cs b/osu.Game/Overlays/MusicController.cs
index a57d5fd183..56af04c498 100644
--- a/osu.Game/Overlays/MusicController.cs
+++ b/osu.Game/Overlays/MusicController.cs
@@ -142,14 +142,14 @@ namespace osu.Game.Overlays
Anchor = Anchor.Centre,
Children = new[]
{
- prevButton = new IconButton
+ prevButton = new MusicIconButton
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Action = prev,
Icon = FontAwesome.fa_step_backward,
},
- playButton = new IconButton
+ playButton = new MusicIconButton
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
@@ -158,7 +158,7 @@ namespace osu.Game.Overlays
Action = play,
Icon = FontAwesome.fa_play_circle_o,
},
- nextButton = new IconButton
+ nextButton = new MusicIconButton
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
@@ -167,7 +167,7 @@ namespace osu.Game.Overlays
},
}
},
- playlistButton = new IconButton
+ playlistButton = new MusicIconButton
{
Origin = Anchor.Centre,
Anchor = Anchor.CentreRight,
@@ -405,6 +405,16 @@ namespace osu.Game.Overlays
Prev
}
+ private class MusicIconButton : IconButton
+ {
+ [BackgroundDependencyLoader]
+ private void load(OsuColour colours)
+ {
+ HoverColour = colours.YellowDark.Opacity(0.6f);
+ FlashColour = colours.Yellow;
+ }
+ }
+
private class Background : BufferedContainer
{
private readonly Sprite sprite;
diff --git a/osu.Game/Screens/Edit/Screens/Compose/Timeline/TimelineButton.cs b/osu.Game/Screens/Edit/Screens/Compose/Timeline/TimelineButton.cs
index f46cc7ef9d..5928fbaa1b 100644
--- a/osu.Game/Screens/Edit/Screens/Compose/Timeline/TimelineButton.cs
+++ b/osu.Game/Screens/Edit/Screens/Compose/Timeline/TimelineButton.cs
@@ -27,16 +27,7 @@ namespace osu.Game.Screens.Edit.Screens.Compose.Timeline
public TimelineButton()
{
- InternalChild = button = new IconButton
- {
- Anchor = Anchor.Centre,
- Origin = Anchor.Centre,
- IconColour = OsuColour.Gray(0.35f),
- IconHoverColour = Color4.White,
- HoverColour = OsuColour.Gray(0.25f),
- FlashColour = OsuColour.Gray(0.5f),
- Action = () => Action?.Invoke()
- };
+ InternalChild = button = new TimelineIconButton { Action = () => Action?.Invoke() };
button.Enabled.BindTo(Enabled);
Width = button.ButtonSize.X;
@@ -48,5 +39,18 @@ namespace osu.Game.Screens.Edit.Screens.Compose.Timeline
button.ButtonSize = new Vector2(button.ButtonSize.X, DrawHeight);
}
+
+ private class TimelineIconButton : IconButton
+ {
+ public TimelineIconButton()
+ {
+ Anchor = Anchor.Centre;
+ Origin = Anchor.Centre;
+ IconColour = OsuColour.Gray(0.35f);
+ IconHoverColour = Color4.White;
+ HoverColour = OsuColour.Gray(0.25f);
+ FlashColour = OsuColour.Gray(0.5f);
+ }
+ }
}
}