1
0
mirror of https://github.com/ppy/osu.git synced 2025-01-13 14:12:56 +08:00

Implement NewsArticleCover class (#7192)

Implement NewsArticleCover class
This commit is contained in:
Dean Herbert 2019-12-18 16:15:23 +09:00 committed by GitHub
commit 7831e6ed33
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 218 additions and 3 deletions

View File

@ -1,23 +1,66 @@
// 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.Graphics;
using osu.Game.Overlays;
using osu.Game.Overlays.News;
namespace osu.Game.Tests.Visual.Online
{
public class TestSceneNewsOverlay : OsuTestScene
{
private NewsOverlay news;
private TestNewsOverlay news;
protected override void LoadComplete()
{
base.LoadComplete();
Add(news = new NewsOverlay());
Add(news = new TestNewsOverlay());
AddStep(@"Show", news.Show);
AddStep(@"Hide", news.Hide);
AddStep(@"Show front page", () => news.ShowFrontPage());
AddStep(@"Custom article", () => news.Current.Value = "Test Article 101");
AddStep(@"Article covers", () => news.LoadAndShowContent(new NewsCoverTest()));
}
private class TestNewsOverlay : NewsOverlay
{
public new void LoadAndShowContent(NewsContent content) => base.LoadAndShowContent(content);
}
private class NewsCoverTest : NewsContent
{
public NewsCoverTest()
{
Spacing = new osuTK.Vector2(0, 10);
var article = new NewsArticleCover.ArticleInfo
{
Author = "Ephemeral",
CoverUrl = "https://assets.ppy.sh/artists/58/header.jpg",
Time = new DateTime(2019, 12, 4),
Title = "New Featured Artist: Kurokotei"
};
Children = new Drawable[]
{
new NewsArticleCover(article)
{
Height = 200
},
new NewsArticleCover(article)
{
Height = 120
},
new NewsArticleCover(article)
{
RelativeSizeAxes = Axes.None,
Size = new osuTK.Vector2(400, 200),
}
};
}
}
}
}

View File

@ -0,0 +1,157 @@
// 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.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Colour;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Cursor;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Textures;
using osu.Game.Graphics;
using osu.Game.Graphics.Sprites;
using osuTK.Graphics;
namespace osu.Game.Overlays.News
{
public class NewsArticleCover : Container
{
public NewsArticleCover(ArticleInfo info)
{
RelativeSizeAxes = Axes.X;
Masking = true;
CornerRadius = 4;
NewsBackground bg;
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = ColourInfo.GradientVertical(OsuColour.Gray(0.2f), OsuColour.Gray(0.1f))
},
new DelayedLoadWrapper(bg = new NewsBackground(info.CoverUrl)
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
FillMode = FillMode.Fill,
Alpha = 0
})
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
},
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = ColourInfo.GradientVertical(Color4.Black.Opacity(0.1f), Color4.Black.Opacity(0.6f)),
Alpha = 1f,
},
new DateContainer(info.Time)
{
Margin = new MarginPadding
{
Right = 20,
Top = 20,
}
},
new OsuSpriteText
{
Anchor = Anchor.BottomLeft,
Origin = Anchor.BottomLeft,
Margin = new MarginPadding
{
Left = 25,
Bottom = 50,
},
Font = OsuFont.GetFont(Typeface.Exo, 24, FontWeight.Bold),
Text = info.Title,
},
new OsuSpriteText
{
Anchor = Anchor.BottomLeft,
Origin = Anchor.BottomLeft,
Margin = new MarginPadding
{
Left = 25,
Bottom = 30,
},
Font = OsuFont.GetFont(Typeface.Exo, 16, FontWeight.Bold),
Text = "by " + info.Author
}
};
bg.OnLoadComplete += d => d.FadeIn(250, Easing.In);
}
[LongRunningLoad]
private class NewsBackground : Sprite
{
private readonly string url;
public NewsBackground(string coverUrl)
{
url = coverUrl ?? "Headers/news";
}
[BackgroundDependencyLoader]
private void load(LargeTextureStore store)
{
Texture = store.Get(url);
}
}
private class DateContainer : Container, IHasTooltip
{
private readonly DateTime date;
public DateContainer(DateTime date)
{
this.date = date;
Anchor = Anchor.TopRight;
Origin = Anchor.TopRight;
Masking = true;
CornerRadius = 4;
AutoSizeAxes = Axes.Both;
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.Black.Opacity(0.5f),
},
new OsuSpriteText
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Font = OsuFont.GetFont(Typeface.Exo, 12, FontWeight.Black, false, false),
Text = date.ToString("d MMM yyy").ToUpper(),
Margin = new MarginPadding
{
Vertical = 4,
Horizontal = 8,
}
}
};
}
public string TooltipText => date.ToString("dddd dd MMMM yyyy hh:mm:ss UTCz").ToUpper();
}
//fake API data struct to use for now as a skeleton for data, as there is no API struct for news article info for now
public class ArticleInfo
{
public string Title { get; set; }
public string CoverUrl { get; set; }
public DateTime Time { get; set; }
public string Author { get; set; }
}
}
}

View File

@ -1,6 +1,7 @@
// 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.Threading;
using osu.Framework.Allocation;
using osu.Framework.Bindables;
using osu.Framework.Graphics;
@ -16,7 +17,6 @@ namespace osu.Game.Overlays
{
private NewsHeader header;
//ReSharper disable NotAccessedField.Local
private Container<NewsContent> content;
public readonly Bindable<string> Current = new Bindable<string>(null);
@ -59,6 +59,21 @@ namespace osu.Game.Overlays
Current.TriggerChange();
}
private CancellationTokenSource loadContentCancellation;
protected void LoadAndShowContent(NewsContent newContent)
{
content.FadeTo(0.2f, 300, Easing.OutQuint);
loadContentCancellation?.Cancel();
LoadComponentAsync(newContent, c =>
{
content.Child = c;
content.FadeIn(300, Easing.OutQuint);
}, (loadContentCancellation = new CancellationTokenSource()).Token);
}
public void ShowFrontPage()
{
Current.Value = null;