mirror of
https://github.com/ppy/osu.git
synced 2025-02-20 05:36:05 +08:00
Implement CommentsHeader component
This commit is contained in:
parent
c6a6ea3890
commit
64f62bd2bf
39
osu.Game.Tests/Visual/Online/TestSceneCommentsHeader.cs
Normal file
39
osu.Game.Tests/Visual/Online/TestSceneCommentsHeader.cs
Normal file
@ -0,0 +1,39 @@
|
||||
// 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.Collections.Generic;
|
||||
using NUnit.Framework;
|
||||
using osu.Framework.Bindables;
|
||||
using osu.Game.Overlays.Comments;
|
||||
|
||||
namespace osu.Game.Tests.Visual.Online
|
||||
{
|
||||
[TestFixture]
|
||||
public class TestSceneCommentsHeader : OsuTestScene
|
||||
{
|
||||
public override IReadOnlyList<Type> RequiredTypes => new[]
|
||||
{
|
||||
typeof(CommentsHeader),
|
||||
typeof(HeaderButton),
|
||||
typeof(SortSelector),
|
||||
};
|
||||
|
||||
private readonly Bindable<SortCommentsBy> sort = new Bindable<SortCommentsBy>();
|
||||
private readonly BindableBool showDeleted = new BindableBool();
|
||||
|
||||
public TestSceneCommentsHeader()
|
||||
{
|
||||
Add(new CommentsHeader
|
||||
{
|
||||
Sort = { BindTarget = sort },
|
||||
ShowDeleted = { BindTarget = showDeleted }
|
||||
});
|
||||
|
||||
AddStep("Trigger ShowDeleted", () => showDeleted.Value = !showDeleted.Value);
|
||||
AddStep("Select old", () => sort.Value = SortCommentsBy.Old);
|
||||
AddStep("Select new", () => sort.Value = SortCommentsBy.New);
|
||||
AddStep("Select top", () => sort.Value = SortCommentsBy.Top);
|
||||
}
|
||||
}
|
||||
}
|
137
osu.Game/Overlays/Comments/CommentsHeader.cs
Normal file
137
osu.Game/Overlays/Comments/CommentsHeader.cs
Normal file
@ -0,0 +1,137 @@
|
||||
// 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.Containers;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Bindables;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Framework.Graphics.Sprites;
|
||||
using osuTK;
|
||||
using osu.Framework.Input.Events;
|
||||
|
||||
namespace osu.Game.Overlays.Comments
|
||||
{
|
||||
public class CommentsHeader : CompositeDrawable
|
||||
{
|
||||
private const int height = 40;
|
||||
private const int spacing = 10;
|
||||
private const int padding = 50;
|
||||
private const int text_size = 14;
|
||||
|
||||
public readonly Bindable<SortCommentsBy> Sort = new Bindable<SortCommentsBy>();
|
||||
public readonly BindableBool ShowDeleted = new BindableBool();
|
||||
|
||||
private readonly Box background;
|
||||
|
||||
public CommentsHeader()
|
||||
{
|
||||
RelativeSizeAxes = Axes.X;
|
||||
Height = height;
|
||||
AddRangeInternal(new Drawable[]
|
||||
{
|
||||
background = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
},
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Padding = new MarginPadding { Horizontal = padding },
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new FillFlowContainer
|
||||
{
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Spacing = new Vector2(spacing, 0),
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new SpriteText
|
||||
{
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Font = OsuFont.GetFont(size: text_size),
|
||||
Text = @"Sort by"
|
||||
},
|
||||
new SortSelector
|
||||
{
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Current = Sort
|
||||
}
|
||||
}
|
||||
},
|
||||
new ShowDeletedButton
|
||||
{
|
||||
Anchor = Anchor.CentreRight,
|
||||
Origin = Anchor.CentreRight,
|
||||
Checked = { BindTarget = ShowDeleted }
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OsuColour colours)
|
||||
{
|
||||
background.Colour = colours.Gray3;
|
||||
}
|
||||
|
||||
private class ShowDeletedButton : HeaderButton
|
||||
{
|
||||
private const int spacing = 5;
|
||||
|
||||
public readonly BindableBool Checked = new BindableBool();
|
||||
|
||||
private readonly SpriteIcon checkboxIcon;
|
||||
|
||||
public ShowDeletedButton()
|
||||
{
|
||||
Add(new FillFlowContainer
|
||||
{
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Spacing = new Vector2(spacing, 0),
|
||||
Children = new Drawable[]
|
||||
{
|
||||
checkboxIcon = new SpriteIcon
|
||||
{
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Size = new Vector2(10),
|
||||
},
|
||||
new SpriteText
|
||||
{
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Font = OsuFont.GetFont(size: text_size),
|
||||
Text = @"Show deleted"
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
protected override void LoadComplete()
|
||||
{
|
||||
Checked.BindValueChanged(onCheckedChanged, true);
|
||||
base.LoadComplete();
|
||||
}
|
||||
|
||||
private void onCheckedChanged(ValueChangedEvent<bool> isChecked)
|
||||
{
|
||||
checkboxIcon.Icon = isChecked.NewValue ? FontAwesome.Solid.CheckSquare : FontAwesome.Regular.Square;
|
||||
}
|
||||
|
||||
protected override bool OnClick(ClickEvent e)
|
||||
{
|
||||
Checked.Value = !Checked.Value;
|
||||
return base.OnClick(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
72
osu.Game/Overlays/Comments/HeaderButton.cs
Normal file
72
osu.Game/Overlays/Comments/HeaderButton.cs
Normal file
@ -0,0 +1,72 @@
|
||||
// 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.Containers;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Framework.Input.Events;
|
||||
using osu.Game.Graphics.UserInterface;
|
||||
|
||||
namespace osu.Game.Overlays.Comments
|
||||
{
|
||||
public class HeaderButton : Container
|
||||
{
|
||||
private const int height = 20;
|
||||
private const int corner_radius = 3;
|
||||
private const int margin = 10;
|
||||
private const int duration = 200;
|
||||
|
||||
protected override Container<Drawable> Content => content;
|
||||
|
||||
private readonly Box background;
|
||||
private readonly Container content;
|
||||
|
||||
public HeaderButton()
|
||||
{
|
||||
AutoSizeAxes = Axes.X;
|
||||
Height = height;
|
||||
Masking = true;
|
||||
CornerRadius = corner_radius;
|
||||
AddRangeInternal(new Drawable[]
|
||||
{
|
||||
background = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Alpha = 0,
|
||||
},
|
||||
content = new Container
|
||||
{
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Anchor = Anchor.Centre,
|
||||
Origin = Anchor.Centre,
|
||||
Margin = new MarginPadding { Horizontal = margin }
|
||||
},
|
||||
new HoverClickSounds(),
|
||||
});
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OsuColour colours)
|
||||
{
|
||||
background.Colour = colours.Gray4;
|
||||
}
|
||||
|
||||
protected override bool OnHover(HoverEvent e)
|
||||
{
|
||||
FadeInBackground();
|
||||
return base.OnHover(e);
|
||||
}
|
||||
|
||||
protected override void OnHoverLost(HoverLostEvent e)
|
||||
{
|
||||
base.OnHoverLost(e);
|
||||
FadeOutBackground();
|
||||
}
|
||||
|
||||
protected void FadeInBackground() => background.FadeIn(duration, Easing.OutQuint);
|
||||
|
||||
protected void FadeOutBackground() => background.FadeOut(duration, Easing.OutQuint);
|
||||
}
|
||||
}
|
106
osu.Game/Overlays/Comments/SortSelector.cs
Normal file
106
osu.Game/Overlays/Comments/SortSelector.cs
Normal file
@ -0,0 +1,106 @@
|
||||
// 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.Graphics.Containers;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.UserInterface;
|
||||
using osu.Framework.Graphics.Sprites;
|
||||
using osu.Game.Graphics;
|
||||
using osuTK;
|
||||
using osu.Game.Graphics.UserInterface;
|
||||
using osu.Framework.Input.Events;
|
||||
using osu.Framework.Bindables;
|
||||
using osu.Framework.Allocation;
|
||||
using osuTK.Graphics;
|
||||
|
||||
namespace osu.Game.Overlays.Comments
|
||||
{
|
||||
public class SortSelector : OsuTabControl<SortCommentsBy>
|
||||
{
|
||||
private const int spacing = 5;
|
||||
|
||||
protected override Dropdown<SortCommentsBy> CreateDropdown() => null;
|
||||
|
||||
protected override TabItem<SortCommentsBy> CreateTabItem(SortCommentsBy value) => new SortTabItem(value);
|
||||
|
||||
protected override TabFillFlowContainer CreateTabFlow() => new TabFillFlowContainer
|
||||
{
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Spacing = new Vector2(spacing, 0),
|
||||
};
|
||||
|
||||
public SortSelector()
|
||||
{
|
||||
AutoSizeAxes = Axes.Both;
|
||||
}
|
||||
|
||||
private class SortTabItem : TabItem<SortCommentsBy>
|
||||
{
|
||||
private readonly TabContent content;
|
||||
|
||||
public SortTabItem(SortCommentsBy value)
|
||||
: base(value)
|
||||
{
|
||||
AutoSizeAxes = Axes.Both;
|
||||
Child = content = new TabContent(value)
|
||||
{
|
||||
Active = { BindTarget = Active }
|
||||
};
|
||||
}
|
||||
|
||||
protected override void OnActivated() => content.Activate();
|
||||
|
||||
protected override void OnDeactivated() => content.Deactivate();
|
||||
|
||||
private class TabContent : HeaderButton
|
||||
{
|
||||
private const int text_size = 14;
|
||||
|
||||
public readonly BindableBool Active = new BindableBool();
|
||||
|
||||
[Resolved]
|
||||
private OsuColour colours { get; set; }
|
||||
|
||||
private readonly SpriteText text;
|
||||
|
||||
public TabContent(SortCommentsBy value)
|
||||
{
|
||||
Add(text = new SpriteText
|
||||
{
|
||||
Font = OsuFont.GetFont(size: text_size),
|
||||
Text = value.ToString()
|
||||
});
|
||||
}
|
||||
|
||||
public void Activate()
|
||||
{
|
||||
FadeInBackground();
|
||||
text.Font = text.Font.With(weight: FontWeight.Bold);
|
||||
text.Colour = colours.BlueLighter;
|
||||
}
|
||||
|
||||
public void Deactivate()
|
||||
{
|
||||
if (!IsHovered)
|
||||
FadeOutBackground();
|
||||
|
||||
text.Font = text.Font.With(weight: FontWeight.Medium);
|
||||
text.Colour = Color4.White;
|
||||
}
|
||||
|
||||
protected override void OnHoverLost(HoverLostEvent e)
|
||||
{
|
||||
if (!Active.Value) base.OnHoverLost(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public enum SortCommentsBy
|
||||
{
|
||||
New,
|
||||
Old,
|
||||
Top
|
||||
}
|
||||
}
|
@ -32,4 +32,7 @@
|
||||
<PackageReference Include="SharpRaven" Version="2.4.0" />
|
||||
<PackageReference Include="System.ComponentModel.Annotations" Version="4.6.0" />
|
||||
</ItemGroup>
|
||||
<ItemGroup>
|
||||
<Folder Include="Overlays\Comments\" />
|
||||
</ItemGroup>
|
||||
</Project>
|
||||
|
Loading…
Reference in New Issue
Block a user