Split out expanding container logic from settings sidebar

This commit is contained in:
Dean Herbert 2022-01-06 17:15:42 +09:00
parent 1d69eb629c
commit 77980196c5
5 changed files with 65 additions and 42 deletions

View File

@ -1,47 +1,47 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
using System;
using System.Linq;
using osu.Framework;
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Framework.Testing;
using osu.Framework.Threading;
using osu.Game.Graphics;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.UserInterface;
using osu.Game.Overlays.Settings;
using osuTK;
namespace osu.Game.Overlays.Settings
namespace osu.Game.Overlays
{
public class Sidebar : Container<SidebarIconButton>, IStateful<ExpandedState>
public abstract class ExpandingButtonContainer : Container, IStateful<ExpandedState>
{
private readonly Box background;
private readonly FillFlowContainer<SidebarIconButton> content;
public const float DEFAULT_WIDTH = 70;
public const int EXPANDED_WIDTH = 200;
private readonly float contractedWidth;
private readonly float expandedWidth;
public event Action<ExpandedState> StateChanged;
protected override Container<SidebarIconButton> Content => content;
protected override Container<Drawable> Content => FillFlow;
public Sidebar()
protected FillFlowContainer FillFlow { get; }
protected ExpandingButtonContainer(float contractedWidth, float expandedWidth)
{
this.contractedWidth = contractedWidth;
this.expandedWidth = expandedWidth;
RelativeSizeAxes = Axes.Y;
Width = contractedWidth;
InternalChildren = new Drawable[]
{
background = new Box
{
Colour = OsuColour.Gray(0.02f),
RelativeSizeAxes = Axes.Both,
},
new SidebarScrollContainer
{
Children = new[]
{
content = new FillFlowContainer<SidebarIconButton>
FillFlow = new FillFlowContainer
{
Origin = Anchor.CentreLeft,
Anchor = Anchor.CentreLeft,
@ -54,12 +54,6 @@ public Sidebar()
};
}
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
background.Colour = colourProvider.Background5;
}
private ScheduledDelegate expandEvent;
private ExpandedState state;
@ -107,11 +101,11 @@ public ExpandedState State
switch (state)
{
default:
this.ResizeTo(new Vector2(DEFAULT_WIDTH, Height), 500, Easing.OutQuint);
this.ResizeTo(new Vector2(contractedWidth, Height), 500, Easing.OutQuint);
break;
case ExpandedState.Expanded:
this.ResizeTo(new Vector2(EXPANDED_WIDTH, Height), 500, Easing.OutQuint);
this.ResizeTo(new Vector2(expandedWidth, Height), 500, Easing.OutQuint);
break;
}
@ -121,15 +115,13 @@ public ExpandedState State
private Drawable lastHoveredButton;
private Drawable hoveredButton => content.Children.FirstOrDefault(c => c.IsHovered);
private Drawable hoveredButton => FillFlow.ChildrenOfType<OsuButton>().FirstOrDefault(c => c.IsHovered);
private void queueExpandIfHovering()
{
// only expand when we hover a different button.
if (lastHoveredButton == hoveredButton) return;
if (!IsHovered) return;
if (State != ExpandedState.Expanded)
{
expandEvent?.Cancel();
@ -139,10 +131,4 @@ private void queueExpandIfHovering()
lastHoveredButton = hoveredButton;
}
}
public enum ExpandedState
{
Contracted,
Expanded,
}
}

View File

@ -0,0 +1,37 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Shapes;
namespace osu.Game.Overlays.Settings
{
public class SettingsSidebar : ExpandingButtonContainer
{
public const float DEFAULT_WIDTH = 70;
public const int EXPANDED_WIDTH = 200;
public SettingsSidebar()
: base(DEFAULT_WIDTH, EXPANDED_WIDTH)
{
}
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
AddInternal(new Box
{
Colour = colourProvider.Background5,
RelativeSizeAxes = Axes.Both,
Depth = float.MaxValue
});
}
}
public enum ExpandedState
{
Contracted,
Expanded,
}
}

View File

@ -62,14 +62,14 @@ public SidebarIconButton()
{
textIconContent = new Container
{
Width = Sidebar.DEFAULT_WIDTH,
Width = SettingsSidebar.DEFAULT_WIDTH,
RelativeSizeAxes = Axes.Y,
Colour = OsuColour.Gray(0.6f),
Children = new Drawable[]
{
headerText = new OsuSpriteText
{
Position = new Vector2(Sidebar.DEFAULT_WIDTH + 10, 0),
Position = new Vector2(SettingsSidebar.DEFAULT_WIDTH + 10, 0),
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
},

View File

@ -27,7 +27,7 @@ public abstract class SettingsPanel : OsuFocusedOverlayContainer
public const float TRANSITION_LENGTH = 600;
private const float sidebar_width = Sidebar.DEFAULT_WIDTH;
private const float sidebar_width = SettingsSidebar.DEFAULT_WIDTH;
/// <summary>
/// The width of the settings panel content, excluding the sidebar.
@ -43,7 +43,7 @@ public abstract class SettingsPanel : OsuFocusedOverlayContainer
protected override Container<Drawable> Content => ContentContainer;
protected Sidebar Sidebar;
protected SettingsSidebar Sidebar;
private SidebarIconButton selectedSidebarButton;
public SettingsSectionsContainer SectionsContainer { get; private set; }
@ -129,7 +129,7 @@ private void load()
if (showSidebar)
{
AddInternal(Sidebar = new Sidebar { Width = sidebar_width });
AddInternal(Sidebar = new SettingsSidebar { Width = sidebar_width });
}
CreateSections()?.ForEach(AddSection);
@ -244,7 +244,7 @@ private void loadSidebarButtons()
if (selectedSidebarButton != null)
selectedSidebarButton.Selected = false;
selectedSidebarButton = Sidebar.Children.FirstOrDefault(b => b.Section == section.NewValue);
selectedSidebarButton = Sidebar.Children.OfType<SidebarIconButton>().FirstOrDefault(b => b.Section == section.NewValue);
if (selectedSidebarButton != null)
selectedSidebarButton.Selected = true;

View File

@ -39,7 +39,7 @@ private class BackButton : SidebarButton
[BackgroundDependencyLoader]
private void load()
{
Size = new Vector2(Sidebar.DEFAULT_WIDTH);
Size = new Vector2(SettingsSidebar.DEFAULT_WIDTH);
AddRange(new Drawable[]
{