mirror of
https://github.com/ppy/osu.git
synced 2024-12-14 15:33:05 +08:00
Implement HomeNewsGroupPanel
This commit is contained in:
parent
e56671a1f1
commit
76d35a7667
@ -8,6 +8,8 @@ using osu.Framework.Allocation;
|
||||
using osu.Game.Overlays;
|
||||
using System;
|
||||
using osu.Game.Overlays.Dashboard.Home.News;
|
||||
using osuTK;
|
||||
using System.Collections.Generic;
|
||||
|
||||
namespace osu.Game.Tests.Visual.Online
|
||||
{
|
||||
@ -18,20 +20,40 @@ namespace osu.Game.Tests.Visual.Online
|
||||
|
||||
public TestSceneHomeNewsPanel()
|
||||
{
|
||||
Add(new Container
|
||||
Add(new FillFlowContainer
|
||||
{
|
||||
Anchor = Anchor.Centre,
|
||||
Origin = Anchor.Centre,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Width = 500,
|
||||
Child = new HomeNewsPanel(new APINewsPost
|
||||
Direction = FillDirection.Vertical,
|
||||
Spacing = new Vector2(0, 5),
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new HomeNewsPanel(new APINewsPost
|
||||
{
|
||||
Title = "This post has an image which starts with \"/\" and has many authors!",
|
||||
Preview = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
|
||||
FirstImage = "/help/wiki/shared/news/banners/monthly-beatmapping-contest.png",
|
||||
PublishedAt = DateTimeOffset.Now,
|
||||
Slug = "2020-07-16-summer-theme-park-2020-voting-open"
|
||||
}),
|
||||
new HomeNewsGroupPanel(new List<APINewsPost>
|
||||
{
|
||||
new APINewsPost
|
||||
{
|
||||
Title = "Title 1",
|
||||
Slug = "2020-07-16-summer-theme-park-2020-voting-open",
|
||||
PublishedAt = DateTimeOffset.Now,
|
||||
},
|
||||
new APINewsPost
|
||||
{
|
||||
Title = "Title of this post is Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
|
||||
Slug = "2020-07-16-summer-theme-park-2020-voting-open",
|
||||
PublishedAt = DateTimeOffset.Now,
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -16,9 +16,6 @@ namespace osu.Game.Overlays.Dashboard.Home
|
||||
{
|
||||
protected override Container<Drawable> Content => content;
|
||||
|
||||
[Resolved]
|
||||
protected OverlayColourProvider ColourProvider { get; private set; }
|
||||
|
||||
private readonly Container content;
|
||||
private readonly Box background;
|
||||
|
||||
@ -50,9 +47,9 @@ namespace osu.Game.Overlays.Dashboard.Home
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load()
|
||||
private void load(OverlayColourProvider colourProvider)
|
||||
{
|
||||
background.Colour = ColourProvider.Background4;
|
||||
background.Colour = colourProvider.Background4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
85
osu.Game/Overlays/Dashboard/Home/News/HomeNewsGroupPanel.cs
Normal file
85
osu.Game/Overlays/Dashboard/Home/News/HomeNewsGroupPanel.cs
Normal file
@ -0,0 +1,85 @@
|
||||
// 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 System.Linq;
|
||||
using osu.Framework.Allocation;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Game.Online.API.Requests.Responses;
|
||||
|
||||
namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
{
|
||||
public class HomeNewsGroupPanel : HomePanel
|
||||
{
|
||||
private readonly List<APINewsPost> posts;
|
||||
|
||||
public HomeNewsGroupPanel(List<APINewsPost> posts)
|
||||
{
|
||||
this.posts = posts;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load()
|
||||
{
|
||||
Content.Padding = new MarginPadding { Vertical = 5 };
|
||||
|
||||
Child = new FillFlowContainer<CollapsedNewsPanel>
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Direction = FillDirection.Vertical,
|
||||
Children = posts.Select(p => new CollapsedNewsPanel(p)).ToArray()
|
||||
};
|
||||
}
|
||||
|
||||
private class CollapsedNewsPanel : HomeNewsPanelFooter
|
||||
{
|
||||
public CollapsedNewsPanel(APINewsPost post)
|
||||
: base(post)
|
||||
{
|
||||
}
|
||||
|
||||
protected override Drawable CreateContent(APINewsPost post) => new NewsTitleLink(post);
|
||||
|
||||
protected override NewsPostDrawableDate CreateDate(DateTimeOffset date) => new Date(date);
|
||||
|
||||
private class Date : NewsPostDrawableDate
|
||||
{
|
||||
public Date(DateTimeOffset date)
|
||||
: base(date)
|
||||
{
|
||||
}
|
||||
|
||||
protected override Drawable CreateDate(DateTimeOffset date, OverlayColourProvider colourProvider)
|
||||
{
|
||||
var drawableDate = new TextFlowContainer(t =>
|
||||
{
|
||||
t.Colour = colourProvider.Light1;
|
||||
})
|
||||
{
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Margin = new MarginPadding { Vertical = 5 }
|
||||
};
|
||||
|
||||
drawableDate.AddText($"{date:dd} ", t =>
|
||||
{
|
||||
t.Font = OsuFont.GetFont(size: 14, weight: FontWeight.Bold);
|
||||
});
|
||||
|
||||
drawableDate.AddText($"{date:MMM}", t =>
|
||||
{
|
||||
t.Font = OsuFont.GetFont(size: 14, weight: FontWeight.Regular);
|
||||
});
|
||||
|
||||
return drawableDate;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -5,8 +5,6 @@ using System;
|
||||
using osu.Framework.Allocation;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Cursor;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Framework.Platform;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Game.Graphics.Containers;
|
||||
@ -40,81 +38,7 @@ namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new ClickableNewsBackground(post),
|
||||
new GridContainer
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
ColumnDimensions = new[]
|
||||
{
|
||||
new Dimension(GridSizeMode.AutoSize),
|
||||
new Dimension()
|
||||
},
|
||||
RowDimensions = new[]
|
||||
{
|
||||
new Dimension(GridSizeMode.AutoSize)
|
||||
},
|
||||
Content = new[]
|
||||
{
|
||||
new Drawable[]
|
||||
{
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Width = 80,
|
||||
Padding = new MarginPadding(10),
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new Box
|
||||
{
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Width = 1,
|
||||
Colour = ColourProvider.Light1
|
||||
},
|
||||
new Container
|
||||
{
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Padding = new MarginPadding { Right = 11 },
|
||||
Child = new DateContainer(post.PublishedAt)
|
||||
}
|
||||
}
|
||||
},
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Padding = new MarginPadding { Right = 10 },
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new FillFlowContainer
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Margin = new MarginPadding { Top = 5, Bottom = 10 },
|
||||
Spacing = new Vector2(0, 10),
|
||||
Direction = FillDirection.Vertical,
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new TitleLink(post),
|
||||
new TextFlowContainer(f =>
|
||||
{
|
||||
f.Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular);
|
||||
})
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Text = post.Preview
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
new Footer(post)
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -158,54 +82,48 @@ namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
}
|
||||
}
|
||||
|
||||
private class TitleLink : OsuHoverContainer
|
||||
private class Footer : HomeNewsPanelFooter
|
||||
{
|
||||
private readonly APINewsPost post;
|
||||
protected override float BarPading => 10;
|
||||
|
||||
public TitleLink(APINewsPost post)
|
||||
public Footer(APINewsPost post)
|
||||
: base(post)
|
||||
{
|
||||
this.post = post;
|
||||
|
||||
RelativeSizeAxes = Axes.X;
|
||||
AutoSizeAxes = Axes.Y;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(GameHost host)
|
||||
protected override NewsPostDrawableDate CreateDate(DateTimeOffset date) => new Date(date);
|
||||
|
||||
protected override Drawable CreateContent(APINewsPost post) => new FillFlowContainer
|
||||
{
|
||||
Child = new TextFlowContainer(t =>
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Margin = new MarginPadding { Top = 5, Bottom = 10 },
|
||||
Spacing = new Vector2(0, 10),
|
||||
Direction = FillDirection.Vertical,
|
||||
Children = new Drawable[]
|
||||
{
|
||||
t.Font = OsuFont.GetFont(weight: FontWeight.Bold);
|
||||
new NewsTitleLink(post),
|
||||
new TextFlowContainer(f =>
|
||||
{
|
||||
f.Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular);
|
||||
})
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Text = post.Title
|
||||
Text = post.Preview
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
TooltipText = "view in browser";
|
||||
Action = () => host.OpenUrlExternally("https://osu.ppy.sh/home/news/" + post.Slug);
|
||||
}
|
||||
private class Date : NewsPostDrawableDate
|
||||
{
|
||||
public Date(DateTimeOffset date)
|
||||
: base(date)
|
||||
{
|
||||
Margin = new MarginPadding { Top = 10 };
|
||||
}
|
||||
|
||||
private class DateContainer : CompositeDrawable, IHasCustomTooltip
|
||||
{
|
||||
public ITooltip GetCustomTooltip() => new DateTooltip();
|
||||
|
||||
public object TooltipContent => date;
|
||||
|
||||
private readonly DateTimeOffset date;
|
||||
|
||||
public DateContainer(DateTimeOffset date)
|
||||
{
|
||||
this.date = date;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OverlayColourProvider colourProvider)
|
||||
{
|
||||
AutoSizeAxes = Axes.Both;
|
||||
InternalChild = new FillFlowContainer
|
||||
protected override Drawable CreateDate(DateTimeOffset date, OverlayColourProvider colourProvider) => new FillFlowContainer
|
||||
{
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Vertical,
|
||||
@ -219,7 +137,7 @@ namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
Origin = Anchor.TopRight,
|
||||
Font = OsuFont.GetFont(weight: FontWeight.Bold), // using Bold since there is no 800 weight alternative
|
||||
Colour = colourProvider.Light1,
|
||||
Text = date.Day.ToString()
|
||||
Text = $"{date: dd}"
|
||||
},
|
||||
new TextFlowContainer(f =>
|
||||
{
|
||||
|
79
osu.Game/Overlays/Dashboard/Home/News/HomeNewsPanelFooter.cs
Normal file
79
osu.Game/Overlays/Dashboard/Home/News/HomeNewsPanelFooter.cs
Normal file
@ -0,0 +1,79 @@
|
||||
// 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 osu.Framework.Allocation;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Game.Online.API.Requests.Responses;
|
||||
|
||||
namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
{
|
||||
public abstract class HomeNewsPanelFooter : CompositeDrawable
|
||||
{
|
||||
protected virtual float BarPading { get; } = 0;
|
||||
|
||||
private readonly APINewsPost post;
|
||||
|
||||
protected HomeNewsPanelFooter(APINewsPost post)
|
||||
{
|
||||
this.post = post;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OverlayColourProvider colourProvider)
|
||||
{
|
||||
RelativeSizeAxes = Axes.X;
|
||||
AutoSizeAxes = Axes.Y;
|
||||
InternalChild = new GridContainer
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
RowDimensions = new[]
|
||||
{
|
||||
new Dimension(GridSizeMode.AutoSize)
|
||||
},
|
||||
ColumnDimensions = new[]
|
||||
{
|
||||
new Dimension(GridSizeMode.Absolute, size: 60),
|
||||
new Dimension(GridSizeMode.Absolute, size: 20),
|
||||
new Dimension()
|
||||
},
|
||||
Content = new[]
|
||||
{
|
||||
new Drawable[]
|
||||
{
|
||||
CreateDate(post.PublishedAt),
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Padding = new MarginPadding { Vertical = BarPading },
|
||||
Child = new Box
|
||||
{
|
||||
Anchor = Anchor.TopCentre,
|
||||
Origin = Anchor.TopRight,
|
||||
Width = 1,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Colour = colourProvider.Light1
|
||||
}
|
||||
},
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Anchor = Anchor.CentreLeft,
|
||||
Origin = Anchor.CentreLeft,
|
||||
Padding = new MarginPadding { Right = 10 },
|
||||
Child = CreateContent(post)
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
protected abstract NewsPostDrawableDate CreateDate(DateTimeOffset date);
|
||||
|
||||
protected abstract Drawable CreateContent(APINewsPost post);
|
||||
}
|
||||
}
|
@ -0,0 +1,37 @@
|
||||
// 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 osu.Framework.Allocation;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Cursor;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Framework.Graphics;
|
||||
|
||||
namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
{
|
||||
public abstract class NewsPostDrawableDate : CompositeDrawable, IHasCustomTooltip
|
||||
{
|
||||
public ITooltip GetCustomTooltip() => new DateTooltip();
|
||||
|
||||
public object TooltipContent => date;
|
||||
|
||||
private readonly DateTimeOffset date;
|
||||
|
||||
protected NewsPostDrawableDate(DateTimeOffset date)
|
||||
{
|
||||
this.date = date;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OverlayColourProvider colourProvider)
|
||||
{
|
||||
AutoSizeAxes = Axes.Both;
|
||||
Anchor = Anchor.TopRight;
|
||||
Origin = Anchor.TopRight;
|
||||
InternalChild = CreateDate(date, colourProvider);
|
||||
}
|
||||
|
||||
protected abstract Drawable CreateDate(DateTimeOffset date, OverlayColourProvider colourProvider);
|
||||
}
|
||||
}
|
43
osu.Game/Overlays/Dashboard/Home/News/NewsTitleLink.cs
Normal file
43
osu.Game/Overlays/Dashboard/Home/News/NewsTitleLink.cs
Normal file
@ -0,0 +1,43 @@
|
||||
// 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;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Platform;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Game.Graphics.Containers;
|
||||
using osu.Game.Online.API.Requests.Responses;
|
||||
|
||||
namespace osu.Game.Overlays.Dashboard.Home.News
|
||||
{
|
||||
public class NewsTitleLink : OsuHoverContainer
|
||||
{
|
||||
private readonly APINewsPost post;
|
||||
|
||||
public NewsTitleLink(APINewsPost post)
|
||||
{
|
||||
this.post = post;
|
||||
|
||||
RelativeSizeAxes = Axes.X;
|
||||
AutoSizeAxes = Axes.Y;
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(GameHost host)
|
||||
{
|
||||
Child = new TextFlowContainer(t =>
|
||||
{
|
||||
t.Font = OsuFont.GetFont(weight: FontWeight.Bold);
|
||||
})
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Text = post.Title
|
||||
};
|
||||
|
||||
TooltipText = "view in browser";
|
||||
Action = () => host.OpenUrlExternally("https://osu.ppy.sh/home/news/" + post.Slug);
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user