From ef03787fe09ad6707675e4793a05b6135bb11079 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bart=C5=82omiej=20Dach?= Date: Sat, 16 Oct 2021 18:33:17 +0200 Subject: [PATCH] Split dropdown accent colour into hover and selection colours --- .../Collections/CollectionFilterDropdown.cs | 6 +- .../Graphics/UserInterface/OsuDropdown.cs | 113 +++++++----------- .../Graphics/UserInterface/OsuTabDropdown.cs | 35 +++++- osu.Game/Overlays/Login/UserDropdown.cs | 8 +- osu.Game/Overlays/Music/CollectionDropdown.cs | 8 +- .../Overlays/Rankings/SpotlightSelector.cs | 11 +- 6 files changed, 90 insertions(+), 91 deletions(-) diff --git a/osu.Game/Collections/CollectionFilterDropdown.cs b/osu.Game/Collections/CollectionFilterDropdown.cs index 1eceb56e33..7067f82fd3 100644 --- a/osu.Game/Collections/CollectionFilterDropdown.cs +++ b/osu.Game/Collections/CollectionFilterDropdown.cs @@ -181,7 +181,11 @@ namespace osu.Game.Collections MaxHeight = 200; } - protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new CollectionDropdownMenuItem(item); + protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new CollectionDropdownMenuItem(item) + { + BackgroundColourHover = HoverColour, + BackgroundColourSelected = SelectionColour + }; } protected class CollectionDropdownMenuItem : OsuDropdownMenu.DrawableOsuDropdownMenuItem diff --git a/osu.Game/Graphics/UserInterface/OsuDropdown.cs b/osu.Game/Graphics/UserInterface/OsuDropdown.cs index 5831d9ab1f..021f36d4fd 100644 --- a/osu.Game/Graphics/UserInterface/OsuDropdown.cs +++ b/osu.Game/Graphics/UserInterface/OsuDropdown.cs @@ -21,44 +21,17 @@ using osuTK.Graphics; namespace osu.Game.Graphics.UserInterface { - public class OsuDropdown : Dropdown, IHasAccentColour + public class OsuDropdown : Dropdown { private const float corner_radius = 5; - private Color4 accentColour; - - public Color4 AccentColour - { - get => accentColour; - set - { - accentColour = value; - updateAccentColour(); - } - } - - [BackgroundDependencyLoader(true)] - private void load(OverlayColourProvider? colourProvider, OsuColour colours) - { - if (accentColour == default) - accentColour = colourProvider?.Light4 ?? colours.PinkDarker; - updateAccentColour(); - } - - private void updateAccentColour() - { - if (Header is IHasAccentColour header) header.AccentColour = accentColour; - - if (Menu is IHasAccentColour menu) menu.AccentColour = accentColour; - } - protected override DropdownHeader CreateHeader() => new OsuDropdownHeader(); protected override DropdownMenu CreateMenu() => new OsuDropdownMenu(); #region OsuDropdownMenu - protected class OsuDropdownMenu : DropdownMenu, IHasAccentColour + protected class OsuDropdownMenu : DropdownMenu { public override bool HandleNonPositionalInput => State == MenuState.Open; @@ -78,9 +51,11 @@ namespace osu.Game.Graphics.UserInterface } [BackgroundDependencyLoader(true)] - private void load(OverlayColourProvider? colourProvider, AudioManager audio) + private void load(OverlayColourProvider? colourProvider, OsuColour colours, AudioManager audio) { BackgroundColour = colourProvider?.Background5 ?? Color4.Black.Opacity(0.5f); + HoverColour = colourProvider?.Highlight1 ?? colours.PinkDarker; + SelectionColour = colourProvider?.Light4 ?? colours.PinkDarker.Opacity(0.5f); sampleOpen = audio.Samples.Get(@"UI/dropdown-open"); sampleClose = audio.Samples.Get(@"UI/dropdown-close"); @@ -121,57 +96,77 @@ namespace osu.Game.Graphics.UserInterface } } - private Color4 accentColour; + private Color4 hoverColour; - public Color4 AccentColour + public Color4 HoverColour { - get => accentColour; + get => hoverColour; set { - accentColour = value; - foreach (var c in Children.OfType()) - c.AccentColour = value; + hoverColour = value; + foreach (var c in Children.OfType()) + c.BackgroundColourHover = value; + } + } + + private Color4 selectionColour; + + public Color4 SelectionColour + { + get => selectionColour; + set + { + selectionColour = value; + foreach (var c in Children.OfType()) + c.BackgroundColourSelected = value; } } protected override Menu CreateSubMenu() => new OsuMenu(Direction.Vertical); - protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new DrawableOsuDropdownMenuItem(item) { AccentColour = accentColour }; + protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new DrawableOsuDropdownMenuItem(item) + { + BackgroundColourHover = HoverColour, + BackgroundColourSelected = SelectionColour + }; protected override ScrollContainer CreateScrollContainer(Direction direction) => new OsuScrollContainer(direction); #region DrawableOsuDropdownMenuItem - public class DrawableOsuDropdownMenuItem : DrawableDropdownMenuItem, IHasAccentColour + public class DrawableOsuDropdownMenuItem : DrawableDropdownMenuItem { // IsHovered is used public override bool HandlePositionalInput => true; - private Color4? accentColour; - - public Color4 AccentColour + public new Color4 BackgroundColourHover { - get => accentColour ?? nonAccentSelectedColour; + get => base.BackgroundColourHover; set { - accentColour = value; + base.BackgroundColourHover = value; + updateColours(); + } + } + + public new Color4 BackgroundColourSelected + { + get => base.BackgroundColourSelected; + set + { + base.BackgroundColourSelected = value; updateColours(); } } private void updateColours() { - BackgroundColourHover = accentColour ?? nonAccentHoverColour; - BackgroundColourSelected = accentColour ?? nonAccentSelectedColour; BackgroundColour = BackgroundColourHover.Opacity(0); UpdateBackgroundColour(); UpdateForegroundColour(); } - private Color4 nonAccentHoverColour; - private Color4 nonAccentSelectedColour; - public DrawableOsuDropdownMenuItem(MenuItem item) : base(item) { @@ -182,12 +177,8 @@ namespace osu.Game.Graphics.UserInterface } [BackgroundDependencyLoader] - private void load(OsuColour colours) + private void load() { - nonAccentHoverColour = colours.PinkDarker; - nonAccentSelectedColour = Color4.Black.Opacity(0.5f); - updateColours(); - AddInternal(new HoverSounds()); } @@ -290,7 +281,7 @@ namespace osu.Game.Graphics.UserInterface #endregion - public class OsuDropdownHeader : DropdownHeader, IHasAccentColour + public class OsuDropdownHeader : DropdownHeader { protected readonly SpriteText Text; @@ -302,18 +293,6 @@ namespace osu.Game.Graphics.UserInterface protected readonly SpriteIcon Icon; - private Color4 accentColour; - - public virtual Color4 AccentColour - { - get => accentColour; - set - { - accentColour = value; - BackgroundColourHover = accentColour; - } - } - public OsuDropdownHeader() { Foreground.Padding = new MarginPadding(10); @@ -365,7 +344,7 @@ namespace osu.Game.Graphics.UserInterface private void load(OverlayColourProvider? colourProvider, OsuColour colours) { BackgroundColour = colourProvider?.Background5 ?? Color4.Black.Opacity(0.5f); - BackgroundColourHover = colourProvider?.Light4 ?? colours.PinkDarker; + BackgroundColourHover = colourProvider?.Highlight1 ?? colours.PinkDarker; } } } diff --git a/osu.Game/Graphics/UserInterface/OsuTabDropdown.cs b/osu.Game/Graphics/UserInterface/OsuTabDropdown.cs index 24b9ca8d90..7f21f69065 100644 --- a/osu.Game/Graphics/UserInterface/OsuTabDropdown.cs +++ b/osu.Game/Graphics/UserInterface/OsuTabDropdown.cs @@ -11,8 +11,28 @@ using osu.Framework.Input.Events; namespace osu.Game.Graphics.UserInterface { - public class OsuTabDropdown : OsuDropdown + public class OsuTabDropdown : OsuDropdown, IHasAccentColour { + private Color4 accentColour; + + public Color4 AccentColour + { + get => accentColour; + set + { + accentColour = value; + + if (Menu is OsuDropdownMenu dropdownMenu) + { + dropdownMenu.HoverColour = value; + dropdownMenu.SelectionColour = value.Opacity(0.5f); + } + + if (Header is OsuTabDropdownHeader tabDropdownHeader) + tabDropdownHeader.AccentColour = value; + } + } + public OsuTabDropdown() { RelativeSizeAxes = Axes.X; @@ -37,7 +57,7 @@ namespace osu.Game.Graphics.UserInterface MaxHeight = 400; } - protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new DrawableOsuTabDropdownMenuItem(item) { AccentColour = AccentColour }; + protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new DrawableOsuTabDropdownMenuItem(item); private class DrawableOsuTabDropdownMenuItem : DrawableOsuDropdownMenuItem { @@ -49,14 +69,17 @@ namespace osu.Game.Graphics.UserInterface } } - protected class OsuTabDropdownHeader : OsuDropdownHeader + protected class OsuTabDropdownHeader : OsuDropdownHeader, IHasAccentColour { - public override Color4 AccentColour + private Color4 accentColour; + + public Color4 AccentColour { - get => base.AccentColour; + get => accentColour; set { - base.AccentColour = value; + accentColour = value; + BackgroundColourHover = value; Foreground.Colour = value; } } diff --git a/osu.Game/Overlays/Login/UserDropdown.cs b/osu.Game/Overlays/Login/UserDropdown.cs index ac4e7f8eda..d7c47351ec 100644 --- a/osu.Game/Overlays/Login/UserDropdown.cs +++ b/osu.Game/Overlays/Login/UserDropdown.cs @@ -29,12 +29,6 @@ namespace osu.Game.Overlays.Login } } - [BackgroundDependencyLoader] - private void load(OsuColour colours) - { - AccentColour = colours.Gray5; - } - protected class UserDropdownMenu : OsuDropdownMenu { public UserDropdownMenu() @@ -56,6 +50,7 @@ namespace osu.Game.Overlays.Login private void load(OsuColour colours) { BackgroundColour = colours.Gray3; + HoverColour = SelectionColour = colours.Gray5; } protected override DrawableDropdownMenuItem CreateDrawableDropdownMenuItem(MenuItem item) => new DrawableUserDropdownMenuItem(item); @@ -118,6 +113,7 @@ namespace osu.Game.Overlays.Login private void load(OsuColour colours) { BackgroundColour = colours.Gray3; + BackgroundColourHover = colours.Gray5; } } } diff --git a/osu.Game/Overlays/Music/CollectionDropdown.cs b/osu.Game/Overlays/Music/CollectionDropdown.cs index ed0ebf696b..d4686dee10 100644 --- a/osu.Game/Overlays/Music/CollectionDropdown.cs +++ b/osu.Game/Overlays/Music/CollectionDropdown.cs @@ -19,12 +19,6 @@ namespace osu.Game.Overlays.Music { protected override bool ShowManageCollectionsItem => false; - [BackgroundDependencyLoader] - private void load(OsuColour colours) - { - AccentColour = colours.Gray6; - } - protected override CollectionDropdownHeader CreateCollectionHeader() => new CollectionsHeader(); protected override CollectionDropdownMenu CreateCollectionMenu() => new CollectionsMenu(); @@ -41,6 +35,7 @@ namespace osu.Game.Overlays.Music private void load(OsuColour colours) { BackgroundColour = colours.Gray4; + HoverColour = SelectionColour = colours.Gray6; } } @@ -50,6 +45,7 @@ namespace osu.Game.Overlays.Music private void load(OsuColour colours) { BackgroundColour = colours.Gray4; + BackgroundColourHover = colours.Gray6; } public CollectionsHeader() diff --git a/osu.Game/Overlays/Rankings/SpotlightSelector.cs b/osu.Game/Overlays/Rankings/SpotlightSelector.cs index 0f071883ca..dfa45cc543 100644 --- a/osu.Game/Overlays/Rankings/SpotlightSelector.cs +++ b/osu.Game/Overlays/Rankings/SpotlightSelector.cs @@ -175,18 +175,18 @@ namespace osu.Game.Overlays.Rankings private class SpotlightsDropdown : OsuDropdown { - private DropdownMenu menu; + private OsuDropdownMenu menu; - protected override DropdownMenu CreateMenu() => menu = base.CreateMenu().With(m => m.MaxHeight = 400); + protected override DropdownMenu CreateMenu() => menu = (OsuDropdownMenu)base.CreateMenu().With(m => m.MaxHeight = 400); protected override DropdownHeader CreateHeader() => new SpotlightsDropdownHeader(); [BackgroundDependencyLoader] private void load(OverlayColourProvider colourProvider) { - // osu-web adds a 0.6 opacity container on top of the 0.5 base one when hovering, 0.8 on a single container here matches the resulting colour - AccentColour = colourProvider.Background6.Opacity(0.8f); menu.BackgroundColour = colourProvider.Background5; + menu.HoverColour = colourProvider.Background4; + menu.SelectionColour = colourProvider.Background3; Padding = new MarginPadding { Vertical = 20 }; } @@ -205,7 +205,8 @@ namespace osu.Game.Overlays.Rankings private void load(OverlayColourProvider colourProvider) { BackgroundColour = colourProvider.Background6.Opacity(0.5f); - BackgroundColourHover = colourProvider.Background5; + // osu-web adds a 0.6 opacity container on top of the 0.5 base one when hovering, 0.8 on a single container here matches the resulting colour + BackgroundColourHover = colourProvider.Background6.Opacity(0.8f); } } }