Update DrawableComment layout

This commit is contained in:
Andrei Zavatski
2020-07-28 02:36:25 +03:00
parent 6737c57e33
commit 2d502cebda
4 changed files with 89 additions and 85 deletions

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

View File

@ -21,7 +21,6 @@ namespace osu.Game.Overlays.Comments.Buttons
public ShowMoreButton() public ShowMoreButton()
{ {
AutoSizeAxes = Axes.Both; AutoSizeAxes = Axes.Both;
Margin = new MarginPadding { Vertical = 10, Left = 80 };
LoadingAnimationSize = new Vector2(8); LoadingAnimationSize = new Vector2(8);
} }

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,

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;
@ -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,91 +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 DrawableDate(Comment.CreatedAt, 12, false) {
{ AutoSizeAxes = Axes.Both,
Anchor = Anchor.CentreLeft, Children = new Drawable[]
Origin = Anchor.CentreLeft, {
Colour = colourProvider.Foreground1
}
}
},
showRepliesButton = new ShowRepliesButton(Comment.RepliesCount) showRepliesButton = new ShowRepliesButton(Comment.RepliesCount)
{ {
Expanded = { BindTarget = childrenExpanded } Expanded = { BindTarget = childrenExpanded }
@ -198,32 +190,36 @@ 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)
}
} }
} },
}, }
} }
}, },
new Container new Container
@ -251,8 +247,6 @@ namespace osu.Game.Overlays.Comments
{ {
info.Add(new OsuSpriteText info.Add(new OsuSpriteText
{ {
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular), Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular),
Text = $@"edited {HumanizerUtils.Humanize(Comment.EditedAt.Value)} by {Comment.EditedUser.Username}", Text = $@"edited {HumanizerUtils.Humanize(Comment.EditedAt.Value)} by {Comment.EditedUser.Username}",
Colour = colourProvider.Foreground1 Colour = colourProvider.Foreground1
@ -362,6 +356,23 @@ namespace osu.Game.Overlays.Comments
showMoreButton.IsLoading = loadRepliesButton.IsLoading = false; showMoreButton.IsLoading = loadRepliesButton.IsLoading = false;
} }
private MarginPadding getPadding(bool isTopLevel)
{
if (isTopLevel)
{
return new MarginPadding
{
Horizontal = 70,
Vertical = 15
};
}
return new MarginPadding
{
Top = 10
};
}
private class ParentUsername : FillFlowContainer, IHasTooltip private class ParentUsername : FillFlowContainer, IHasTooltip
{ {
public string TooltipText => getParentMessage(); public string TooltipText => getParentMessage();