diff --git a/osu.Desktop.VisualTests/Tests/TestCaseBeatmapDetailArea.cs b/osu.Desktop.VisualTests/Tests/TestCaseBeatmapDetailArea.cs new file mode 100644 index 0000000000..59859f3f29 --- /dev/null +++ b/osu.Desktop.VisualTests/Tests/TestCaseBeatmapDetailArea.cs @@ -0,0 +1,27 @@ +// Copyright (c) 2007-2017 ppy Pty Ltd . +// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE + +using OpenTK; +using osu.Framework.Graphics; +using osu.Framework.Screens.Testing; +using osu.Game.Screens.Select; + +namespace osu.Desktop.VisualTests.Tests +{ + internal class TestCaseBeatmapDetailArea : TestCase + { + public override string Description => @"Beatmap details in song select"; + + public override void Reset() + { + base.Reset(); + + Add(new BeatmapDetailArea + { + Anchor = Anchor.Centre, + Origin = Anchor.Centre, + Size = new Vector2(550f, 450f), + }); + } + } +} diff --git a/osu.Desktop.VisualTests/osu.Desktop.VisualTests.csproj b/osu.Desktop.VisualTests/osu.Desktop.VisualTests.csproj index b67b4c4bb3..9ca82c9867 100644 --- a/osu.Desktop.VisualTests/osu.Desktop.VisualTests.csproj +++ b/osu.Desktop.VisualTests/osu.Desktop.VisualTests.csproj @@ -206,6 +206,7 @@ + diff --git a/osu.Game/Graphics/UserInterface/OsuTabControl.cs b/osu.Game/Graphics/UserInterface/OsuTabControl.cs index 8283c1baa0..ad8c17587a 100644 --- a/osu.Game/Graphics/UserInterface/OsuTabControl.cs +++ b/osu.Game/Graphics/UserInterface/OsuTabControl.cs @@ -28,6 +28,8 @@ public class OsuTabControl : TabControl public OsuTabControl() { + TabContainer.Spacing = new Vector2(10f, 0f); + if (!typeof(T).IsEnum) throw new InvalidOperationException("OsuTabControl only supports enums as the generic type argument"); @@ -142,7 +144,7 @@ public OsuTabItem() { text = new OsuSpriteText { - Margin = new MarginPadding(5), + Margin = new MarginPadding { Top = 5, Bottom = 5 }, Origin = Anchor.BottomLeft, Anchor = Anchor.BottomLeft, TextSize = 14, diff --git a/osu.Game/Graphics/UserInterface/OsuTabControlCheckBox.cs b/osu.Game/Graphics/UserInterface/OsuTabControlCheckBox.cs new file mode 100644 index 0000000000..7d86136fd5 --- /dev/null +++ b/osu.Game/Graphics/UserInterface/OsuTabControlCheckBox.cs @@ -0,0 +1,134 @@ +// Copyright (c) 2007-2017 ppy Pty Ltd . +// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE + +using System; +using OpenTK; +using OpenTK.Graphics; +using osu.Framework.Allocation; +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.Transforms; +using osu.Framework.Graphics.UserInterface; +using osu.Framework.Input; +using osu.Game.Graphics.Sprites; + +namespace osu.Game.Graphics.UserInterface +{ + /// + /// A checkbox styled to be placed in line with an + /// + public class OsuTabControlCheckBox : CheckBox + { + private const float transition_length = 500; + + public event EventHandler Action; + + private Color4 accentColour; + public Color4 AccentColour + { + get { return accentColour; } + set + { + accentColour = value; + + if (State == CheckBoxState.Unchecked) + { + text.Colour = accentColour; + icon.Colour = accentColour; + } + } + } + + public string Text + { + get { return text.Text; } + set { text.Text = value; } + } + + private Box box; + private SpriteText text; + private TextAwesome icon; + + private void fadeIn() + { + box.FadeIn(transition_length, EasingTypes.OutQuint); + text.FadeColour(Color4.White, transition_length, EasingTypes.OutQuint); + } + + private void fadeOut() + { + box.FadeOut(transition_length, EasingTypes.OutQuint); + text.FadeColour(accentColour, transition_length, EasingTypes.OutQuint); + } + + protected override void OnChecked() + { + fadeIn(); + icon.Icon = FontAwesome.fa_check_circle_o; + Action?.Invoke(this, State); + } + + protected override void OnUnchecked() + { + fadeOut(); + icon.Icon = FontAwesome.fa_circle_o; + Action?.Invoke(this, State); + } + + protected override bool OnHover(InputState state) + { + fadeIn(); + return base.OnHover(state); + } + + protected override void OnHoverLost(InputState state) + { + if (State == CheckBoxState.Unchecked) + fadeOut(); + + base.OnHoverLost(state); + } + + public OsuTabControlCheckBox() + { + AutoSizeAxes = Axes.Both; + + Children = new Drawable[] + { + new FillFlowContainer + { + AutoSizeAxes = Axes.Both, + Margin = new MarginPadding { Top = 5, Bottom = 5, }, + Spacing = new Vector2(5f, 0f), + Direction = FillDirection.Horizontal, + Children = new Drawable[] + { + text = new OsuSpriteText + { + TextSize = 14, + Font = @"Exo2.0-Bold", + }, + icon = new TextAwesome + { + TextSize = 14, + Icon = FontAwesome.fa_circle_o, + Shadow = true, + }, + }, + }, + box = new Box + { + RelativeSizeAxes = Axes.X, + Height = 1, + Alpha = 0, + Colour = Color4.White, + Origin = Anchor.BottomLeft, + Anchor = Anchor.BottomLeft, + } + }; + } + } +} diff --git a/osu.Game/Screens/Select/BeatmapDetailArea.cs b/osu.Game/Screens/Select/BeatmapDetailArea.cs new file mode 100644 index 0000000000..f576e47780 --- /dev/null +++ b/osu.Game/Screens/Select/BeatmapDetailArea.cs @@ -0,0 +1,27 @@ +// Copyright (c) 2007-2017 ppy Pty Ltd . +// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE + +using osu.Framework.Graphics; +using osu.Framework.Graphics.Containers; +using osu.Framework.Graphics.Primitives; + +namespace osu.Game.Screens.Select +{ + public class BeatmapDetailArea : Container + { + public BeatmapDetailArea() + { + Children = new Drawable[] + { + new BeatmapDetailAreaTabControl + { + RelativeSizeAxes = Axes.X, + }, + new Container + { + Padding = new MarginPadding { Top = BeatmapDetailAreaTabControl.HEIGHT }, + }, + }; + } + } +} diff --git a/osu.Game/Screens/Select/BeatmapDetailAreaTabControl.cs b/osu.Game/Screens/Select/BeatmapDetailAreaTabControl.cs new file mode 100644 index 0000000000..be3fd43184 --- /dev/null +++ b/osu.Game/Screens/Select/BeatmapDetailAreaTabControl.cs @@ -0,0 +1,75 @@ +// Copyright (c) 2007-2017 ppy Pty Ltd . +// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE + +using OpenTK.Graphics; +using osu.Framework.Allocation; +using osu.Framework.Extensions.Color4Extensions; +using osu.Framework.Graphics; +using osu.Framework.Graphics.Containers; +using osu.Framework.Graphics.Sprites; +using osu.Game.Graphics; +using osu.Game.Graphics.UserInterface; + +namespace osu.Game.Screens.Select +{ + public class BeatmapDetailAreaTabControl : Container + { + public static readonly float HEIGHT = 24; + private OsuTabControlCheckBox modsCheckbox; + private OsuTabControl tabs; + + [BackgroundDependencyLoader] + private void load(OsuColour colour) + { + modsCheckbox.AccentColour = tabs.AccentColour = colour.YellowLight; + } + + public BeatmapDetailAreaTabControl() + { + Height = HEIGHT; + + Children = new Drawable[] + { + new Box + { + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + RelativeSizeAxes = Axes.X, + Height = 1, + Colour = Color4.White.Opacity(0.2f), + }, + tabs = new OsuTabControl + { + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + RelativeSizeAxes = Axes.Both, + }, + modsCheckbox = new OsuTabControlCheckBox + { + Anchor = Anchor.BottomRight, + Origin = Anchor.BottomRight, + Text = @"Mods", + }, + }; + + tabs.ItemChanged += (sender, e) => + { + + }; + + modsCheckbox.Action += (sender, e) => + { + + }; + } + } + + public enum BeatmapDetailTab + { + Details, + Local, + Country, + Global, + Friends + } +} diff --git a/osu.Game/osu.Game.csproj b/osu.Game/osu.Game.csproj index bfb787cd51..25c96966d9 100644 --- a/osu.Game/osu.Game.csproj +++ b/osu.Game/osu.Game.csproj @@ -362,6 +362,9 @@ + + +