diff --git a/osu.Game/Screens/SelectV2/Panel.cs b/osu.Game/Screens/SelectV2/Panel.cs index 6a1b5cc3a6..2a0044908c 100644 --- a/osu.Game/Screens/SelectV2/Panel.cs +++ b/osu.Game/Screens/SelectV2/Panel.cs @@ -27,7 +27,7 @@ namespace osu.Game.Screens.SelectV2 { public abstract partial class Panel : PoolableDrawable, ICarouselPanel, IHasContextMenu { - private const float corner_radius = 10; + public const float CORNER_RADIUS = 10; private const float active_x_offset = 25f; @@ -35,9 +35,6 @@ namespace osu.Game.Screens.SelectV2 protected float PanelXOffset { get; init; } - private Box backgroundBorder = null!; - private Box backgroundGradient = null!; - private Container backgroundLayerHorizontalPadding = null!; private Container backgroundContainer = null!; private Container iconContainer = null!; @@ -50,6 +47,7 @@ namespace osu.Game.Screens.SelectV2 public Container TopLevelContent { get; private set; } = null!; + private Container contentPaddingContainer = null!; protected Container Content { get; private set; } = null!; public Drawable Background @@ -109,42 +107,14 @@ namespace osu.Game.Screens.SelectV2 InternalChild = TopLevelContent = new Container { Masking = true, - CornerRadius = corner_radius, + CornerRadius = CORNER_RADIUS, RelativeSizeAxes = Axes.Both, - X = corner_radius, - EdgeEffect = new EdgeEffectParameters - { - Type = EdgeEffectType.Shadow, - Hollow = true, - Radius = 2, - }, + X = CORNER_RADIUS, Children = new[] { - backgroundBorder = new Box + backgroundContainer = new Container { RelativeSizeAxes = Axes.Both, - Colour = Color4.Black, - }, - backgroundLayerHorizontalPadding = new Container - { - RelativeSizeAxes = Axes.Both, - Child = new Container - { - RelativeSizeAxes = Axes.Both, - Masking = true, - CornerRadius = corner_radius, - Children = new Drawable[] - { - backgroundGradient = new Box - { - RelativeSizeAxes = Axes.Both, - }, - backgroundContainer = new Container - { - RelativeSizeAxes = Axes.Both, - }, - } - }, }, iconContainer = new Container { @@ -152,10 +122,15 @@ namespace osu.Game.Screens.SelectV2 Origin = Anchor.CentreLeft, AutoSizeAxes = Axes.Both, }, - Content = new Container + contentPaddingContainer = new Container { RelativeSizeAxes = Axes.Both, - Padding = new MarginPadding { Right = PanelXOffset + corner_radius }, + Child = Content = new Container + { + RelativeSizeAxes = Axes.Both, + CornerRadius = CORNER_RADIUS, + Masking = true, + }, }, hoverLayer = new Box { @@ -190,8 +165,6 @@ namespace osu.Game.Screens.SelectV2 new HoverSounds(), } }; - - backgroundGradient.Colour = ColourInfo.GradientHorizontal(colourProvider.Background3, colourProvider.Background4); } public partial class PulsatingBox : BeatSyncedContainer @@ -306,8 +279,6 @@ namespace osu.Game.Screens.SelectV2 { var backgroundColour = accentColour ?? Color4.White; - backgroundBorder.Colour = backgroundColour; - selectionLayer.Colour = ColourInfo.GradientHorizontal(backgroundColour.Opacity(0), backgroundColour.Opacity(0.5f)); updateSelectedState(animated: false); @@ -318,7 +289,28 @@ namespace osu.Game.Screens.SelectV2 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); + + if (selectedOrExpanded) + { + TopLevelContent.EdgeEffect = new EdgeEffectParameters + { + Type = EdgeEffectType.Shadow, + Radius = 2f, + Hollow = true, + }; + } + else + { + TopLevelContent.EdgeEffect = new EdgeEffectParameters + { + Type = EdgeEffectType.Shadow, + Radius = 4f, + Hollow = true, + Offset = new Vector2(0f, 1f), + }; + } + + TopLevelContent.FadeEdgeEffectTo(selectedOrExpanded ? edgeEffectColour.Opacity(0.8f) : Color4.Black.Opacity(0.2f), animated ? DURATION : 0, Easing.OutQuint); if (selectedOrExpanded) selectionLayer.FadeIn(100, Easing.OutQuint); @@ -328,7 +320,7 @@ namespace osu.Game.Screens.SelectV2 private void updateXOffset(bool animated = true) { - float x = PanelXOffset + corner_radius; + float x = PanelXOffset + CORNER_RADIUS; if (!Expanded.Value && !Selected.Value) { @@ -359,8 +351,7 @@ namespace osu.Game.Screens.SelectV2 protected override void Update() { base.Update(); - Content.Padding = Content.Padding with { Left = iconContainer.DrawWidth }; - backgroundLayerHorizontalPadding.Padding = new MarginPadding { Left = iconContainer.DrawWidth }; + contentPaddingContainer.Padding = contentPaddingContainer.Padding with { Left = iconContainer.DrawWidth }; } public abstract MenuItem[]? ContextMenuItems { get; } diff --git a/osu.Game/Screens/SelectV2/PanelBeatmap.cs b/osu.Game/Screens/SelectV2/PanelBeatmap.cs index a06c77448f..a569476dec 100644 --- a/osu.Game/Screens/SelectV2/PanelBeatmap.cs +++ b/osu.Game/Screens/SelectV2/PanelBeatmap.cs @@ -45,7 +45,8 @@ namespace osu.Game.Screens.SelectV2 private IBindable? starDifficultyBindable; private CancellationTokenSource? starDifficultyCancellationSource; - private Box backgroundAccentGradient = null!; + private Box backgroundBorder = null!; + private Box backgroundDifficultyTint = null!; private TrianglesV2 triangles = null!; @@ -84,100 +85,105 @@ namespace osu.Game.Screens.SelectV2 Colour = colourProvider.Background5, }; - Background = new Container + Background = backgroundBorder = new Box { RelativeSizeAxes = Axes.Both, - Children = new Drawable[] - { - backgroundAccentGradient = new Box - { - RelativeSizeAxes = Axes.Both, - }, - triangles = new TrianglesV2 - { - ScaleAdjust = 1.2f, - Thickness = 0.01f, - Velocity = 0.3f, - RelativeSizeAxes = Axes.Both, - }, - } }; - Content.Child = new FillFlowContainer + Content.Children = new Drawable[] { - AutoSizeAxes = Axes.Both, - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Spacing = new Vector2(5), - Margin = new MarginPadding { Left = 6.5f }, - Direction = FillDirection.Horizontal, - Children = new Drawable[] + new Box { - localRank = new PanelLocalRankDisplay + RelativeSizeAxes = Axes.Both, + Colour = ColourInfo.GradientHorizontal(colourProvider.Background3, colourProvider.Background4), + }, + backgroundDifficultyTint = new Box + { + RelativeSizeAxes = Axes.Both, + }, + triangles = new TrianglesV2 + { + ScaleAdjust = 1.2f, + Thickness = 0.01f, + Velocity = 0.3f, + RelativeSizeAxes = Axes.Both, + }, + new FillFlowContainer + { + AutoSizeAxes = Axes.Both, + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Spacing = new Vector2(5), + Margin = new MarginPadding { Left = 6.5f }, + Direction = FillDirection.Horizontal, + Children = new Drawable[] { - Scale = new Vector2(0.8f), - Origin = Anchor.CentreLeft, - Anchor = Anchor.CentreLeft, - }, - mainFill = new FillFlowContainer - { - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Direction = FillDirection.Vertical, - AutoSizeAxes = Axes.Both, - Padding = new MarginPadding { Bottom = 3.5f }, - Children = new Drawable[] + localRank = new PanelLocalRankDisplay { - new FillFlowContainer + Scale = new Vector2(0.8f), + Origin = Anchor.CentreLeft, + Anchor = Anchor.CentreLeft, + }, + mainFill = new FillFlowContainer + { + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Direction = FillDirection.Vertical, + AutoSizeAxes = Axes.Both, + Padding = new MarginPadding { Bottom = 3.5f }, + Children = new Drawable[] { - Direction = FillDirection.Horizontal, - AutoSizeAxes = Axes.Both, - Padding = new MarginPadding { Bottom = 4 }, - Children = new Drawable[] + new FillFlowContainer { - keyCountText = new OsuSpriteText + Direction = FillDirection.Horizontal, + AutoSizeAxes = Axes.Both, + Padding = new MarginPadding { Bottom = 4 }, + Children = new Drawable[] { - Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft, - Alpha = 0, - }, - difficultyText = new OsuSpriteText - { - Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft, - Margin = new MarginPadding { Right = 3f }, - }, - authorText = new OsuSpriteText - { - Colour = colourProvider.Content2, - Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft - } - } - }, - new FillFlowContainer - { - Direction = FillDirection.Horizontal, - Spacing = new Vector2(3), - AutoSizeAxes = Axes.Both, - Children = new Drawable[] - { - starRatingDisplay = new StarRatingDisplay(default, StarRatingDisplaySize.Small, animated: true) - { - Origin = Anchor.CentreLeft, - Anchor = Anchor.CentreLeft, - Scale = new Vector2(0.875f), - }, - starCounter = new StarCounter - { - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Scale = new Vector2(0.4f) + keyCountText = new OsuSpriteText + { + Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + Alpha = 0, + }, + difficultyText = new OsuSpriteText + { + Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + Margin = new MarginPadding { Right = 3f }, + }, + authorText = new OsuSpriteText + { + Colour = colourProvider.Content2, + Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft + } } }, + new FillFlowContainer + { + Direction = FillDirection.Horizontal, + Spacing = new Vector2(3), + AutoSizeAxes = Axes.Both, + Children = new Drawable[] + { + starRatingDisplay = new StarRatingDisplay(default, StarRatingDisplaySize.Small, animated: true) + { + Origin = Anchor.CentreLeft, + Anchor = Anchor.CentreLeft, + Scale = new Vector2(0.875f), + }, + starCounter = new StarCounter + { + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Scale = new Vector2(0.4f) + } + }, + } } } } @@ -268,7 +274,8 @@ namespace osu.Game.Screens.SelectV2 AccentColour = diffColour; starCounter.Colour = diffColour; - backgroundAccentGradient.Colour = ColourInfo.GradientHorizontal(diffColour.Opacity(0.25f), diffColour.Opacity(0f)); + backgroundBorder.Colour = diffColour; + backgroundDifficultyTint.Colour = ColourInfo.GradientHorizontal(diffColour.Opacity(0.25f), diffColour.Opacity(0f)); difficultyIcon.Colour = starRatingDisplay.DisplayedStars.Value > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5; diff --git a/osu.Game/Screens/SelectV2/PanelBeatmapSet.cs b/osu.Game/Screens/SelectV2/PanelBeatmapSet.cs index 2864980fce..9743d2aed5 100644 --- a/osu.Game/Screens/SelectV2/PanelBeatmapSet.cs +++ b/osu.Game/Screens/SelectV2/PanelBeatmapSet.cs @@ -9,6 +9,7 @@ using osu.Framework.Allocation; using osu.Framework.Bindables; using osu.Framework.Graphics; using osu.Framework.Graphics.Containers; +using osu.Framework.Graphics.Shapes; using osu.Framework.Graphics.Sprites; using osu.Framework.Graphics.UserInterface; using osu.Framework.Localisation; @@ -25,6 +26,7 @@ using osu.Game.Online.API; using osu.Game.Overlays; using osu.Game.Rulesets; using osuTK; +using osuTK.Graphics; namespace osu.Game.Screens.SelectV2 { @@ -32,7 +34,8 @@ namespace osu.Game.Screens.SelectV2 { public const float HEIGHT = CarouselItem.DEFAULT_HEIGHT * 1.6f; - private PanelSetBackground background = null!; + private Box chevronBackground = null!; + private PanelSetBackground setBackground = null!; private OsuSpriteText titleText = null!; private OsuSpriteText artistText = null!; @@ -86,13 +89,16 @@ namespace osu.Game.Screens.SelectV2 }, }; - Background = background = new PanelSetBackground + Background = chevronBackground = new Box { RelativeSizeAxes = Axes.Both, + Colour = Color4.White, + Alpha = 0f, }; - Content.Children = new[] + Content.Children = new Drawable[] { + setBackground = new PanelSetBackground(), new FillFlowContainer { AutoSizeAxes = Axes.Both, @@ -155,11 +161,13 @@ namespace osu.Game.Screens.SelectV2 { if (Expanded.Value) { - chevronIcon.ResizeWidthTo(18, 600, Easing.OutElasticQuarter); + chevronBackground.FadeIn(DURATION / 2, Easing.OutQuint); + chevronIcon.ResizeWidthTo(18, DURATION * 1.5f, Easing.OutElasticQuarter); chevronIcon.FadeTo(1f, DURATION, Easing.OutQuint); } else { + chevronBackground.FadeOut(DURATION, Easing.OutQuint); chevronIcon.ResizeWidthTo(0f, DURATION, Easing.OutQuint); chevronIcon.FadeTo(0f, DURATION, Easing.OutQuint); } @@ -174,7 +182,7 @@ namespace osu.Game.Screens.SelectV2 var beatmapSet = (BeatmapSetInfo)Item.Model; // Choice of background image matches BSS implementation (always uses the lowest `beatmap_id` from the set). - background.Beatmap = beatmaps.GetWorkingBeatmap(beatmapSet.Beatmaps.MinBy(b => b.OnlineID)); + setBackground.Beatmap = beatmaps.GetWorkingBeatmap(beatmapSet.Beatmaps.MinBy(b => b.OnlineID)); titleText.Text = new RomanisableString(beatmapSet.Metadata.TitleUnicode, beatmapSet.Metadata.Title); artistText.Text = new RomanisableString(beatmapSet.Metadata.ArtistUnicode, beatmapSet.Metadata.Artist); @@ -187,7 +195,7 @@ namespace osu.Game.Screens.SelectV2 { base.FreeAfterUse(); - background.Beatmap = null; + setBackground.Beatmap = null; updateButton.BeatmapSet = null; difficultiesDisplay.BeatmapSet = null; } diff --git a/osu.Game/Screens/SelectV2/PanelBeatmapStandalone.cs b/osu.Game/Screens/SelectV2/PanelBeatmapStandalone.cs index a6a54eeade..bb446e30b5 100644 --- a/osu.Game/Screens/SelectV2/PanelBeatmapStandalone.cs +++ b/osu.Game/Screens/SelectV2/PanelBeatmapStandalone.cs @@ -9,6 +9,7 @@ using osu.Framework.Allocation; using osu.Framework.Bindables; using osu.Framework.Graphics; using osu.Framework.Graphics.Containers; +using osu.Framework.Graphics.Shapes; using osu.Framework.Graphics.UserInterface; using osu.Framework.Localisation; using osu.Game.Beatmaps; @@ -54,7 +55,7 @@ namespace osu.Game.Screens.SelectV2 private IBindable? starDifficultyBindable; private CancellationTokenSource? starDifficultyCancellationSource; - private PanelSetBackground background = null!; + private PanelSetBackground beatmapBackground = null!; private OsuSpriteText titleText = null!; private OsuSpriteText artistText = null!; @@ -70,6 +71,8 @@ namespace osu.Game.Screens.SelectV2 private OsuSpriteText authorText = null!; private FillFlowContainer mainFill = null!; + private Box backgroundBorder = null!; + public PanelBeatmapStandalone() { PanelXOffset = 20; @@ -87,110 +90,114 @@ namespace osu.Game.Screens.SelectV2 Colour = colourProvider.Background5, }; - Background = background = new PanelSetBackground + Background = backgroundBorder = new Box { RelativeSizeAxes = Axes.Both, }; - Content.Child = new FillFlowContainer + Content.Children = new Drawable[] { - AutoSizeAxes = Axes.Both, - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Spacing = new Vector2(5), - Margin = new MarginPadding { Left = 6.5f }, - Direction = FillDirection.Horizontal, - Children = new Drawable[] + beatmapBackground = new PanelSetBackground(), + new FillFlowContainer { - localRank = new PanelLocalRankDisplay + AutoSizeAxes = Axes.Both, + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Spacing = new Vector2(5), + Margin = new MarginPadding { Left = 6.5f }, + Direction = FillDirection.Horizontal, + Children = new Drawable[] { - Scale = new Vector2(0.8f), - Origin = Anchor.CentreLeft, - Anchor = Anchor.CentreLeft, - }, - mainFill = new FillFlowContainer - { - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Direction = FillDirection.Vertical, - Padding = new MarginPadding { Bottom = 4.8f }, - AutoSizeAxes = Axes.Both, - Children = new Drawable[] + localRank = new PanelLocalRankDisplay { - titleText = new OsuSpriteText + Scale = new Vector2(0.8f), + Origin = Anchor.CentreLeft, + Anchor = Anchor.CentreLeft, + }, + mainFill = new FillFlowContainer + { + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Direction = FillDirection.Vertical, + Padding = new MarginPadding { Bottom = 4.8f }, + AutoSizeAxes = Axes.Both, + Children = new Drawable[] { - Font = OsuFont.Style.Heading2.With(typeface: Typeface.TorusAlternate, weight: FontWeight.Bold), - }, - artistText = new OsuSpriteText - { - Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), - Padding = new MarginPadding { Top = -2 }, - }, - new FillFlowContainer - { - Direction = FillDirection.Horizontal, - AutoSizeAxes = Axes.Both, - Padding = new MarginPadding { Top = 2, Bottom = 2 }, - Children = new Drawable[] + titleText = new OsuSpriteText { - statusPill = new BeatmapSetOnlineStatusPill - { - Animated = false, - Origin = Anchor.BottomLeft, - Anchor = Anchor.BottomLeft, - TextSize = OsuFont.Style.Caption2.Size, - Margin = new MarginPadding { Right = 4f }, - }, - updateButton = new PanelUpdateBeatmapButton - { - Scale = new Vector2(0.8f), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft, - Margin = new MarginPadding { Right = 4f, Bottom = -1f }, - }, - keyCountText = new OsuSpriteText - { - Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft, - Alpha = 0, - }, - difficultyText = new OsuSpriteText - { - Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft, - Margin = new MarginPadding { Right = 3f }, - }, - authorText = new OsuSpriteText - { - Colour = colourProvider.Content2, - Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), - Anchor = Anchor.BottomLeft, - Origin = Anchor.BottomLeft - } - } - }, - new FillFlowContainer - { - Direction = FillDirection.Horizontal, - Spacing = new Vector2(3), - AutoSizeAxes = Axes.Both, - Children = new Drawable[] + Font = OsuFont.Style.Heading2.With(typeface: Typeface.TorusAlternate, weight: FontWeight.Bold), + }, + artistText = new OsuSpriteText { - starRatingDisplay = new StarRatingDisplay(default, StarRatingDisplaySize.Small, animated: true) + Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), + Padding = new MarginPadding { Top = -2 }, + }, + new FillFlowContainer + { + Direction = FillDirection.Horizontal, + AutoSizeAxes = Axes.Both, + Padding = new MarginPadding { Top = 2, Bottom = 2 }, + Children = new Drawable[] { - Origin = Anchor.CentreLeft, - Anchor = Anchor.CentreLeft, - Scale = new Vector2(0.875f), - }, - starCounter = new StarCounter - { - Anchor = Anchor.CentreLeft, - Origin = Anchor.CentreLeft, - Scale = new Vector2(0.4f) + statusPill = new BeatmapSetOnlineStatusPill + { + Animated = false, + Origin = Anchor.BottomLeft, + Anchor = Anchor.BottomLeft, + TextSize = OsuFont.Style.Caption2.Size, + Margin = new MarginPadding { Right = 4f }, + }, + updateButton = new PanelUpdateBeatmapButton + { + Scale = new Vector2(0.8f), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + Margin = new MarginPadding { Right = 4f, Bottom = -1f }, + }, + keyCountText = new OsuSpriteText + { + Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + Alpha = 0, + }, + difficultyText = new OsuSpriteText + { + Font = OsuFont.Style.Body.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft, + Margin = new MarginPadding { Right = 3f }, + }, + authorText = new OsuSpriteText + { + Colour = colourProvider.Content2, + Font = OsuFont.Style.Caption1.With(weight: FontWeight.SemiBold), + Anchor = Anchor.BottomLeft, + Origin = Anchor.BottomLeft + } } }, + new FillFlowContainer + { + Direction = FillDirection.Horizontal, + Spacing = new Vector2(3), + AutoSizeAxes = Axes.Both, + Children = new Drawable[] + { + starRatingDisplay = new StarRatingDisplay(default, StarRatingDisplaySize.Small, animated: true) + { + Origin = Anchor.CentreLeft, + Anchor = Anchor.CentreLeft, + Scale = new Vector2(0.875f), + }, + starCounter = new StarCounter + { + Anchor = Anchor.CentreLeft, + Origin = Anchor.CentreLeft, + Scale = new Vector2(0.4f) + } + }, + } } } } @@ -226,7 +233,7 @@ namespace osu.Game.Screens.SelectV2 var beatmap = (BeatmapInfo)Item.Model; var beatmapSet = beatmap.BeatmapSet!; - background.Beatmap = beatmaps.GetWorkingBeatmap(beatmap); + beatmapBackground.Beatmap = beatmaps.GetWorkingBeatmap(beatmap); titleText.Text = new RomanisableString(beatmapSet.Metadata.TitleUnicode, beatmapSet.Metadata.Title); artistText.Text = new RomanisableString(beatmapSet.Metadata.ArtistUnicode, beatmapSet.Metadata.Artist); @@ -248,7 +255,7 @@ namespace osu.Game.Screens.SelectV2 { base.FreeAfterUse(); - background.Beatmap = null; + beatmapBackground.Beatmap = null; updateButton.BeatmapSet = null; localRank.Beatmap = null; starDifficultyBindable = null; @@ -293,6 +300,7 @@ namespace osu.Game.Screens.SelectV2 AccentColour = diffColour; starCounter.Colour = diffColour; + backgroundBorder.Colour = diffColour; difficultyIcon.Colour = starRatingDisplay.DisplayedStars.Value > OsuColour.STAR_DIFFICULTY_DEFINED_COLOUR_CUTOFF ? colours.Orange1 : colourProvider.Background5; } diff --git a/osu.Game/Screens/SelectV2/PanelGroup.cs b/osu.Game/Screens/SelectV2/PanelGroup.cs index b7288f1da4..b8a43c6a64 100644 --- a/osu.Game/Screens/SelectV2/PanelGroup.cs +++ b/osu.Game/Screens/SelectV2/PanelGroup.cs @@ -45,6 +45,7 @@ namespace osu.Game.Screens.SelectV2 { AlwaysPresent = true, RelativeSizeAxes = Axes.Y, + Alpha = 0f, Child = new SpriteIcon { Anchor = Anchor.Centre, @@ -54,34 +55,34 @@ namespace osu.Game.Screens.SelectV2 Colour = colourProvider.Background3, }, }; - Background = new Container + + Background = new Box { RelativeSizeAxes = Axes.Both, - Children = new Drawable[] - { - new Box - { - RelativeSizeAxes = Axes.Both, - Colour = colourProvider.Background5, - }, - triangles = new TrianglesV2 - { - RelativeSizeAxes = Axes.Both, - Thickness = 0.02f, - SpawnRatio = 0.6f, - Colour = ColourInfo.GradientHorizontal(colourProvider.Background6, colourProvider.Background5) - }, - glow = new Box - { - RelativeSizeAxes = Axes.Both, - Width = 0.5f, - Colour = ColourInfo.GradientHorizontal(colourProvider.Highlight1, colourProvider.Highlight1.Opacity(0f)), - }, - }, + Colour = colourProvider.Highlight1, }; + AccentColour = colourProvider.Highlight1; Content.Children = new Drawable[] { + new Box + { + RelativeSizeAxes = Axes.Both, + Colour = colourProvider.Background5, + }, + triangles = new TrianglesV2 + { + RelativeSizeAxes = Axes.Both, + Thickness = 0.02f, + SpawnRatio = 0.6f, + Colour = ColourInfo.GradientHorizontal(colourProvider.Background6, colourProvider.Background5) + }, + glow = new Box + { + RelativeSizeAxes = Axes.Both, + Width = 0.5f, + Colour = ColourInfo.GradientHorizontal(colourProvider.Highlight1, colourProvider.Highlight1.Opacity(0f)), + }, titleText = new OsuSpriteText { Anchor = Anchor.CentreLeft, diff --git a/osu.Game/Screens/SelectV2/PanelGroupStarDifficulty.cs b/osu.Game/Screens/SelectV2/PanelGroupStarDifficulty.cs index 622fbaa37e..213fd1dbd8 100644 --- a/osu.Game/Screens/SelectV2/PanelGroupStarDifficulty.cs +++ b/osu.Game/Screens/SelectV2/PanelGroupStarDifficulty.cs @@ -33,6 +33,7 @@ namespace osu.Game.Screens.SelectV2 private OverlayColourProvider colourProvider { get; set; } = null!; private Drawable iconContainer = null!; + private Box backgroundBorder = null!; private Box contentBackground = null!; private OsuSpriteText starRatingText = null!; private CircularContainer countPill = null!; @@ -49,6 +50,7 @@ namespace osu.Game.Screens.SelectV2 { AlwaysPresent = true, RelativeSizeAxes = Axes.Y, + Alpha = 0f, Child = new SpriteIcon { Anchor = Anchor.Centre, @@ -57,31 +59,33 @@ namespace osu.Game.Screens.SelectV2 Size = new Vector2(12), }, }; - Background = new Container + + Background = backgroundBorder = new Box { RelativeSizeAxes = Axes.Both, - Children = new Drawable[] - { - contentBackground = new Box - { - RelativeSizeAxes = Axes.Both, - }, - triangles = new TrianglesV2 - { - RelativeSizeAxes = Axes.Both, - Thickness = 0.02f, - SpawnRatio = 0.6f, - }, - glow = new Box - { - RelativeSizeAxes = Axes.Both, - Width = 0.5f, - }, - }, + Colour = colourProvider.Highlight1, }; + AccentColour = colourProvider.Highlight1; Content.Children = new Drawable[] { + contentBackground = new Box + { + RelativeSizeAxes = Axes.Both, + }, + triangles = new TrianglesV2 + { + RelativeSizeAxes = Axes.Both, + Thickness = 0.02f, + SpawnRatio = 0.6f, + Colour = ColourInfo.GradientHorizontal(colourProvider.Background6, colourProvider.Background5) + }, + glow = new Box + { + RelativeSizeAxes = Axes.Both, + Width = 0.5f, + Colour = ColourInfo.GradientHorizontal(colourProvider.Highlight1, colourProvider.Highlight1.Opacity(0f)), + }, new FillFlowContainer { Anchor = Anchor.CentreLeft, @@ -147,6 +151,7 @@ namespace osu.Game.Screens.SelectV2 ratingColour = starNumber >= 9 ? OsuColour.Gray(0.2f) : colours.ForStarDifficulty(starNumber); AccentColour = ratingColour; + backgroundBorder.Colour = ratingColour; contentBackground.Colour = ratingColour.Darken(1f); glow.Colour = ColourInfo.GradientHorizontal(ratingColour, ratingColour.Opacity(0f)); diff --git a/osu.Game/Screens/SelectV2/PanelSetBackground.cs b/osu.Game/Screens/SelectV2/PanelSetBackground.cs index ea82755810..d6221fa395 100644 --- a/osu.Game/Screens/SelectV2/PanelSetBackground.cs +++ b/osu.Game/Screens/SelectV2/PanelSetBackground.cs @@ -13,6 +13,7 @@ using osu.Framework.Graphics.Primitives; using osu.Framework.Graphics.Shapes; using osu.Framework.Graphics.Sprites; using osu.Game.Beatmaps; +using osu.Game.Overlays; using osuTK; using osuTK.Graphics; @@ -54,6 +55,11 @@ namespace osu.Game.Screens.SelectV2 public PanelSetBackground() { RelativeSizeAxes = Axes.Both; + CornerRadius = Panel.CORNER_RADIUS; + Masking = true; + + // Add some level of smoothness around the rounded edges to give more visual polish (make it anti-aliased). + MaskingSmoothness = 2f; } protected override void Update() @@ -64,10 +70,16 @@ namespace osu.Game.Screens.SelectV2 } [BackgroundDependencyLoader] - private void load() + private void load(OverlayColourProvider colourProvider) { InternalChildren = new Drawable[] { + new Box + { + Depth = 1, + RelativeSizeAxes = Axes.Both, + Colour = ColourInfo.GradientHorizontal(colourProvider.Background3, colourProvider.Background4), + }, new FillFlowContainer { Depth = -1, @@ -133,7 +145,6 @@ namespace osu.Game.Screens.SelectV2 LoadComponentAsync(new PanelBeatmapBackground(working) { - Depth = float.MaxValue, RelativeSizeAxes = Axes.Both, Anchor = Anchor.Centre, Origin = Anchor.Centre,