h1or4dme8/osu-lazer
1
0
Fork 0
mirror of https://github.com/ppy/osu.git synced 2024-12-14 11:35:35 +08:00
Code Issues Releases Wiki Activity

Add a basic implementation of the new design results screen.

Browse Source
This commit is contained in:
Dean Herbert 2017-04-11 14:01:13 +09:00
parent 77dbbe6f34
commit d51b37cb44
No known key found for this signature in database
GPG Key ID: 46D71BF4958ABB49
12 changed files with 662 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
osu.Desktop.VisualTests/Tests/TestCaseResults.cs Normal file
View File

@ -0,0 +1,55 @@
using System.Linq;
using osu.Framework.Allocation;
using osu.Framework.Testing;
using osu.Game.Beatmaps;
using osu.Game.Database;
using osu.Game.Modes;
using osu.Game.Modes.Scoring;
using osu.Game.Screens.Ranking;
using osu.Game.Users;
namespace osu.Desktop.VisualTests.Tests
{
internal class TestCaseResults : TestCase
{
private BeatmapDatabase db;
public override string Description => @"Results after playing.";
[BackgroundDependencyLoader]
private void load(BeatmapDatabase db)
{
this.db = db;
}
private WorkingBeatmap beatmap;
public override void Reset()
{
base.Reset();
if (beatmap == null)
{
var beatmapInfo = db.Query<BeatmapInfo>().FirstOrDefault(b => b.Mode == PlayMode.Osu);
if (beatmapInfo != null)
beatmap = db.GetWorkingBeatmap(beatmapInfo);
}
base.Reset();
Add(new Results(new Score()
{
TotalScore = 2845370,
Accuracy = 0.98,
Rank = ScoreRank.A,
User = new User
{
Username = "peppy",
}
})
{
Beatmap = beatmap
});
}
}
}

1
osu.Desktop.VisualTests/osu.Desktop.VisualTests.csproj
View File

@ -198,6 +198,7 @@
<Compile Include="Tests\TestCaseKeyCounter.cs" />
<Compile Include="Tests\TestCaseMenuButtonSystem.cs" />
<Compile Include="Tests\TestCaseReplay.cs" />
<Compile Include="Tests\TestCaseResults.cs" />
<Compile Include="Tests\TestCaseScoreCounter.cs" />
<Compile Include="Tests\TestCaseTabControl.cs" />
<Compile Include="Tests\TestCaseTaikoHitObjects.cs" />

7
osu.Game/Screens/Play/Player.cs
View File

@ -17,11 +17,11 @@ using osu.Game.Database;
using osu.Game.Rulesets;
using osu.Game.Rulesets.UI;
using osu.Game.Screens.Backgrounds;
using osu.Game.Screens.Ranking;
using System;
using System.Linq;
using osu.Framework.Threading;
using osu.Game.Rulesets.Scoring;
using osu.Game.Screens.Ranking;
namespace osu.Game.Screens.Play
{
@ -266,10 +266,7 @@ namespace osu.Game.Screens.Play
Delay(1000);
onCompletionEvent = Schedule(delegate
{
Push(new Results
{
Score = scoreProcessor.CreateScore()
});
Push(new Results(scoreProcessor.CreateScore()));
});
}

17
osu.Game/Screens/Ranking/AspectContainer.cs Normal file
View File

@ -0,0 +1,17 @@
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
namespace osu.Game.Screens.Ranking
{
public class AspectContainer : Container
{
protected override void Update()
{
base.Update();
if (RelativeSizeAxes == Axes.X)
Height = DrawWidth;
else
Width = DrawHeight;
}
}
}

9
osu.Game/Screens/Ranking/ResultMode.cs Normal file
View File

@ -0,0 +1,9 @@
namespace osu.Game.Screens.Ranking
{
public enum ResultMode
{
Summary,
Ranking,
Share
}
}

105
osu.Game/Screens/Ranking/ResultModeButton.cs Normal file
View File

@ -0,0 +1,105 @@
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.UserInterface;
using osu.Game.Graphics;
using OpenTK;
using OpenTK.Graphics;
namespace osu.Game.Screens.Ranking
{
public class ResultModeButton : TabItem<ResultMode>
{
private readonly FontAwesome icon;
private Color4 activeColour;
private Color4 inactiveColour;
private CircularContainer colouredPart;
public ResultModeButton(ResultMode mode) : base(mode)
{
switch (mode)
{
case ResultMode.Summary:
icon = FontAwesome.fa_asterisk;
break;
case ResultMode.Ranking:
icon = FontAwesome.fa_list;
break;
case ResultMode.Share:
icon = FontAwesome.fa_camera;
break;
}
}
public override bool Active
{
get
{
return base.Active;
}
set
{
base.Active = value;
colouredPart.FadeColour(Active ? activeColour : inactiveColour, 200, EasingTypes.OutQuint);
}
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
Size = new Vector2(50);
Masking = true;
CornerRadius = 25;
activeColour = colours.PinkDarker;
inactiveColour = OsuColour.Gray(0.8f);
EdgeEffect = new EdgeEffect
{
Colour = Color4.Black.Opacity(0.4f),
Type = EdgeEffectType.Shadow,
Radius = 5,
};
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.White,
},
colouredPart = new CircularContainer
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
Size = new Vector2(0.8f),
BorderThickness = 4,
BorderColour = Color4.White,
Colour = inactiveColour,
Children = new Drawable[]
{
new Box
{
AlwaysPresent = true, //for border rendering
RelativeSizeAxes = Axes.Both,
Colour = Color4.Transparent,
},
new TextAwesome
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Shadow = false,
Colour = OsuColour.Gray(0.95f),
Icon = icon,
TextSize = 20,
}
}
}
};
}
}
}

28
osu.Game/Screens/Ranking/ResultModeTabControl.cs Normal file
View File

@ -0,0 +1,28 @@
using osu.Framework.Graphics;
using osu.Framework.Graphics.Primitives;
using osu.Framework.Graphics.UserInterface;
using OpenTK;
namespace osu.Game.Screens.Ranking
{
public class ResultModeTabControl : TabControl<ResultMode>
{
public ResultModeTabControl()
{
TabContainer.Anchor = Anchor.BottomCentre;
TabContainer.Origin = Anchor.BottomCentre;
TabContainer.Spacing = new Vector2(15);
TabContainer.Masking = false;
TabContainer.Padding = new MarginPadding(5);
}
protected override Dropdown<ResultMode> CreateDropdown() => null;
protected override TabItem<ResultMode> CreateTabItem(ResultMode value) => new ResultModeButton(value)
{
Anchor = TabContainer.Anchor,
Origin = TabContainer.Origin
};
}
}

219
osu.Game/Screens/Ranking/Results.cs
View File

@ -1,93 +1,218 @@
// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Screens;
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Extensions.IEnumerableExtensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Game.Graphics.Sprites;
using osu.Framework.Graphics.Primitives;
using osu.Game.Rulesets.Scoring;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Screens;
using osu.Game.Graphics.Containers;
using osu.Game.Screens.Backgrounds;
using OpenTK;
using OpenTK.Graphics;
namespace osu.Game.Screens.Ranking
{
internal class Results : OsuScreen
public class Results : OsuScreen
{
protected override BackgroundScreen CreateBackground() => new BackgroundScreenBeatmap(Beatmap);
private readonly Score score;
private Container circleOuterBackground;
private Container circleOuter;
private Container circleInner;
private ParallaxContainer backgroundParallax;
private ResultModeTabControl modeChangeButtons;
private Container currentPage;
private static readonly Vector2 background_blur = new Vector2(20);
private ScoreDisplay scoreDisplay;
protected override BackgroundScreen CreateBackground() => new BackgroundScreenBeatmap(Beatmap);
private const float overscan = 1.3f;
private const float circle_outer_scale = 0.96f;
public Results(Score score)
{
this.score = score;
}
protected override void OnEntering(Screen last)
{
base.OnEntering(last);
Background.Schedule(() => (Background as BackgroundScreenBeatmap)?.BlurTo(background_blur, 1000));
}
(Background as BackgroundScreenBeatmap)?.BlurTo(background_blur, 2500, EasingTypes.OutQuint);
protected override bool OnExiting(Screen next)
{
Background.Schedule(() => Background.FadeColour(Color4.White, 500));
return base.OnExiting(next);
}
var allCircles = new[] { circleOuterBackground, circleInner, circleOuter };
public Score Score
{
set
allCircles.ForEach(c =>
{
scoreDisplay?.FadeOut(500);
scoreDisplay?.Expire();
c.FadeOut();
c.ScaleTo(0);
});
scoreDisplay = new ScoreDisplay(value)
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
};
backgroundParallax.FadeOut();
modeChangeButtons.FadeOut();
currentPage.FadeOut();
Add(scoreDisplay);
const float appear_time = 800;
scoreDisplay.FadeIn(500);
scoreDisplay.ScaleTo(0.1f);
scoreDisplay.ScaleTo(1, 1000, EasingTypes.OutElastic);
scoreDisplay.RotateTo(360 * 5, 1000, EasingTypes.OutElastic);
circleOuterBackground.ScaleTo(1, appear_time, EasingTypes.OutQuint);
circleOuterBackground.FadeTo(1, appear_time, EasingTypes.OutQuint);
}
Content.Delay(appear_time * 0.25f, true);
circleOuter.ScaleTo(1, appear_time, EasingTypes.OutQuint);
circleOuter.FadeTo(1, appear_time, EasingTypes.OutQuint);
Content.Delay(appear_time * 0.3f, true);
backgroundParallax.FadeIn(appear_time, EasingTypes.OutQuint);
circleInner.ScaleTo(1, appear_time, EasingTypes.OutQuint);
circleInner.FadeTo(1, appear_time, EasingTypes.OutQuint);
Content.Delay(appear_time * 0.4f, true);
modeChangeButtons.FadeIn(appear_time, EasingTypes.OutQuint);
currentPage.FadeIn(appear_time, EasingTypes.OutQuint);
Content.DelayReset();
}
}
internal class ScoreDisplay : Container
{
public ScoreDisplay(Score s)
[BackgroundDependencyLoader]
private void load()
{
AutoSizeAxes = Axes.Both;
Children = new Drawable[]
{
new FillFlowContainer
new AspectContainer
{
AutoSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
RelativeSizeAxes = Axes.Y,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Height = overscan,
Children = new Drawable[]
{
new OsuSpriteText
circleOuterBackground = new CircularContainer
{
TextSize = 40,
Text = $@"Accuracy: {s.Accuracy:#0.00%}",
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Masking = true,
Children = new Drawable[]
{
new Box
{
Alpha = 0.2f,
RelativeSizeAxes = Axes.Both,
Colour = Color4.Black,
}
}
},
new OsuSpriteText
circleOuter = new CircularContainer
{
TextSize = 40,
Text = $@"Score: {s.TotalScore}",
Size = new Vector2(circle_outer_scale),
EdgeEffect = new EdgeEffect
{
Colour = Color4.Black.Opacity(0.4f),
Type = EdgeEffectType.Shadow,
Radius = 15,
},
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Masking = true,
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.White,
},
backgroundParallax = new ParallaxContainer
{
RelativeSizeAxes = Axes.Both,
ParallaxAmount = 0.01f,
Scale = new Vector2(1 / circle_outer_scale / overscan),
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Children = new Drawable[]
{
new Sprite
{
Alpha = 0.5f,
Texture = Beatmap?.Background,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
FillMode = FillMode.Fill
}
}
},
modeChangeButtons = new ResultModeTabControl
{
Anchor = Anchor.BottomCentre,
Origin = Anchor.BottomCentre,
RelativeSizeAxes = Axes.X,
Height = 50,
Margin = new MarginPadding { Bottom = 110 },
}
}
},
new OsuSpriteText
circleInner = new CircularContainer
{
TextSize = 40,
Text = $@"MaxCombo: {s.MaxCombo}",
Size = new Vector2(0.6f),
EdgeEffect = new EdgeEffect
{
Colour = Color4.Black.Opacity(0.4f),
Type = EdgeEffectType.Shadow,
Radius = 15,
},
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Masking = true,
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.White,
},
}
}
}
}
};
modeChangeButtons.AddItem(ResultMode.Summary);
modeChangeButtons.AddItem(ResultMode.Ranking);
modeChangeButtons.AddItem(ResultMode.Share);
modeChangeButtons.Current.ValueChanged += mode =>
{
currentPage?.FadeOut();
currentPage?.Expire();
switch (mode)
{
case ResultMode.Summary:
currentPage = new ResultsScorePage(score);
break;
case ResultMode.Ranking:
currentPage = new ResultsRankingPage(score, Beatmap.BeatmapInfo);
break;
}
if (currentPage != null)
circleInner.Add(currentPage);
};
modeChangeButtons.Current.TriggerChange();
}
}
}
}

89
osu.Game/Screens/Ranking/ResultsPage.cs Normal file
View File

@ -0,0 +1,89 @@
// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Sprites;
using osu.Game.Graphics;
using osu.Game.Modes.Scoring;
using OpenTK;
using OpenTK.Graphics;
namespace osu.Game.Screens.Ranking
{
internal class ResultsPage : Container
{
protected Score Score;
private CircularContainer content;
private Box fill;
protected override Container<Drawable> Content => content;
public ResultsPage(Score score)
{
Score = score;
RelativeSizeAxes = Axes.Both;
}
protected override void LoadComplete()
{
base.LoadComplete();
fill.Delay(400);
fill.FadeInFromZero(600);
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
AddInternal(new Drawable[]
{
fill = new Box
{
Alpha = 0,
RelativeSizeAxes = Axes.Both,
Colour = colours.Gray6
},
new CircularContainer
{
EdgeEffect = new EdgeEffect
{
Colour = Color4.Black.Opacity(1),
Type = EdgeEffectType.Shadow,
Radius = 15,
},
RelativeSizeAxes = Axes.Both,
Masking = true,
BorderThickness = 20,
BorderColour = Color4.White,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Children = new Drawable[]
{
new Box{
RelativeSizeAxes = Axes.Both,
Alpha = 0,
AlwaysPresent = true
},
}
},
content = new CircularContainer
{
EdgeEffect = new EdgeEffect
{
Colour = Color4.Black.Opacity(0.4f),
Type = EdgeEffectType.Shadow,
Radius = 15,
},
RelativeSizeAxes = Axes.Both,
Masking = true,
Size = new Vector2(0.88f),
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
}
});
}
}
}

45
osu.Game/Screens/Ranking/ResultsRankingPage.cs Normal file
View File

@ -0,0 +1,45 @@
// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Sprites;
using osu.Game.Database;
using osu.Game.Graphics;
using osu.Game.Modes.Scoring;
using osu.Game.Screens.Select.Leaderboards;
using OpenTK;
namespace osu.Game.Screens.Ranking
{
internal class ResultsRankingPage : ResultsPage
{
private readonly BeatmapInfo beatmap;
public ResultsRankingPage(Score score, BeatmapInfo beatmap = null) : base(score)
{
this.beatmap = beatmap;
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
Children = new Drawable[]
{
new Box
{
Colour = colours.GrayE,
RelativeSizeAxes = Axes.Both,
},
new Leaderboard
{
Origin = Anchor.Centre,
Anchor = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
Beatmap = beatmap ?? Score.Beatmap,
Scale = new Vector2(0.7f)
}
};
}
}
}

132
osu.Game/Screens/Ranking/ResultsScorePage.cs Normal file
View File

@ -0,0 +1,132 @@
// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Primitives;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Textures;
using osu.Game.Graphics;
using osu.Game.Graphics.Sprites;
using osu.Game.Graphics.UserInterface;
using osu.Game.Modes.Scoring;
using osu.Game.Screens.Select.Leaderboards;
using osu.Game.Users;
using OpenTK;
using OpenTK.Graphics;
namespace osu.Game.Screens.Ranking
{
internal class ResultsScorePage : ResultsPage
{
private ScoreCounter scoreCounter;
public ResultsScorePage(Score score) : base(score) { }
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
const float user_header_height = 150;
Children = new Drawable[]
{
new Container
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Top = user_header_height },
Children = new Drawable[]
{
new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.White,
},
}
},
new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Direction = FillDirection.Vertical,
Children = new Drawable[]
{
new UserHeader(Score.User)
{
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
RelativeSizeAxes = Axes.X,
Height = user_header_height,
},
new DrawableRank(Score.Rank)
{
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Size = new Vector2(150, 80),
},
scoreCounter = new SlowScoreCounter(6)
{
Anchor = Anchor.TopCentre,
Origin = Anchor.TopCentre,
Colour = colours.PinkDarker,
TextSize = 60,
},
}
}
};
}
protected override void LoadComplete()
{
base.LoadComplete();
Schedule(() => scoreCounter.Increment(Score.TotalScore));
}
private class UserHeader : Container
{
private readonly User user;
private readonly Sprite cover;
public UserHeader(User user)
{
this.user = user;
Children = new Drawable[]
{
cover = new Sprite
{
FillMode = FillMode.Fill,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
},
new OsuSpriteText
{
Font = @"Exo2.0-RegularItalic",
Text = user.Username,
Anchor = Anchor.BottomCentre,
Origin = Anchor.BottomCentre,
TextSize = 30,
Padding = new MarginPadding { Bottom = 10 },
}
};
}
[BackgroundDependencyLoader]
private void load(TextureStore textures)
{
cover.Texture = textures.Get(user.CoverUrl);
}
}
private class SlowScoreCounter : ScoreCounter
{
protected override double RollingDuration => 3000;
protected override EasingTypes RollingEasing => EasingTypes.OutPow10;
public SlowScoreCounter(uint leading = 0) : base(leading)
{
DisplayedCountSpriteText.Shadow = false;
}
}
}
}

7
osu.Game/osu.Game.csproj
View File

@ -202,6 +202,9 @@
<Compile Include="Screens\Edit\Editor.cs" />
<Compile Include="Screens\Play\HotkeyRetryOverlay.cs" />
<Compile Include="Screens\Play\SquareGraph.cs" />
<Compile Include="Screens\Ranking\ResultsPage.cs" />
<Compile Include="Screens\Ranking\ResultsRankingPage.cs" />
<Compile Include="Screens\Ranking\ResultsScorePage.cs" />
<Compile Include="Screens\ScreenWhiteBox.cs" />
<Compile Include="Screens\Loader.cs" />
<Compile Include="Screens\Menu\Button.cs" />
@ -225,6 +228,10 @@
<Compile Include="Screens\Play\ReplayPlayer.cs" />
<Compile Include="Screens\Play\SkipButton.cs" />
<Compile Include="Rulesets\UI\StandardComboCounter.cs" />
<Compile Include="Screens\Ranking\AspectContainer.cs" />
<Compile Include="Screens\Ranking\ResultMode.cs" />
<Compile Include="Screens\Ranking\ResultModeButton.cs" />
<Compile Include="Screens\Ranking\ResultModeTabControl.cs" />
<Compile Include="Screens\Select\BeatmapCarousel.cs" />
<Compile Include="Screens\Select\BeatmapDetails.cs" />
<Compile Include="Graphics\UserInterface\BarGraph.cs" />