sim1222/osukey
1
1
Fork 0
mirror of https://github.com/osukey/osukey.git synced 2025-05-15 02:27:33 +09:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #9696 from EVAST9919/comments-footer-colours

Browse Source 
Comments container visual improvements
This commit is contained in:
Dan Balasescu 2020-07-28 15:36:29 +09:00 committed by GitHub
commit 1ff3b20a5e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 157 additions and 159 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
osu.Game/Overlays/Comments/Buttons/ChevronButton.cs Normal file
View File

@ -0,0 +1,48 @@
// 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;
using osu.Game.Graphics.Containers;
using osu.Framework.Bindables;
using osu.Framework.Graphics.Sprites;
using osuTK;
using osu.Framework.Allocation;
namespace osu.Game.Overlays.Comments.Buttons
{
public class ChevronButton : OsuHoverContainer
{
public readonly BindableBool Expanded = new BindableBool(true);
private readonly SpriteIcon icon;
public ChevronButton()
{
Size = new Vector2(40, 22);
Child = icon = new SpriteIcon
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Size = new Vector2(12),
};
}
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
IdleColour = HoverColour = colourProvider.Foreground1;
}
protected override void LoadComplete()
{
base.LoadComplete();
Action = Expanded.Toggle;
Expanded.BindValueChanged(onExpandedChanged, true);
}
private void onExpandedChanged(ValueChangedEvent<bool> expanded)
{
icon.Icon = expanded.NewValue ? FontAwesome.Solid.ChevronUp : FontAwesome.Solid.ChevronDown;
}
}
}

4
osu.Game/Overlays/Comments/Buttons/CommentRepliesButton.cs
View File

@ -32,10 +32,6 @@ namespace osu.Game.Overlays.Comments.Buttons
protected CommentRepliesButton() protected CommentRepliesButton()
{ {
AutoSizeAxes = Axes.Both; AutoSizeAxes = Axes.Both;
Margin = new MarginPadding
{
Vertical = 2
};
InternalChildren = new Drawable[] InternalChildren = new Drawable[]
{ {
new CircularContainer new CircularContainer

26
osu.Game/Overlays/Comments/GetCommentRepliesButton.cs → osu.Game/Overlays/Comments/Buttons/ShowMoreButton.cs
View File

@ -8,38 +8,42 @@ using osu.Framework.Graphics.Containers;
using osu.Game.Graphics.Sprites; using osu.Game.Graphics.Sprites;
using System.Collections.Generic; using System.Collections.Generic;
using osuTK; using osuTK;
using osu.Framework.Allocation;
namespace osu.Game.Overlays.Comments namespace osu.Game.Overlays.Comments.Buttons
{ {
public abstract class GetCommentRepliesButton : LoadingButton public class ShowMoreButton : LoadingButton
{ {
private const int duration = 200;
protected override IEnumerable<Drawable> EffectTargets => new[] { text }; protected override IEnumerable<Drawable> EffectTargets => new[] { text };
private OsuSpriteText text; private OsuSpriteText text;
protected GetCommentRepliesButton() public ShowMoreButton()
{ {
AutoSizeAxes = Axes.Both; AutoSizeAxes = Axes.Both;
LoadingAnimationSize = new Vector2(8); LoadingAnimationSize = new Vector2(8);
} }
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
IdleColour = colourProvider.Light2;
HoverColour = colourProvider.Light1;
}
protected override Drawable CreateContent() => new Container protected override Drawable CreateContent() => new Container
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both,
Child = text = new OsuSpriteText Child = text = new OsuSpriteText
{ {
AlwaysPresent = true, AlwaysPresent = true,
Font = OsuFont.GetFont(size: 12, weight: FontWeight.Bold), Font = OsuFont.GetFont(size: 12, weight: FontWeight.SemiBold),
Text = GetText() Text = "show more"
} }
}; };
protected abstract string GetText(); protected override void OnLoadStarted() => text.FadeOut(200, Easing.OutQuint);
protected override void OnLoadStarted() => text.FadeOut(duration, Easing.OutQuint); protected override void OnLoadFinished() => text.FadeIn(200, Easing.OutQuint);
protected override void OnLoadFinished() => text.FadeIn(duration, Easing.OutQuint);
} }
} }

2
osu.Game/Overlays/Comments/DeletedCommentsCounter.cs
View File

@ -23,8 +23,6 @@ namespace osu.Game.Overlays.Comments
public DeletedCommentsCounter() public DeletedCommentsCounter()
{ {
AutoSizeAxes = Axes.Both; AutoSizeAxes = Axes.Both;
Margin = new MarginPadding { Vertical = 10, Left = 80 };
InternalChild = new FillFlowContainer InternalChild = new FillFlowContainer
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both,

203
osu.Game/Overlays/Comments/DrawableComment.cs
View File

@ -28,7 +28,6 @@ namespace osu.Game.Overlays.Comments
public class DrawableComment : CompositeDrawable public class DrawableComment : CompositeDrawable
{ {
private const int avatar_size = 40; private const int avatar_size = 40;
private const int margin = 10;
public Action<DrawableComment, int> RepliesRequested; public Action<DrawableComment, int> RepliesRequested;
@ -58,7 +57,7 @@ namespace osu.Game.Overlays.Comments
} }
[BackgroundDependencyLoader] [BackgroundDependencyLoader]
private void load() private void load(OverlayColourProvider colourProvider)
{ {
LinkFlowContainer username; LinkFlowContainer username;
FillFlowContainer info; FillFlowContainer info;
@ -70,25 +69,25 @@ namespace osu.Game.Overlays.Comments
AutoSizeAxes = Axes.Y; AutoSizeAxes = Axes.Y;
InternalChildren = new Drawable[] InternalChildren = new Drawable[]
{ {
new FillFlowContainer new Container
{ {
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y, AutoSizeAxes = Axes.Y,
Direction = FillDirection.Vertical, Padding = getPadding(Comment.IsTopLevel),
Children = new Drawable[] Child = new FillFlowContainer
{ {
new Container RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Direction = FillDirection.Vertical,
Children = new Drawable[]
{ {
RelativeSizeAxes = Axes.X, content = new GridContainer
AutoSizeAxes = Axes.Y,
Padding = new MarginPadding(margin) { Left = margin + 5, Top = Comment.IsTopLevel ? 10 : 0 },
Child = content = new GridContainer
{ {
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y, AutoSizeAxes = Axes.Y,
ColumnDimensions = new[] ColumnDimensions = new[]
{ {
new Dimension(GridSizeMode.AutoSize), new Dimension(GridSizeMode.Absolute, size: avatar_size + 10),
new Dimension(), new Dimension(),
}, },
RowDimensions = new[] RowDimensions = new[]
@ -99,93 +98,84 @@ namespace osu.Game.Overlays.Comments
{ {
new Drawable[] new Drawable[]
{ {
new FillFlowContainer new Container
{ {
AutoSizeAxes = Axes.Both, Size = new Vector2(avatar_size),
Margin = new MarginPadding { Horizontal = margin },
Direction = FillDirection.Horizontal,
Spacing = new Vector2(5, 0),
Children = new Drawable[] Children = new Drawable[]
{ {
new Container
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Width = 40,
AutoSizeAxes = Axes.Y,
Child = votePill = new VotePill(Comment)
{
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
}
},
new UpdateableAvatar(Comment.User) new UpdateableAvatar(Comment.User)
{ {
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Size = new Vector2(avatar_size), Size = new Vector2(avatar_size),
Masking = true, Masking = true,
CornerRadius = avatar_size / 2f, CornerRadius = avatar_size / 2f,
CornerExponent = 2, CornerExponent = 2,
}, },
votePill = new VotePill(Comment)
{
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreRight,
Margin = new MarginPadding
{
Right = 5
}
}
} }
}, },
new FillFlowContainer new FillFlowContainer
{ {
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y, AutoSizeAxes = Axes.Y,
Spacing = new Vector2(0, 3), Direction = FillDirection.Vertical,
Spacing = new Vector2(0, 4),
Margin = new MarginPadding
{
Vertical = 2
},
Children = new Drawable[] Children = new Drawable[]
{ {
new FillFlowContainer new FillFlowContainer
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both,
Direction = FillDirection.Horizontal, Direction = FillDirection.Horizontal,
Spacing = new Vector2(7, 0), Spacing = new Vector2(10, 0),
Children = new Drawable[] Children = new Drawable[]
{ {
username = new LinkFlowContainer(s => s.Font = OsuFont.GetFont(size: 14, weight: FontWeight.Bold, italics: true)) username = new LinkFlowContainer(s => s.Font = OsuFont.GetFont(size: 14, weight: FontWeight.Bold))
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both
}, },
new ParentUsername(Comment), new ParentUsername(Comment),
new OsuSpriteText new OsuSpriteText
{ {
Alpha = Comment.IsDeleted ? 1 : 0, Alpha = Comment.IsDeleted ? 1 : 0,
Font = OsuFont.GetFont(size: 14, weight: FontWeight.Bold, italics: true), Font = OsuFont.GetFont(size: 14, weight: FontWeight.Bold),
Text = @"deleted", Text = "deleted"
} }
} }
}, },
message = new LinkFlowContainer(s => s.Font = OsuFont.GetFont(size: 14)) message = new LinkFlowContainer(s => s.Font = OsuFont.GetFont(size: 14))
{ {
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y, AutoSizeAxes = Axes.Y
Padding = new MarginPadding { Right = 40 }
}, },
new FillFlowContainer info = new FillFlowContainer
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both,
Direction = FillDirection.Vertical, Direction = FillDirection.Horizontal,
Spacing = new Vector2(10, 0),
Children = new Drawable[] Children = new Drawable[]
{ {
info = new FillFlowContainer new DrawableDate(Comment.CreatedAt, 12, false)
{ {
AutoSizeAxes = Axes.Both, Colour = colourProvider.Foreground1
Direction = FillDirection.Horizontal, }
Spacing = new Vector2(10, 0), }
Children = new Drawable[] },
{ new Container
new OsuSpriteText {
{ AutoSizeAxes = Axes.Both,
Anchor = Anchor.CentreLeft, Children = new Drawable[]
Origin = Anchor.CentreLeft, {
Font = OsuFont.GetFont(size: 12),
Colour = OsuColour.Gray(0.7f),
Text = HumanizerUtils.Humanize(Comment.CreatedAt)
},
}
},
showRepliesButton = new ShowRepliesButton(Comment.RepliesCount) showRepliesButton = new ShowRepliesButton(Comment.RepliesCount)
{ {
Expanded = { BindTarget = childrenExpanded } Expanded = { BindTarget = childrenExpanded }
@ -200,41 +190,51 @@ namespace osu.Game.Overlays.Comments
} }
} }
} }
} },
}, childCommentsVisibilityContainer = new FillFlowContainer
childCommentsVisibilityContainer = new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Direction = FillDirection.Vertical,
Children = new Drawable[]
{ {
childCommentsContainer = new FillFlowContainer RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Direction = FillDirection.Vertical,
Padding = new MarginPadding { Left = 20 },
Children = new Drawable[]
{ {
Padding = new MarginPadding { Left = 20 }, childCommentsContainer = new FillFlowContainer
RelativeSizeAxes = Axes.X, {
AutoSizeAxes = Axes.Y, RelativeSizeAxes = Axes.X,
Direction = FillDirection.Vertical AutoSizeAxes = Axes.Y,
}, Direction = FillDirection.Vertical
deletedCommentsCounter = new DeletedCommentsCounter },
{ deletedCommentsCounter = new DeletedCommentsCounter
ShowDeleted = { BindTarget = ShowDeleted } {
}, ShowDeleted = { BindTarget = ShowDeleted },
showMoreButton = new ShowMoreButton Margin = new MarginPadding
{ {
Action = () => RepliesRequested(this, ++currentPage) Top = 10
}
},
showMoreButton = new ShowMoreButton
{
Action = () => RepliesRequested(this, ++currentPage)
}
} }
} },
}, }
} }
}, },
chevronButton = new ChevronButton new Container
{ {
Size = new Vector2(70, 40),
Anchor = Anchor.TopRight, Anchor = Anchor.TopRight,
Origin = Anchor.TopRight, Origin = Anchor.TopRight,
Margin = new MarginPadding { Right = 30, Top = margin }, Margin = new MarginPadding { Horizontal = 5 },
Expanded = { BindTarget = childrenExpanded }, Child = chevronButton = new ChevronButton
Alpha = 0 {
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
Expanded = { BindTarget = childrenExpanded },
Alpha = 0
}
} }
}; };
@ -247,10 +247,9 @@ namespace osu.Game.Overlays.Comments
{ {
info.Add(new OsuSpriteText info.Add(new OsuSpriteText
{ {
Anchor = Anchor.CentreLeft, Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular),
Origin = Anchor.CentreLeft, Text = $@"edited {HumanizerUtils.Humanize(Comment.EditedAt.Value)} by {Comment.EditedUser.Username}",
Font = OsuFont.GetFont(size: 12), Colour = colourProvider.Foreground1
Text = $@"edited {HumanizerUtils.Humanize(Comment.EditedAt.Value)} by {Comment.EditedUser.Username}"
}); });
} }
@ -357,35 +356,21 @@ namespace osu.Game.Overlays.Comments
showMoreButton.IsLoading = loadRepliesButton.IsLoading = false; showMoreButton.IsLoading = loadRepliesButton.IsLoading = false;
} }
private class ChevronButton : ShowChildrenButton private MarginPadding getPadding(bool isTopLevel)
{ {
private readonly SpriteIcon icon; if (isTopLevel)
public ChevronButton()
{ {
Child = icon = new SpriteIcon return new MarginPadding
{ {
Size = new Vector2(12), Horizontal = 70,
Vertical = 15
}; };
} }
protected override void OnExpandedChanged(ValueChangedEvent<bool> expanded) return new MarginPadding
{ {
icon.Icon = expanded.NewValue ? FontAwesome.Solid.ChevronUp : FontAwesome.Solid.ChevronDown; Top = 10
} };
}
private class ShowMoreButton : GetCommentRepliesButton
{
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
Margin = new MarginPadding { Vertical = 10, Left = 80 };
IdleColour = colourProvider.Light2;
HoverColour = colourProvider.Light1;
}
protected override string GetText() => @"Show More";
} }
private class ParentUsername : FillFlowContainer, IHasTooltip private class ParentUsername : FillFlowContainer, IHasTooltip

33
osu.Game/Overlays/Comments/ShowChildrenButton.cs
View File

@ -1,33 +0,0 @@
// 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;
using osu.Game.Graphics.Containers;
using osu.Framework.Bindables;
using osuTK.Graphics;
using osu.Game.Graphics;
namespace osu.Game.Overlays.Comments
{
public abstract class ShowChildrenButton : OsuHoverContainer
{
public readonly BindableBool Expanded = new BindableBool(true);
protected ShowChildrenButton()
{
AutoSizeAxes = Axes.Both;
IdleColour = OsuColour.Gray(0.7f);
HoverColour = Color4.White;
}
protected override void LoadComplete()
{
Action = Expanded.Toggle;
Expanded.BindValueChanged(OnExpandedChanged, true);
base.LoadComplete();
}
protected abstract void OnExpandedChanged(ValueChangedEvent<bool> expanded);
}
}