From bc03a2a9303d7e4338f1d1683e21ea0900e0100d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bart=C5=82omiej=20Dach?= Date: Fri, 25 Apr 2025 08:52:59 +0200 Subject: [PATCH] Attempt to improve appearance of new combo toggle / combo colour control when contracted Follow-up to https://discord.com/channels/188630481301012481/188630652340404224/1364909125812617258. Not sure if better, but an attempt was made? --- .../Graphics/Containers/ExpandingContainer.cs | 4 +- .../TernaryButtons/DrawableTernaryButton.cs | 2 +- .../TernaryButtons/NewComboTernaryButton.cs | 42 ++++++++++++------- 3 files changed, 31 insertions(+), 17 deletions(-) diff --git a/osu.Game/Graphics/Containers/ExpandingContainer.cs b/osu.Game/Graphics/Containers/ExpandingContainer.cs index 2abdb508ae..477de616ac 100644 --- a/osu.Game/Graphics/Containers/ExpandingContainer.cs +++ b/osu.Game/Graphics/Containers/ExpandingContainer.cs @@ -14,6 +14,8 @@ namespace osu.Game.Graphics.Containers /// public partial class ExpandingContainer : Container, IExpandingContainer { + public const double TRANSITION_DURATION = 500; + private readonly float contractedWidth; private readonly float expandedWidth; @@ -61,7 +63,7 @@ namespace osu.Game.Graphics.Containers Expanded.BindValueChanged(v => { - this.ResizeWidthTo(v.NewValue ? expandedWidth : contractedWidth, 500, Easing.OutQuint); + this.ResizeWidthTo(v.NewValue ? expandedWidth : contractedWidth, TRANSITION_DURATION, Easing.OutQuint); }, true); } diff --git a/osu.Game/Screens/Edit/Components/TernaryButtons/DrawableTernaryButton.cs b/osu.Game/Screens/Edit/Components/TernaryButtons/DrawableTernaryButton.cs index 326fdbc731..7b36b5f957 100644 --- a/osu.Game/Screens/Edit/Components/TernaryButtons/DrawableTernaryButton.cs +++ b/osu.Game/Screens/Edit/Components/TernaryButtons/DrawableTernaryButton.cs @@ -47,7 +47,7 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons private Color4 selectedBackgroundColour; private Color4 selectedIconColour; - protected Drawable Icon { get; private set; } = null!; + public Drawable Icon { get; private set; } = null!; public DrawableTernaryButton() { diff --git a/osu.Game/Screens/Edit/Components/TernaryButtons/NewComboTernaryButton.cs b/osu.Game/Screens/Edit/Components/TernaryButtons/NewComboTernaryButton.cs index c6ecee5f45..259fda70c5 100644 --- a/osu.Game/Screens/Edit/Components/TernaryButtons/NewComboTernaryButton.cs +++ b/osu.Game/Screens/Edit/Components/TernaryButtons/NewComboTernaryButton.cs @@ -40,11 +40,14 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons private readonly BindableList selectedHitObjects = new BindableList(); private readonly BindableList comboColours = new BindableList(); + private readonly Bindable expanded = new Bindable(true); + private Container mainButtonContainer = null!; private ColourPickerButton pickerButton = null!; + private DrawableTernaryButton mainButton = null!; [BackgroundDependencyLoader] - private void load(EditorBeatmap editorBeatmap) + private void load(EditorBeatmap editorBeatmap, IExpandingContainer? expandableParent) { RelativeSizeAxes = Axes.X; AutoSizeAxes = Axes.Y; @@ -54,7 +57,7 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons { RelativeSizeAxes = Axes.X, AutoSizeAxes = Axes.Y, - Child = new DrawableTernaryButton + Child = mainButton = new DrawableTernaryButton { Current = Current, Description = "New combo", @@ -65,8 +68,6 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons { Anchor = Anchor.CentreRight, Origin = Anchor.CentreRight, - Alpha = 0, - Width = 25, ComboColours = { BindTarget = comboColours } } }; @@ -74,6 +75,9 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons selectedHitObjects.BindTo(editorBeatmap.SelectedHitObjects); if (editorBeatmap.BeatmapSkin != null) comboColours.BindTo(editorBeatmap.BeatmapSkin.ComboColours); + + if (expandableParent != null) + expanded.BindTo(expandableParent.Expanded); } protected override void LoadComplete() @@ -82,6 +86,7 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons selectedHitObjects.BindCollectionChanged((_, _) => updateState()); comboColours.BindCollectionChanged((_, _) => updateState()); + expanded.BindValueChanged(_ => updateState()); Current.BindValueChanged(_ => updateState(), true); } @@ -89,14 +94,21 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons { if (Current.Value == TernaryState.True && selectedHitObjects.Count == 1 && selectedHitObjects.Single() is IHasComboInformation hasCombo && comboColours.Count > 1) { - mainButtonContainer.Padding = new MarginPadding { Right = 30 }; + float targetPickerButtonWidth = expanded.Value ? 25 : 10; + + pickerButton.ResizeWidthTo(targetPickerButtonWidth, ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); pickerButton.SelectedHitObject.Value = hasCombo; - pickerButton.Alpha = 1; + pickerButton.Icon.Alpha = expanded.Value ? 1 : 0; + + mainButtonContainer.TransformTo(nameof(mainButtonContainer.Padding), new MarginPadding { Right = targetPickerButtonWidth + 5 }, ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); + mainButton.Icon.MoveToX(expanded.Value ? 10 : 2.5f, ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); } else { - mainButtonContainer.Padding = new MarginPadding(); - pickerButton.Alpha = 0; + pickerButton.ResizeWidthTo(0, ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); + + mainButtonContainer.TransformTo(nameof(mainButtonContainer.Padding), new MarginPadding(), ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); + mainButton.Icon.MoveToX(10, ExpandingContainer.TRANSITION_DURATION, Easing.OutQuint); } } @@ -111,12 +123,12 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons [Resolved] private OverlayColourProvider colourProvider { get; set; } = null!; - private SpriteIcon icon = null!; + public SpriteIcon Icon { get; private set; } = null!; [BackgroundDependencyLoader] private void load() { - Add(icon = new SpriteIcon + Add(Icon = new SpriteIcon { Icon = FontAwesome.Solid.Palette, Size = new Vector2(16), @@ -149,17 +161,17 @@ namespace osu.Game.Screens.Edit.Components.TernaryButtons { Enabled.Value = SelectedHitObject.Value != null; - if (SelectedHitObject.Value == null || SelectedHitObject.Value.ComboOffset == 0 || ComboColours.Count <= 1) + if (SelectedHitObject.Value == null || SelectedHitObject.Value.ComboOffset == 0 || ComboColours.Count <= 1 || !SelectedHitObject.Value.NewCombo) { BackgroundColour = colourProvider.Background3; - icon.Colour = BackgroundColour.Darken(0.5f); - icon.Blending = BlendingParameters.Additive; + Icon.Colour = BackgroundColour.Darken(0.5f); + Icon.Blending = BlendingParameters.Additive; } else { BackgroundColour = ComboColours[comboIndexFor(SelectedHitObject.Value, ComboColours)]; - icon.Colour = OsuColour.ForegroundTextColourFor(BackgroundColour); - icon.Blending = BlendingParameters.Inherit; + Icon.Colour = OsuColour.ForegroundTextColourFor(BackgroundColour); + Icon.Blending = BlendingParameters.Inherit; } }