1
0
mirror of https://github.com/ppy/osu.git synced 2024-11-11 11:37:28 +08:00

Update song / chat / beatmap info display to reflect new design

This commit is contained in:
Dean Herbert 2020-03-08 14:46:09 +09:00
parent 3744aaf55f
commit 8b0b910196
6 changed files with 107 additions and 117 deletions

View File

@ -35,3 +35,4 @@ namespace osu.Game.Tournament.Tests.Screens
} }
} }
} }

View File

@ -4,10 +4,8 @@
using System; using System;
using osu.Framework.Allocation; using osu.Framework.Allocation;
using osu.Framework.Bindables; using osu.Framework.Bindables;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics; using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers; using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Effects;
using osu.Framework.Graphics.Shapes; using osu.Framework.Graphics.Shapes;
using osu.Framework.Graphics.Sprites; using osu.Framework.Graphics.Sprites;
using osu.Game.Beatmaps; using osu.Game.Beatmaps;
@ -24,6 +22,8 @@ namespace osu.Game.Tournament.Components
{ {
private BeatmapInfo beatmap; private BeatmapInfo beatmap;
private const float height = 145;
[Resolved] [Resolved]
private IBindable<RulesetInfo> ruleset { get; set; } private IBindable<RulesetInfo> ruleset { get; set; }
@ -52,15 +52,7 @@ namespace osu.Game.Tournament.Components
} }
} }
private Container panelContents; private FillFlowContainer flow;
private Container innerPanel;
private Container outerPanel;
private TournamentBeatmapPanel panel;
private float panelWidth => expanded ? 0.6f : 1;
private const float main_width = 0.97f;
private const float inner_panel_width = 0.7f;
private bool expanded; private bool expanded;
@ -70,86 +62,27 @@ namespace osu.Game.Tournament.Components
set set
{ {
expanded = value; expanded = value;
panel?.ResizeWidthTo(panelWidth, 800, Easing.OutQuint); flow.Direction = expanded ? FillDirection.Full : FillDirection.Vertical;
if (expanded)
{
innerPanel.ResizeWidthTo(inner_panel_width, 800, Easing.OutQuint);
outerPanel.ResizeWidthTo(main_width, 800, Easing.OutQuint);
}
else
{
innerPanel.ResizeWidthTo(1, 800, Easing.OutQuint);
outerPanel.ResizeWidthTo(0.25f, 800, Easing.OutQuint);
}
} }
} }
[BackgroundDependencyLoader] [BackgroundDependencyLoader]
private void load() private void load()
{ {
RelativeSizeAxes = Axes.Both; RelativeSizeAxes = Axes.X;
AutoSizeAxes = Axes.Y;
InternalChildren = new Drawable[] InternalChildren = new Drawable[]
{ {
outerPanel = new Container flow = new FillFlowContainer
{ {
Masking = true,
EdgeEffect = new EdgeEffectParameters
{
Colour = Color4.Black.Opacity(0.2f),
Type = EdgeEffectType.Shadow,
Radius = 5,
},
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
LayoutDuration = 500,
LayoutEasing = Easing.OutQuint,
Direction = FillDirection.Full,
Anchor = Anchor.BottomRight, Anchor = Anchor.BottomRight,
Origin = Anchor.BottomRight, Origin = Anchor.BottomRight,
RelativePositionAxes = Axes.X,
X = -(1 - main_width) / 2,
Y = -10,
Width = main_width,
Height = TournamentBeatmapPanel.HEIGHT,
CornerRadius = TournamentBeatmapPanel.HEIGHT / 2,
CornerExponent = 2,
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = OsuColour.Gray(0.93f),
},
new OsuLogo
{
Triangles = false,
Colour = OsuColour.Gray(0.33f),
Scale = new Vector2(0.08f),
Margin = new MarginPadding(50),
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
},
innerPanel = new Container
{
Masking = true,
CornerRadius = TournamentBeatmapPanel.HEIGHT / 2,
CornerExponent = 2,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
Width = inner_panel_width,
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = OsuColour.Gray(0.86f),
},
panelContents = new Container
{
RelativeSizeAxes = Axes.Both,
}
}
}
}
} }
}; };
@ -160,7 +93,7 @@ namespace osu.Game.Tournament.Components
{ {
if (beatmap == null) if (beatmap == null)
{ {
panelContents.Clear(); flow.Clear();
return; return;
} }
@ -219,34 +152,86 @@ namespace osu.Game.Tournament.Components
break; break;
} }
panelContents.Children = new Drawable[] flow.Children = new Drawable[]
{ {
new DiffPiece(("Length", TimeSpan.FromMilliseconds(length).ToString(@"mm\:ss"))) new Container
{ {
Anchor = Anchor.CentreLeft, RelativeSizeAxes = Axes.X,
Origin = Anchor.BottomLeft, Height = height / 2,
Width = 0.5f,
Anchor = Anchor.BottomRight,
Origin = Anchor.BottomRight,
Children = new Drawable[]
{
new GridContainer
{
RelativeSizeAxes = Axes.Both,
Content = new[]
{
new Drawable[]
{
new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Direction = FillDirection.Vertical,
Children = new Drawable[]
{
new DiffPiece(stats),
new DiffPiece(("Star Rating", $"{beatmap.StarDifficulty:0.#}{srExtra}"))
}
},
new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Direction = FillDirection.Vertical,
Children = new Drawable[]
{
new DiffPiece(("Length", TimeSpan.FromMilliseconds(length).ToString(@"mm\:ss"))),
new DiffPiece(("BPM", $"{bpm:0.#}"))
}
},
new Container
{
RelativeSizeAxes = Axes.Both,
Children = new Drawable[]
{
new Box
{
Colour = Color4.Black,
RelativeSizeAxes = Axes.Both,
Alpha = 0.1f,
},
new OsuLogo
{
Triangles = false,
Scale = new Vector2(0.08f),
Margin = new MarginPadding(50),
X = -10,
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
},
}
},
},
}
}
}
}, },
new DiffPiece(("BPM", $"{bpm:0.#}")) new TournamentBeatmapPanel(beatmap)
{ {
Anchor = Anchor.CentreLeft, RelativeSizeAxes = Axes.X,
Origin = Anchor.TopLeft Width = 0.5f,
}, Height = height / 2,
new DiffPiece(stats) Anchor = Anchor.BottomRight,
{ Origin = Anchor.BottomRight,
Anchor = Anchor.CentreRight,
Origin = Anchor.BottomRight
},
new DiffPiece(("Star Rating", $"{beatmap.StarDifficulty:0.#}{srExtra}"))
{
Anchor = Anchor.CentreRight,
Origin = Anchor.TopRight
},
panel = new TournamentBeatmapPanel(beatmap)
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
Size = new Vector2(panelWidth, 1)
} }
}; };
} }
@ -258,10 +243,9 @@ namespace osu.Game.Tournament.Components
Margin = new MarginPadding { Horizontal = 15, Vertical = 1 }; Margin = new MarginPadding { Horizontal = 15, Vertical = 1 };
AutoSizeAxes = Axes.Both; AutoSizeAxes = Axes.Both;
static void cp(SpriteText s, Color4 colour) static void cp(SpriteText s, bool bold)
{ {
s.Colour = colour; s.Font = OsuFont.Torus.With(weight: bold ? FontWeight.Bold : FontWeight.Regular, size: 15);
s.Font = OsuFont.Torus.With(weight: FontWeight.Bold, size: 15);
} }
for (var i = 0; i < tuples.Length; i++) for (var i = 0; i < tuples.Length; i++)
@ -272,14 +256,14 @@ namespace osu.Game.Tournament.Components
{ {
AddText(" / ", s => AddText(" / ", s =>
{ {
cp(s, OsuColour.Gray(0.33f)); cp(s, false);
s.Spacing = new Vector2(-2, 0); s.Spacing = new Vector2(-2, 0);
}); });
} }
AddText(new TournamentSpriteText { Text = heading }, s => cp(s, OsuColour.Gray(0.33f))); AddText(new TournamentSpriteText { Text = heading }, s => cp(s, false));
AddText(" ", s => cp(s, OsuColour.Gray(0.33f))); AddText(" ", s => cp(s, false));
AddText(new TournamentSpriteText { Text = content }, s => cp(s, OsuColour.Gray(0.5f))); AddText(new TournamentSpriteText { Text = content }, s => cp(s, true));
} }
} }
} }

View File

@ -70,8 +70,8 @@ namespace osu.Game.Tournament.Components
new FillFlowContainer new FillFlowContainer
{ {
AutoSizeAxes = Axes.Both, AutoSizeAxes = Axes.Both,
Anchor = Anchor.TopCentre, Anchor = Anchor.CentreLeft,
Origin = Anchor.TopCentre, Origin = Anchor.CentreLeft,
Padding = new MarginPadding(vertical_padding), Padding = new MarginPadding(vertical_padding),
Direction = FillDirection.Vertical, Direction = FillDirection.Vertical,
Children = new Drawable[] Children = new Drawable[]
@ -137,8 +137,8 @@ namespace osu.Game.Tournament.Components
Texture = textures.Get($"mods/{mods}"), Texture = textures.Get($"mods/{mods}"),
Anchor = Anchor.CentreRight, Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight, Origin = Anchor.CentreRight,
Margin = new MarginPadding(20), Margin = new MarginPadding(10),
Scale = new Vector2(0.5f) Scale = new Vector2(0.8f)
}); });
} }
} }

View File

@ -9,7 +9,6 @@ using osu.Game.Online.Chat;
using osu.Game.Overlays.Chat; using osu.Game.Overlays.Chat;
using osu.Game.Tournament.IPC; using osu.Game.Tournament.IPC;
using osu.Game.Tournament.Models; using osu.Game.Tournament.Models;
using osuTK;
namespace osu.Game.Tournament.Components namespace osu.Game.Tournament.Components
{ {
@ -22,7 +21,7 @@ namespace osu.Game.Tournament.Components
public TournamentMatchChatDisplay() public TournamentMatchChatDisplay()
{ {
RelativeSizeAxes = Axes.X; RelativeSizeAxes = Axes.X;
Size = new Vector2(0.5f, 142); Height = 144;
Anchor = Anchor.BottomLeft; Anchor = Anchor.BottomLeft;
Origin = Anchor.BottomLeft; Origin = Anchor.BottomLeft;

View File

@ -21,6 +21,7 @@ namespace osu.Game.Tournament.Screens
{ {
Anchor = Anchor.BottomRight, Anchor = Anchor.BottomRight,
Origin = Anchor.BottomRight, Origin = Anchor.BottomRight,
Depth = float.MinValue,
}); });
} }

View File

@ -194,9 +194,14 @@ namespace osu.Game.Tournament
switch (currentScreen) switch (currentScreen)
{ {
case GameplayScreen _:
case MapPoolScreen _: case MapPoolScreen _:
chatContainer.FadeIn(TournamentScreen.FADE_DELAY); chatContainer.FadeIn(TournamentScreen.FADE_DELAY);
chatContainer.ResizeWidthTo(1, 500, Easing.OutQuint);
break;
case GameplayScreen _:
chatContainer.FadeIn(TournamentScreen.FADE_DELAY);
chatContainer.ResizeWidthTo(0.5f, 500, Easing.OutQuint);
break; break;
default: default: