RepoMirrors/osu
1
0
Fork 0
mirror of https://github.com/ppy/osu synced 2025-01-03 04:42:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Split out ShearedButton from ShearedToggleButton

Browse Source
This commit is contained in:
Dean Herbert 2022-04-26 17:31:55 +09:00
parent c52c08fe97
commit 9f33e627de
2 changed files with 190 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

174
osu.Game/Graphics/UserInterface/ShearedButton.cs Normal file
View File

@ -0,0 +1,174 @@
// 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.
#nullable enable
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Colour;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Framework.Localisation;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Overlays;
using osuTK;
namespace osu.Game.Graphics.UserInterface
{
public class ShearedButton : OsuClickableContainer
{
public LocalisableString Text
{
get => text.Text;
set => text.Text = value;
}
public Colour4 DarkerColour
{
set
{
darkerColour = value;
Scheduler.AddOnce(updateState);
}
}
public Colour4 LighterColour
{
set
{
lighterColour = value;
Scheduler.AddOnce(updateState);
}
}
public Colour4 TextColour
{
set
{
textColour = value;
Scheduler.AddOnce(updateState);
}
}
[Resolved]
protected OverlayColourProvider ColourProvider { get; private set; } = null!;
private readonly Box background;
private readonly OsuSpriteText text;
private const float shear = 0.2f;
private Colour4? darkerColour;
private Colour4? lighterColour;
private Colour4? textColour;
/// <summary>
/// Creates a new <see cref="ShearedToggleButton"/>
/// </summary>
/// <param name="width">
/// The width of the button.
/// <list type="bullet">
/// <item>If a non-<see langword="null"/> value is provided, this button will have a fixed width equal to the provided value.</item>
/// <item>If a <see langword="null"/> value is provided (or the argument is omitted entirely), the button will autosize in width to fit the text.</item>
/// </list>
/// </param>
public ShearedButton(float? width = null)
{
Height = 50;
Padding = new MarginPadding { Horizontal = shear * 50 };
Content.CornerRadius = 7;
Content.Shear = new Vector2(shear, 0);
Content.Masking = true;
Content.BorderThickness = 2;
Content.Anchor = Content.Origin = Anchor.Centre;
Children = new Drawable[]
{
background = new Box
{
RelativeSizeAxes = Axes.Both
},
text = new OsuSpriteText
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Font = OsuFont.TorusAlternate.With(size: 17),
Shear = new Vector2(-shear, 0)
}
};
if (width != null)
{
Width = width.Value;
}
else
{
AutoSizeAxes = Axes.X;
text.Margin = new MarginPadding { Horizontal = 15 };
}
}
protected override HoverSounds CreateHoverSounds(HoverSampleSet sampleSet) => new HoverClickSounds(sampleSet);
protected override void LoadComplete()
{
base.LoadComplete();
Enabled.BindValueChanged(_ => Scheduler.AddOnce(updateState));
updateState();
FinishTransforms(true);
}
protected override bool OnHover(HoverEvent e)
{
Scheduler.AddOnce(updateState);
return base.OnHover(e);
}
protected override void OnHoverLost(HoverLostEvent e)
{
Scheduler.AddOnce(updateState);
base.OnHoverLost(e);
}
protected override bool OnMouseDown(MouseDownEvent e)
{
Content.ScaleTo(0.8f, 2000, Easing.OutQuint);
return base.OnMouseDown(e);
}
protected override void OnMouseUp(MouseUpEvent e)
{
Content.ScaleTo(1, 1000, Easing.OutElastic);
base.OnMouseUp(e);
}
private void updateState()
{
var colourDark = darkerColour ?? ColourProvider.Background3;
var colourLight = lighterColour ?? ColourProvider.Background1;
var colourText = textColour ?? ColourProvider.Content1;
if (!Enabled.Value)
{
colourDark = colourDark.Darken(0.3f);
colourLight = colourLight.Darken(0.3f);
}
else if (IsHovered)
{
colourDark = colourDark.Lighten(0.3f);
colourLight = colourLight.Lighten(0.3f);
}
background.FadeColour(colourDark, 150, Easing.OutQuint);
Content.TransformTo(nameof(BorderColour), ColourInfo.GradientVertical(colourDark, colourLight), 150, Easing.OutQuint);
if (!Enabled.Value)
colourText = colourText.Opacity(0.6f);
text.FadeColour(colourText, 150, Easing.OutQuint);
}
}
}

131
osu.Game/Graphics/UserInterface/ShearedToggleButton.cs
View File

@ -8,39 +8,18 @@ using osu.Framework.Allocation;
using osu.Framework.Audio;
using osu.Framework.Audio.Sample;
using osu.Framework.Bindables;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Colour;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Framework.Localisation;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Game.Overlays;
using osuTK;
namespace osu.Game.Graphics.UserInterface
{
public class ShearedToggleButton : OsuClickableContainer
public class ShearedToggleButton : ShearedButton
{
public BindableBool Active { get; } = new BindableBool();
public LocalisableString Text
{
get => text.Text;
set => text.Text = value;
}
private readonly Box background;
private readonly OsuSpriteText text;
private Sample? sampleOff;
private Sample? sampleOn;
private const float shear = 0.2f;
[Resolved]
private OverlayColourProvider colourProvider { get; set; } = null!;
/// <summary>
/// Whether this button is currently toggled to an active state.
/// </summary>
public BindableBool Active { get; } = new BindableBool();
/// <summary>
/// Creates a new <see cref="ShearedToggleButton"/>
@ -53,40 +32,8 @@ namespace osu.Game.Graphics.UserInterface
/// </list>
/// </param>
public ShearedToggleButton(float? width = null)
: base(width)
{
Height = 50;
Padding = new MarginPadding { Horizontal = shear * 50 };
Content.CornerRadius = 7;
Content.Shear = new Vector2(shear, 0);
Content.Masking = true;
Content.BorderThickness = 2;
Content.Anchor = Content.Origin = Anchor.Centre;
Children = new Drawable[]
{
background = new Box
{
RelativeSizeAxes = Axes.Both
},
text = new OsuSpriteText
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Font = OsuFont.TorusAlternate.With(size: 17),
Shear = new Vector2(-shear, 0)
}
};
if (width != null)
{
Width = width.Value;
}
else
{
AutoSizeAxes = Axes.X;
text.Margin = new MarginPadding { Horizontal = 15 };
}
}
[BackgroundDependencyLoader]
@ -100,70 +47,24 @@ namespace osu.Game.Graphics.UserInterface
protected override void LoadComplete()
{
base.LoadComplete();
Active.BindValueChanged(_ =>
{
updateState();
updateActiveState();
playSample();
});
Active.BindDisabledChanged(disabled =>
{
updateState();
Action = disabled ? (Action?)null : Active.Toggle;
}, true);
FinishTransforms(true);
updateActiveState();
Active.BindDisabledChanged(disabled => Action = disabled ? (Action?)null : Active.Toggle, true);
base.LoadComplete();
}
protected override bool OnHover(HoverEvent e)
private void updateActiveState()
{
updateState();
return base.OnHover(e);
}
protected override void OnHoverLost(HoverLostEvent e)
{
updateState();
base.OnHoverLost(e);
}
protected override bool OnMouseDown(MouseDownEvent e)
{
Content.ScaleTo(0.8f, 2000, Easing.OutQuint);
return base.OnMouseDown(e);
}
protected override void OnMouseUp(MouseUpEvent e)
{
Content.ScaleTo(1, 1000, Easing.OutElastic);
base.OnMouseUp(e);
}
private void updateState()
{
var darkerColour = Active.Value ? colourProvider.Highlight1 : colourProvider.Background3;
var lighterColour = Active.Value ? colourProvider.Colour0 : colourProvider.Background1;
if (Active.Disabled)
{
darkerColour = darkerColour.Darken(0.3f);
lighterColour = lighterColour.Darken(0.3f);
}
else if (IsHovered)
{
darkerColour = darkerColour.Lighten(0.3f);
lighterColour = lighterColour.Lighten(0.3f);
}
background.FadeColour(darkerColour, 150, Easing.OutQuint);
Content.TransformTo(nameof(BorderColour), ColourInfo.GradientVertical(darkerColour, lighterColour), 150, Easing.OutQuint);
var textColour = Active.Value ? colourProvider.Background6 : colourProvider.Content1;
if (Active.Disabled)
textColour = textColour.Opacity(0.6f);
text.FadeColour(textColour, 150, Easing.OutQuint);
DarkerColour = Active.Value ? ColourProvider.Highlight1 : ColourProvider.Background3;
LighterColour = Active.Value ? ColourProvider.Colour0 : ColourProvider.Background1;
TextColour = Active.Value ? ColourProvider.Background6 : ColourProvider.Content1;
}
private void playSample()