mirror of
https://github.com/ppy/osu.git
synced 2026-05-26 20:50:41 +08:00
Merge pull request #33317 from peppy/song-select-v2-polish
SongSelectV2: Various polish
This commit is contained in:
@@ -81,7 +81,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
private const float username_min_width = 120;
|
||||
private const float statistics_regular_min_width = 165;
|
||||
private const float statistics_compact_min_width = 90;
|
||||
private const float rank_label_width = 60;
|
||||
private const float rank_label_width = 40;
|
||||
|
||||
private const int corner_radius = 10;
|
||||
private const int transition_duration = 200;
|
||||
@@ -144,6 +144,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
{
|
||||
background = new Box
|
||||
{
|
||||
Alpha = 0.4f,
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = backgroundColour
|
||||
},
|
||||
@@ -190,6 +191,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
{
|
||||
foreground = new Box
|
||||
{
|
||||
Alpha = 0.4f,
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = foregroundColour
|
||||
},
|
||||
@@ -312,8 +314,8 @@ namespace osu.Game.Screens.SelectV2
|
||||
Child = statisticsContainer = new FillFlowContainer
|
||||
{
|
||||
Name = @"Statistics container",
|
||||
Padding = new MarginPadding { Right = 40 },
|
||||
Spacing = new Vector2(25, 0),
|
||||
Padding = new MarginPadding { Right = 10 },
|
||||
Spacing = new Vector2(20, 0),
|
||||
Shear = sheared ? -OsuGame.SHEAR : Vector2.Zero,
|
||||
Anchor = Anchor.CentreRight,
|
||||
Origin = Anchor.CentreRight,
|
||||
@@ -567,13 +569,13 @@ namespace osu.Game.Screens.SelectV2
|
||||
|
||||
private DisplayMode getCurrentDisplayMode()
|
||||
{
|
||||
if (DrawWidth >= HEIGHT + username_min_width + statistics_regular_min_width + expanded_right_content_width + rank_label_width)
|
||||
if (DrawWidth >= username_min_width + statistics_regular_min_width + expanded_right_content_width + rank_label_width)
|
||||
return DisplayMode.Full;
|
||||
|
||||
if (DrawWidth >= HEIGHT + username_min_width + statistics_regular_min_width + expanded_right_content_width)
|
||||
if (DrawWidth >= username_min_width + statistics_regular_min_width + expanded_right_content_width)
|
||||
return DisplayMode.Regular;
|
||||
|
||||
if (DrawWidth >= HEIGHT + username_min_width + statistics_compact_min_width + expanded_right_content_width)
|
||||
if (DrawWidth >= username_min_width + statistics_compact_min_width + expanded_right_content_width)
|
||||
return DisplayMode.Compact;
|
||||
|
||||
return DisplayMode.Minimal;
|
||||
|
||||
@@ -10,7 +10,6 @@ using osu.Framework.Bindables;
|
||||
using osu.Framework.Extensions.PolygonExtensions;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Framework.Graphics.Sprites;
|
||||
using osu.Game.Beatmaps;
|
||||
using osu.Game.Graphics;
|
||||
@@ -70,7 +69,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
|
||||
private readonly IBindable<LeaderboardScores?> fetchedScores = new Bindable<LeaderboardScores?>();
|
||||
|
||||
private const float personal_best_height = 80;
|
||||
private const float personal_best_height = 100;
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load()
|
||||
@@ -109,7 +108,10 @@ namespace osu.Game.Screens.SelectV2
|
||||
RelativeSizeAxes = Axes.X,
|
||||
Height = personal_best_height,
|
||||
Shear = OsuGame.SHEAR,
|
||||
Margin = new MarginPadding { Left = -40f },
|
||||
Margin = new MarginPadding
|
||||
{
|
||||
Left = -40f,
|
||||
},
|
||||
CornerRadius = 10f,
|
||||
Masking = true,
|
||||
// push the personal best 1px down to hide masking issues
|
||||
@@ -118,11 +120,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
Alpha = 0f,
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = colourProvider.Background4,
|
||||
},
|
||||
new WedgeBackground(),
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
|
||||
@@ -61,11 +61,10 @@ namespace osu.Game.Screens.SelectV2
|
||||
|
||||
public Color4? AccentColour
|
||||
{
|
||||
get => accentColour;
|
||||
set
|
||||
{
|
||||
accentColour = value;
|
||||
updateDisplay();
|
||||
updateAccentColour();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -95,8 +94,8 @@ namespace osu.Game.Screens.SelectV2
|
||||
EdgeEffect = new EdgeEffectParameters
|
||||
{
|
||||
Type = EdgeEffectType.Shadow,
|
||||
Offset = new Vector2(1f),
|
||||
Radius = 10,
|
||||
Hollow = true,
|
||||
Radius = 2,
|
||||
},
|
||||
Children = new Drawable[]
|
||||
{
|
||||
@@ -108,7 +107,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
backgroundBorder = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = Color4.White,
|
||||
Colour = Color4.Black,
|
||||
},
|
||||
backgroundLayerHorizontalPadding = new Container
|
||||
{
|
||||
@@ -124,6 +123,8 @@ namespace osu.Game.Screens.SelectV2
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
},
|
||||
// TODO: this is only used by beatmap panels and should NOT be in this class.
|
||||
// it's wasting fill rate.
|
||||
backgroundAccentGradient = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
@@ -158,10 +159,9 @@ namespace osu.Game.Screens.SelectV2
|
||||
selectionLayer = new Box
|
||||
{
|
||||
Alpha = 0,
|
||||
Colour = ColourInfo.GradientHorizontal(colours.BlueDark.Opacity(0), colours.BlueDark.Opacity(0.6f)),
|
||||
Blending = BlendingParameters.Additive,
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Width = 0.3f,
|
||||
Width = 0.6f,
|
||||
Blending = BlendingParameters.Additive,
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
},
|
||||
@@ -190,15 +190,15 @@ namespace osu.Game.Screens.SelectV2
|
||||
{
|
||||
base.LoadComplete();
|
||||
|
||||
Expanded.BindValueChanged(_ => updateDisplay(), true);
|
||||
|
||||
Selected.BindValueChanged(selected =>
|
||||
Expanded.BindValueChanged(_ =>
|
||||
{
|
||||
if (selected.NewValue)
|
||||
selectionLayer.FadeIn(100, Easing.OutQuint);
|
||||
else
|
||||
selectionLayer.FadeOut(200, Easing.OutQuint);
|
||||
updateSelectedState();
|
||||
updateXOffset();
|
||||
});
|
||||
|
||||
Selected.BindValueChanged(_ =>
|
||||
{
|
||||
updateSelectedState();
|
||||
updateXOffset();
|
||||
}, true);
|
||||
|
||||
@@ -217,6 +217,9 @@ namespace osu.Game.Screens.SelectV2
|
||||
{
|
||||
base.PrepareForUse();
|
||||
|
||||
updateAccentColour();
|
||||
updateXOffset();
|
||||
|
||||
this.FadeIn(DURATION, Easing.OutQuint);
|
||||
}
|
||||
|
||||
@@ -236,18 +239,29 @@ namespace osu.Game.Screens.SelectV2
|
||||
return true;
|
||||
}
|
||||
|
||||
private void updateDisplay()
|
||||
private void updateAccentColour()
|
||||
{
|
||||
var backgroundColour = accentColour ?? Color4.White;
|
||||
|
||||
backgroundAccentGradient.Colour = ColourInfo.GradientHorizontal(backgroundColour.Opacity(0.25f), backgroundColour.Opacity(0f));
|
||||
backgroundBorder.Colour = backgroundColour;
|
||||
|
||||
selectionLayer.Colour = ColourInfo.GradientHorizontal(backgroundColour.Opacity(0), backgroundColour.Opacity(0.5f));
|
||||
|
||||
updateSelectedState(animated: false);
|
||||
}
|
||||
|
||||
private void updateSelectedState(bool animated = true)
|
||||
{
|
||||
bool selectedOrExpanded = Expanded.Value || Selected.Value;
|
||||
|
||||
var edgeEffectColour = accentColour ?? Color4Extensions.FromHex(@"4EBFFF");
|
||||
TopLevelContent.FadeEdgeEffectTo(selectedOrExpanded ? edgeEffectColour.Opacity(0.8f) : Color4.Black.Opacity(0.4f), animated ? DURATION : 0, Easing.OutQuint);
|
||||
|
||||
backgroundAccentGradient.FadeColour(ColourInfo.GradientHorizontal(backgroundColour.Opacity(0.25f), backgroundColour.Opacity(0f)), DURATION, Easing.OutQuint);
|
||||
backgroundBorder.FadeColour(backgroundColour, DURATION, Easing.OutQuint);
|
||||
|
||||
TopLevelContent.FadeEdgeEffectTo(Expanded.Value ? edgeEffectColour.Opacity(0.5f) : Color4.Black.Opacity(0.4f), DURATION, Easing.OutQuint);
|
||||
|
||||
updateXOffset();
|
||||
updateHover();
|
||||
if (selectedOrExpanded)
|
||||
selectionLayer.FadeIn(100, Easing.OutQuint);
|
||||
else
|
||||
selectionLayer.FadeOut(200, Easing.OutQuint);
|
||||
}
|
||||
|
||||
private void updateXOffset()
|
||||
@@ -263,23 +277,15 @@ namespace osu.Game.Screens.SelectV2
|
||||
TopLevelContent.MoveToX(x, DURATION, Easing.OutQuint);
|
||||
}
|
||||
|
||||
private void updateHover()
|
||||
{
|
||||
if (IsHovered)
|
||||
hoverLayer.FadeIn(100, Easing.OutQuint);
|
||||
else
|
||||
hoverLayer.FadeOut(1000, Easing.OutQuint);
|
||||
}
|
||||
|
||||
protected override bool OnHover(HoverEvent e)
|
||||
{
|
||||
updateHover();
|
||||
hoverLayer.FadeIn(100, Easing.OutQuint);
|
||||
return true;
|
||||
}
|
||||
|
||||
protected override void OnHoverLost(HoverLostEvent e)
|
||||
{
|
||||
updateHover();
|
||||
hoverLayer.FadeOut(1000, Easing.OutQuint);
|
||||
base.OnHoverLost(e);
|
||||
}
|
||||
|
||||
|
||||
@@ -210,7 +210,13 @@ namespace osu.Game.Screens.SelectV2
|
||||
var beatmap = (BeatmapInfo)Item.Model;
|
||||
|
||||
starDifficultyBindable = difficultyCache.GetBindableDifficulty(beatmap, starDifficultyCancellationSource.Token, SongSelect.SELECTION_DEBOUNCE);
|
||||
starDifficultyBindable.BindValueChanged(_ => updateDisplay(), true);
|
||||
starDifficultyBindable.BindValueChanged(_ =>
|
||||
{
|
||||
var starDifficulty = starDifficultyBindable?.Value ?? default;
|
||||
|
||||
starRatingDisplay.Current.Value = starDifficulty;
|
||||
starCounter.Current = (float)starDifficulty.Stars;
|
||||
}, true);
|
||||
}
|
||||
|
||||
protected override void Update()
|
||||
@@ -226,6 +232,13 @@ namespace osu.Game.Screens.SelectV2
|
||||
// Dirty hack to make sure we don't take up spacing in parent fill flow when not displaying a rank.
|
||||
// I can't find a better way to do this.
|
||||
starRatingDisplay.Margin = new MarginPadding { Left = 1 / starRatingDisplay.Scale.X * (localRank.HasRank ? 0 : -3) };
|
||||
|
||||
var diffColour = starRatingDisplay.DisplayedDifficultyColour;
|
||||
|
||||
AccentColour = diffColour;
|
||||
starCounter.Colour = diffColour;
|
||||
|
||||
difficultyIcon.Colour = starRatingDisplay.DisplayedStars.Value > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5;
|
||||
}
|
||||
|
||||
private void updateKeyCount()
|
||||
@@ -249,22 +262,6 @@ namespace osu.Game.Screens.SelectV2
|
||||
keyCountText.Alpha = 0;
|
||||
}
|
||||
|
||||
private void updateDisplay()
|
||||
{
|
||||
const float duration = 500;
|
||||
|
||||
var starDifficulty = starDifficultyBindable?.Value ?? default;
|
||||
|
||||
starRatingDisplay.Current.Value = starDifficulty;
|
||||
starCounter.Current = (float)starDifficulty.Stars;
|
||||
|
||||
difficultyIcon.FadeColour(starDifficulty.Stars > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5, duration, Easing.OutQuint);
|
||||
|
||||
var starRatingColour = colours.ForStarDifficulty(starDifficulty.Stars);
|
||||
starCounter.FadeColour(starRatingColour, duration, Easing.OutQuint);
|
||||
AccentColour = starRatingColour;
|
||||
}
|
||||
|
||||
public override MenuItem[] ContextMenuItems
|
||||
{
|
||||
get
|
||||
|
||||
@@ -257,7 +257,13 @@ namespace osu.Game.Screens.SelectV2
|
||||
var beatmap = (BeatmapInfo)Item.Model;
|
||||
|
||||
starDifficultyBindable = difficultyCache.GetBindableDifficulty(beatmap, starDifficultyCancellationSource.Token, SongSelect.SELECTION_DEBOUNCE);
|
||||
starDifficultyBindable.BindValueChanged(_ => updateDisplay(), true);
|
||||
starDifficultyBindable.BindValueChanged(_ =>
|
||||
{
|
||||
var starDifficulty = starDifficultyBindable?.Value ?? default;
|
||||
|
||||
starRatingDisplay.Current.Value = starDifficulty;
|
||||
starCounter.Current = (float)starDifficulty.Stars;
|
||||
}, true);
|
||||
}
|
||||
|
||||
protected override void Update()
|
||||
@@ -273,6 +279,13 @@ namespace osu.Game.Screens.SelectV2
|
||||
// Dirty hack to make sure we don't take up spacing in parent fill flow when not displaying a rank.
|
||||
// I can't find a better way to do this.
|
||||
starRatingDisplay.Margin = new MarginPadding { Left = 1 / starRatingDisplay.Scale.X * (localRank.HasRank ? 0 : -3) };
|
||||
|
||||
var diffColour = starRatingDisplay.DisplayedDifficultyColour;
|
||||
|
||||
AccentColour = diffColour;
|
||||
starCounter.Colour = diffColour;
|
||||
|
||||
difficultyIcon.Colour = starRatingDisplay.DisplayedStars.Value > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5;
|
||||
}
|
||||
|
||||
private void updateKeyCount()
|
||||
@@ -296,22 +309,6 @@ namespace osu.Game.Screens.SelectV2
|
||||
keyCountText.Alpha = 0;
|
||||
}
|
||||
|
||||
private void updateDisplay()
|
||||
{
|
||||
const float duration = 500;
|
||||
|
||||
var starDifficulty = starDifficultyBindable?.Value ?? default;
|
||||
|
||||
starRatingDisplay.Current.Value = starDifficulty;
|
||||
starCounter.Current = (float)starDifficulty.Stars;
|
||||
|
||||
difficultyIcon.FadeColour(starDifficulty.Stars > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5, duration, Easing.OutQuint);
|
||||
|
||||
var starRatingColour = colours.ForStarDifficulty(starDifficulty.Stars);
|
||||
starCounter.FadeColour(starRatingColour, duration, Easing.OutQuint);
|
||||
AccentColour = colours.ForStarDifficulty(starDifficulty.Stars);
|
||||
}
|
||||
|
||||
public override MenuItem[] ContextMenuItems
|
||||
{
|
||||
get
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
// See the LICENCE file in the repository root for full licence text.
|
||||
|
||||
using osu.Framework.Allocation;
|
||||
using osu.Framework.Extensions.Color4Extensions;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Colour;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
@@ -61,34 +62,27 @@ namespace osu.Game.Screens.SelectV2
|
||||
Direction = FillDirection.Horizontal,
|
||||
// This makes the gradient not be perfectly horizontal, but diagonal at a ~40° angle
|
||||
Shear = new Vector2(0.8f, 0),
|
||||
Alpha = 0.5f,
|
||||
Children = new[]
|
||||
{
|
||||
// The left half with no gradient applied
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = Color4.Black,
|
||||
Colour = Color4.Black.Opacity(0.5f),
|
||||
Width = 0.4f,
|
||||
},
|
||||
// Piecewise-linear gradient with 3 segments to make it appear smoother
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = ColourInfo.GradientHorizontal(Color4.Black, new Color4(0f, 0f, 0f, 0.9f)),
|
||||
Width = 0.05f,
|
||||
},
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = ColourInfo.GradientHorizontal(new Color4(0f, 0f, 0f, 0.9f), new Color4(0f, 0f, 0f, 0.1f)),
|
||||
Colour = ColourInfo.GradientHorizontal(Color4.Black.Opacity(0.5f), Color4.Black.Opacity(0.3f)),
|
||||
Width = 0.2f,
|
||||
},
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = ColourInfo.GradientHorizontal(new Color4(0f, 0f, 0f, 0.1f), new Color4(0, 0, 0, 0)),
|
||||
Width = 0.05f,
|
||||
Colour = ColourInfo.GradientHorizontal(Color4.Black.Opacity(0.3f), Color4.Black.Opacity(0.2f)),
|
||||
// Slightly more than 1.0 in total to account for shear.
|
||||
Width = 0.45f,
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
@@ -146,9 +146,9 @@ namespace osu.Game.Screens.SelectV2
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
ColumnDimensions = new[]
|
||||
{
|
||||
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 850),
|
||||
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 660),
|
||||
new Dimension(),
|
||||
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 750),
|
||||
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 580),
|
||||
},
|
||||
Content = new[]
|
||||
{
|
||||
@@ -162,6 +162,11 @@ namespace osu.Game.Screens.SelectV2
|
||||
// screen-wide scroll handling.
|
||||
Depth = float.MinValue,
|
||||
Shear = OsuGame.SHEAR,
|
||||
Padding = new MarginPadding
|
||||
{
|
||||
Top = -CORNER_RADIUS_HIDE_OFFSET,
|
||||
Left = -CORNER_RADIUS_HIDE_OFFSET,
|
||||
},
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new Container
|
||||
@@ -177,11 +182,6 @@ namespace osu.Game.Screens.SelectV2
|
||||
wedgesContainer = new FillFlowContainer
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Margin = new MarginPadding
|
||||
{
|
||||
Top = -CORNER_RADIUS_HIDE_OFFSET,
|
||||
Left = -CORNER_RADIUS_HIDE_OFFSET
|
||||
},
|
||||
Spacing = new Vector2(0f, 4f),
|
||||
Direction = FillDirection.Vertical,
|
||||
Children = new Drawable[]
|
||||
@@ -401,6 +401,7 @@ namespace osu.Game.Screens.SelectV2
|
||||
backgroundModeBeatmap.BlurAmount.Value = 0;
|
||||
backgroundModeBeatmap.Beatmap = beatmap;
|
||||
backgroundModeBeatmap.IgnoreUserSettings.Value = true;
|
||||
backgroundModeBeatmap.DimWhenUserSettingsIgnored.Value = 0.1f;
|
||||
backgroundModeBeatmap.FadeColour(Color4.White, 250);
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user