RepoMirrors/osu
1
0
Fork 0
mirror of https://github.com/ppy/osu synced 2024-12-28 09:52:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #173 from peppy/options-design-improvements

Browse Source 
Add an implementation of the new design of checkboxes.
This commit is contained in:
Thomas Müller 2016-11-15 18:13:46 +01:00 committed by GitHub
commit eb1b9e73d7
8 changed files with 168 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
osu-framework

@ -1 +1 @@
Subproject commit e5ad12e4aff8b638ee9d7b8a5542a85fab054ffa
Subproject commit eb9869d6f5a15ee7ee3a0cdc006ab9f216444860

5
osu.Game/OsuGameBase.cs
View File

@ -49,6 +49,9 @@ namespace osu.Game
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/FontAwesome"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/osuFont"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-Medium"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-MediumItalic"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-Regular"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-RegularItalic"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-SemiBold"));
@ -57,8 +60,6 @@ namespace osu.Game
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-BoldItalic"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-Light"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-LightItalic"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-Medium"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-MediumItalic"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-Black"));
Fonts.AddStore(new GlyphStore(Resources, @"Fonts/Exo2.0-BlackItalic"));

2
osu.Game/Overlays/MusicController.cs
View File

@ -171,7 +171,7 @@ namespace osu.Game.Overlays
Origin = Anchor.BottomCentre,
Anchor = Anchor.BottomCentre,
Height = 10,
Colour = Color4.Orange,
Colour = new Color4(255, 204, 34, 255),
SeekRequested = seek
}
};

155
osu.Game/Overlays/Options/CheckBoxOption.cs
View File

@ -1,10 +1,19 @@
using System;
using osu.Framework;
using osu.Framework.Configuration;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Primitives;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Transformations;
using osu.Framework.Graphics.UserInterface;
using OpenTK;
using OpenTK.Graphics;
using osu.Framework.Input;
namespace osu.Game.Overlays.Options
{
public class CheckBoxOption : BasicCheckBox
public class CheckBoxOption : CheckBox
{
private Bindable<bool> bindable;
@ -25,6 +34,50 @@ namespace osu.Game.Overlays.Options
}
}
public Color4 CheckedColor { get; set; } = Color4.Cyan;
public Color4 UncheckedColor { get; set; } = Color4.White;
public int FadeDuration { get; set; }
public string LabelText
{
get { return labelSpriteText?.Text; }
set
{
if (labelSpriteText != null)
labelSpriteText.Text = value;
}
}
public MarginPadding LabelPadding
{
get { return labelSpriteText?.Padding ?? new MarginPadding(); }
set
{
if (labelSpriteText != null)
labelSpriteText.Padding = value;
}
}
private Light light;
private SpriteText labelSpriteText;
public CheckBoxOption()
{
AutoSizeAxes = Axes.Y;
RelativeSizeAxes = Axes.X;
Children = new Drawable[]
{
labelSpriteText = new SpriteText(),
light = new Light()
{
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
Margin = new MarginPadding { Right = 5 },
}
};
}
private void bindableValueChanged(object sender, EventArgs e)
{
State = bindable.Value ? CheckBoxState.Checked : CheckBoxState.Unchecked;
@ -37,18 +90,114 @@ namespace osu.Game.Overlays.Options
base.Dispose(isDisposing);
}
protected override bool OnHover(InputState state)
{
light.TriggerHover(state);
return base.OnHover(state);
}
protected override void OnHoverLost(InputState state)
{
light.TriggerHoverLost(state);
base.OnHoverLost(state);
}
protected override void OnChecked()
{
if (bindable != null)
bindable.Value = true;
base.OnChecked();
light.State = CheckBoxState.Checked;
}
protected override void OnUnchecked()
{
if (bindable != null)
bindable.Value = false;
base.OnUnchecked();
light.State = CheckBoxState.Unchecked;
}
private class Light : Container, IStateful<CheckBoxState>
{
private Box fill;
const float border_width = 3;
Color4 hoverColour = new Color4(255, 221, 238, 255);
Color4 defaultColour = new Color4(255, 102, 170, 255);
Color4 glowColour = new Color4(187, 17, 119, 0);
public Light()
{
Size = new Vector2(40, 12);
Masking = true;
Colour = defaultColour;
EdgeEffect = new EdgeEffect
{
Colour = glowColour,
Type = EdgeEffectType.Glow,
Radius = 10,
Roundness = 8,
};
CornerRadius = Height / 2;
Masking = true;
BorderColour = Color4.White;
BorderThickness = border_width;
Children = new[]
{
fill = new Box
{
RelativeSizeAxes = Axes.Both,
Alpha = 0.01f, //todo: remove once we figure why containers aren't drawing at all times
},
};
}
protected override bool OnHover(InputState state)
{
FadeColour(hoverColour, 500, EasingTypes.OutQuint);
FadeGlowTo(1, 500, EasingTypes.OutQuint);
return base.OnHover(state);
}
protected override void OnHoverLost(InputState state)
{
FadeGlowTo(0, 500);
FadeColour(defaultColour, 500);
base.OnHoverLost(state);
}
private CheckBoxState state;
public CheckBoxState State
{
get
{
return state;
}
set
{
state = value;
switch (state)
{
case CheckBoxState.Checked:
fill.FadeIn(200, EasingTypes.OutQuint);
break;
case CheckBoxState.Unchecked:
fill.FadeTo(0.01f, 200, EasingTypes.OutQuint); //todo: remove once we figure why containers aren't drawing at all times
break;
}
}
}
}
}
}

10
osu.Game/Overlays/Options/OptionsSection.cs
View File

@ -18,7 +18,9 @@ namespace osu.Game.Overlays.Options
public OptionsSection()
{
const int headerSize = 30, headerMargin = 25;
Margin = new MarginPadding { Top = 20 };
const int headerSize = 26, headerMargin = 25;
const int borderSize = 2;
AutoSizeAxes = Axes.Y;
RelativeSizeAxes = Axes.X;
@ -26,7 +28,7 @@ namespace osu.Game.Overlays.Options
{
new Box
{
Colour = new Color4(30, 30, 30, 255),
Colour = new Color4(0, 0, 0, 255),
RelativeSizeAxes = Axes.X,
Height = borderSize,
},
@ -34,7 +36,7 @@ namespace osu.Game.Overlays.Options
{
Padding = new MarginPadding
{
Top = 10 + borderSize,
Top = 20 + borderSize,
Left = OptionsOverlay.CONTENT_MARGINS,
Right = OptionsOverlay.CONTENT_MARGINS,
Bottom = 10,
@ -53,7 +55,7 @@ namespace osu.Game.Overlays.Options
{
Margin = new MarginPadding { Top = headerSize + headerMargin },
Direction = FlowDirection.VerticalOnly,
Spacing = new Vector2(0, 25),
Spacing = new Vector2(0, 50),
AutoSizeAxes = Axes.Y,
RelativeSizeAxes = Axes.X,
},

6
osu.Game/Overlays/Options/OptionsSubsection.cs
View File

@ -28,9 +28,9 @@ namespace osu.Game.Overlays.Options
{
new SpriteText
{
TextSize = 25,
Text = Header,
// TODO: Bold
TextSize = 17,
Text = Header.ToUpper(),
Font = @"Exo2.0-Black",
}
}
},

2
osu.Game/Overlays/Options/SidebarButton.cs
View File

@ -85,7 +85,7 @@ namespace osu.Game.Overlays.Options
Width = 5,
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
Colour = new Color4(233, 103, 161, 255)
Colour = new Color4(247, 198, 35, 255)
}
};
}

2
osu.Game/Overlays/OptionsOverlay.cs
View File

@ -90,7 +90,7 @@ namespace osu.Game.Overlays
},
new SpriteText
{
Colour = new Color4(235, 117, 139, 255),
Colour = new Color4(255, 102, 170, 255),
Text = "Change the way osu! behaves",
TextSize = 18,
Margin = new MarginPadding { Left = CONTENT_MARGINS, Bottom = 30 },