From 851c46e6cac272b3d386830b7da4616afc57cc3c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marvin=20Sch=C3=BCrz?= Date: Sat, 19 Oct 2024 00:55:01 +0200 Subject: [PATCH 1/5] Add sliders with backdrop blur --- .../Objects/Drawables/DrawableSlider.cs | 20 ++++++++++++++++--- .../Skinning/Legacy/LegacyMainCirclePiece.cs | 1 + .../Skinning/Legacy/LegacySliderBody.cs | 2 +- osu.Game/OsuGame.cs | 6 +++++- 4 files changed, 24 insertions(+), 5 deletions(-) diff --git a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs index eacd2b3e7555..87888282b466 100644 --- a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs +++ b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs @@ -37,6 +37,8 @@ public partial class DrawableSlider : DrawableOsuHitObject [Cached] public DrawableSliderBall Ball { get; private set; } + public BackdropBlurContainer BlurContainer { get; private set; } + public SkinnableDrawable Body { get; private set; } private ShakeContainer shakeContainer; @@ -106,7 +108,14 @@ private void load() RelativeSizeAxes = Axes.Both, Children = new[] { - Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling), + BlurContainer = new BackdropBlurContainer + { + RelativeSizeAxes = Axes.Both, + BlurSigma = new Vector2(10f), + MaskCutoff = 0.25f, + EffectBufferScale = new Vector2(0.5f), + Child = Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling) + }, // proxied here so that the tail is drawn under repeats/ticks - legacy skins rely on this tailContainer.CreateProxy(), tickContainer = new Container { RelativeSizeAxes = Axes.Both }, @@ -282,6 +291,8 @@ protected override void UpdateAfterChildren() relativeAnchorPositionLayout.Validate(); } + + BlurContainer.MaskCutoff = Body.Alpha * 0.25f; } public override void OnKilled() @@ -337,7 +348,10 @@ protected override void UpdateInitialTransforms() { base.UpdateInitialTransforms(); - Body.FadeInFromZero(HitObject.TimeFadeIn); + // The backdrop blur opacity should fade in quicker, but the overall alpha should fade in linearly. + // By using OutQuad easing on both the blur container & the child, we end up getting a linear fade in. + BlurContainer.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); + Body.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); } protected override void UpdateStartTimeStateTransforms() @@ -358,7 +372,7 @@ protected override void UpdateHitStateTransforms(ArmedState state) { case ArmedState.Hit: if (HeadCircle.IsHit && SliderBody?.SnakingOut.Value == true) - Body.FadeOut(40); // short fade to allow for any body colour to smoothly disappear. + BlurContainer.FadeOut(40); // short fade to allow for any body colour to smoothly disappear. break; } diff --git a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacyMainCirclePiece.cs b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacyMainCirclePiece.cs index ef616ae96462..89aadf3f07a4 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacyMainCirclePiece.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacyMainCirclePiece.cs @@ -74,6 +74,7 @@ private void load() { Anchor = Anchor.Centre, Origin = Anchor.Centre, + Alpha = priorityLookupPrefix == null ? 0.75f : 0.5f // TODO: this is kind of a dirty way to check if we're a hitcircle or a circle that's part of a slider. }, OverlayLayer = new Container { diff --git a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs index b54bb44f9447..dd0404c6bdd8 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs @@ -18,7 +18,7 @@ public partial class LegacySliderBody : PlaySliderBody protected override Color4 GetBodyAccentColour(ISkinSource skin, Color4 hitObjectAccentColour) { // legacy skins use a constant value for slider track alpha, regardless of the source colour. - return base.GetBodyAccentColour(skin, hitObjectAccentColour).Opacity(0.7f); + return base.GetBodyAccentColour(skin, hitObjectAccentColour).Opacity(0.6f); } private partial class LegacyDrawableSliderPath : DrawableSliderPath diff --git a/osu.Game/OsuGame.cs b/osu.Game/OsuGame.cs index dce24c6ee7e2..4c730bc37981 100644 --- a/osu.Game/OsuGame.cs +++ b/osu.Game/OsuGame.cs @@ -994,7 +994,11 @@ protected override void LoadComplete() Children = new Drawable[] { backReceptor = new ScreenFooter.BackReceptor(), - ScreenStack = new OsuScreenStack { RelativeSizeAxes = Axes.Both }, + new RefCountedBackbufferProvider + { + RelativeSizeAxes = Axes.Both, + Child = ScreenStack = new OsuScreenStack { RelativeSizeAxes = Axes.Both } + }, BackButton = new BackButton(backReceptor) { Anchor = Anchor.BottomLeft, From c4af3182cf1bcda97f4f2bd99d3fdd1be3954650 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marvin=20Sch=C3=BCrz?= Date: Sat, 19 Oct 2024 01:07:41 +0200 Subject: [PATCH 2/5] Adjust amount of blur --- osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs index 87888282b466..80e95f920dd2 100644 --- a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs +++ b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs @@ -111,7 +111,7 @@ private void load() BlurContainer = new BackdropBlurContainer { RelativeSizeAxes = Axes.Both, - BlurSigma = new Vector2(10f), + BlurSigma = new Vector2(4f), MaskCutoff = 0.25f, EffectBufferScale = new Vector2(0.5f), Child = Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling) From f97cf4ec2918336a1aa0480f2d7d4b8f57373f31 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marvin=20Sch=C3=BCrz?= Date: Sat, 19 Oct 2024 01:51:45 +0200 Subject: [PATCH 3/5] Adjust backdrop blur values a bit more --- osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs index 80e95f920dd2..55adfd54845b 100644 --- a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs +++ b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs @@ -12,6 +12,7 @@ using osu.Framework.Graphics; using osu.Framework.Graphics.Containers; using osu.Framework.Layout; +using osu.Framework.Utils; using osu.Game.Audio; using osu.Game.Graphics.Containers; using osu.Game.Rulesets.Judgements; @@ -22,6 +23,7 @@ using osu.Game.Rulesets.Scoring; using osu.Game.Skinning; using osuTK; +using osuTK.Graphics; namespace osu.Game.Rulesets.Osu.Objects.Drawables { @@ -111,7 +113,7 @@ private void load() BlurContainer = new BackdropBlurContainer { RelativeSizeAxes = Axes.Both, - BlurSigma = new Vector2(4f), + BlurSigma = new Vector2(5f), MaskCutoff = 0.25f, EffectBufferScale = new Vector2(0.5f), Child = Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling) @@ -144,6 +146,7 @@ private void load() { foreach (var drawableHitObject in NestedHitObjects) drawableHitObject.AccentColour.Value = colour.NewValue; + BlurContainer.EffectColour = Interpolation.ValueAt(0.5, colour.NewValue, Color4.White, 0, 1); }, true); } From d080a8a6145937d45a9777c51add100bd606f165 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marvin=20Sch=C3=BCrz?= Date: Tue, 22 Oct 2024 01:28:23 +0200 Subject: [PATCH 4/5] Use `BackdropBlurPath` instead of `BackdropBlurContainer` for translucent sliders --- .../Objects/Drawables/DrawableSlider.cs | 20 +++---------------- .../Skinning/Default/DrawableSliderPath.cs | 2 +- .../Skinning/Legacy/LegacySliderBody.cs | 11 ++++++++++ 3 files changed, 15 insertions(+), 18 deletions(-) diff --git a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs index 55adfd54845b..d35f366f2408 100644 --- a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs +++ b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs @@ -12,7 +12,6 @@ using osu.Framework.Graphics; using osu.Framework.Graphics.Containers; using osu.Framework.Layout; -using osu.Framework.Utils; using osu.Game.Audio; using osu.Game.Graphics.Containers; using osu.Game.Rulesets.Judgements; @@ -23,7 +22,6 @@ using osu.Game.Rulesets.Scoring; using osu.Game.Skinning; using osuTK; -using osuTK.Graphics; namespace osu.Game.Rulesets.Osu.Objects.Drawables { @@ -39,8 +37,6 @@ public partial class DrawableSlider : DrawableOsuHitObject [Cached] public DrawableSliderBall Ball { get; private set; } - public BackdropBlurContainer BlurContainer { get; private set; } - public SkinnableDrawable Body { get; private set; } private ShakeContainer shakeContainer; @@ -110,14 +106,7 @@ private void load() RelativeSizeAxes = Axes.Both, Children = new[] { - BlurContainer = new BackdropBlurContainer - { - RelativeSizeAxes = Axes.Both, - BlurSigma = new Vector2(5f), - MaskCutoff = 0.25f, - EffectBufferScale = new Vector2(0.5f), - Child = Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling) - }, + Body = new SkinnableDrawable(new OsuSkinComponentLookup(OsuSkinComponents.SliderBody), _ => new DefaultSliderBody(), confineMode: ConfineMode.NoScaling), // proxied here so that the tail is drawn under repeats/ticks - legacy skins rely on this tailContainer.CreateProxy(), tickContainer = new Container { RelativeSizeAxes = Axes.Both }, @@ -146,7 +135,6 @@ private void load() { foreach (var drawableHitObject in NestedHitObjects) drawableHitObject.AccentColour.Value = colour.NewValue; - BlurContainer.EffectColour = Interpolation.ValueAt(0.5, colour.NewValue, Color4.White, 0, 1); }, true); } @@ -294,8 +282,6 @@ protected override void UpdateAfterChildren() relativeAnchorPositionLayout.Validate(); } - - BlurContainer.MaskCutoff = Body.Alpha * 0.25f; } public override void OnKilled() @@ -353,7 +339,7 @@ protected override void UpdateInitialTransforms() // The backdrop blur opacity should fade in quicker, but the overall alpha should fade in linearly. // By using OutQuad easing on both the blur container & the child, we end up getting a linear fade in. - BlurContainer.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); + Body.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); Body.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); } @@ -375,7 +361,7 @@ protected override void UpdateHitStateTransforms(ArmedState state) { case ArmedState.Hit: if (HeadCircle.IsHit && SliderBody?.SnakingOut.Value == true) - BlurContainer.FadeOut(40); // short fade to allow for any body colour to smoothly disappear. + Body.FadeOut(40); // short fade to allow for any body colour to smoothly disappear. break; } diff --git a/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs b/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs index 6f41d33c3d39..5bfbc8f247b9 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs @@ -6,7 +6,7 @@ namespace osu.Game.Rulesets.Osu.Skinning.Default { - public abstract partial class DrawableSliderPath : SmoothPath + public abstract partial class DrawableSliderPath : BackdropBlurPath { public const float BORDER_PORTION = 0.128f; public const float GRADIENT_PORTION = 1 - BORDER_PORTION; diff --git a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs index dd0404c6bdd8..78c26613c304 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs @@ -7,6 +7,7 @@ using osu.Game.Rulesets.Osu.Skinning.Default; using osu.Game.Skinning; using osu.Game.Utils; +using osuTK; using osuTK.Graphics; namespace osu.Game.Rulesets.Osu.Skinning.Legacy @@ -23,6 +24,16 @@ protected override Color4 GetBodyAccentColour(ISkinSource skin, Color4 hitObject private partial class LegacyDrawableSliderPath : DrawableSliderPath { + public LegacyDrawableSliderPath() + { + BlurSigma = new Vector2(8f); + + BackdropTintStrength = 0.5f; + + // To prevent shadows from contributing to the background blur effect + MaskCutoff = 0.25f; + } + protected override Color4 ColourAt(float position) { // https://github.com/peppy/osu-stable-reference/blob/3ea48705eb67172c430371dcfc8a16a002ed0d3d/osu!/Graphics/Renderers/MmSliderRendererGL.cs#L99 From 4984537cd399c7bf2299ef3fc1b8830a061d47f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marvin=20Sch=C3=BCrz?= Date: Tue, 22 Oct 2024 18:43:36 +0200 Subject: [PATCH 5/5] Update blur parameters --- osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs | 5 +---- .../Skinning/Default/DrawableSliderPath.cs | 6 ++++++ osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs | 2 +- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs index d35f366f2408..eacd2b3e7555 100644 --- a/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs +++ b/osu.Game.Rulesets.Osu/Objects/Drawables/DrawableSlider.cs @@ -337,10 +337,7 @@ protected override void UpdateInitialTransforms() { base.UpdateInitialTransforms(); - // The backdrop blur opacity should fade in quicker, but the overall alpha should fade in linearly. - // By using OutQuad easing on both the blur container & the child, we end up getting a linear fade in. - Body.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); - Body.FadeInFromZero(HitObject.TimeFadeIn, Easing.OutQuad); + Body.FadeInFromZero(HitObject.TimeFadeIn); } protected override void UpdateStartTimeStateTransforms() diff --git a/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs b/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs index 5bfbc8f247b9..b2794720c4ff 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Default/DrawableSliderPath.cs @@ -2,6 +2,7 @@ // See the LICENCE file in the repository root for full licence text. using osu.Framework.Graphics.Lines; +using osuTK; using osuTK.Graphics; namespace osu.Game.Rulesets.Osu.Skinning.Default @@ -14,6 +15,11 @@ public abstract partial class DrawableSliderPath : BackdropBlurPath private const float border_max_size = 8f; private const float border_min_size = 0f; + protected DrawableSliderPath() + { + EffectBufferScale = new Vector2(0.25f); + } + private Color4 borderColour = Color4.White; public Color4 BorderColour diff --git a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs index 78c26613c304..748bff419141 100644 --- a/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs +++ b/osu.Game.Rulesets.Osu/Skinning/Legacy/LegacySliderBody.cs @@ -26,7 +26,7 @@ private partial class LegacyDrawableSliderPath : DrawableSliderPath { public LegacyDrawableSliderPath() { - BlurSigma = new Vector2(8f); + BlurSigma = new Vector2(16f); BackdropTintStrength = 0.5f;