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

Merge pull request #20604 from peppy/mania-argon-second-pass

Second pass on osu!mania "argon" visuals
This commit is contained in:
Dan Balasescu 2022-10-07 21:42:24 +09:00 committed by GitHub
commit 01db2166d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 50 additions and 74 deletions

View File

@ -1,51 +0,0 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
#nullable disable
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Game.Rulesets.Mania.UI.Components;
using osu.Game.Skinning;
using osuTK;
namespace osu.Game.Rulesets.Mania.Tests.Skinning
{
public class TestSceneKeyArea : ManiaSkinnableTestScene
{
[BackgroundDependencyLoader]
private void load()
{
SetContents(_ => new FillFlowContainer
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Both,
Size = new Vector2(0.8f),
Direction = FillDirection.Horizontal,
Children = new Drawable[]
{
new ColumnTestContainer(0, ManiaAction.Key1)
{
RelativeSizeAxes = Axes.Both,
Width = 0.5f,
Child = new SkinnableDrawable(new ManiaSkinComponent(ManiaSkinComponents.KeyArea), _ => new DefaultKeyArea())
{
RelativeSizeAxes = Axes.Both
},
},
new ColumnTestContainer(1, ManiaAction.Key2)
{
RelativeSizeAxes = Axes.Both,
Width = 0.5f,
Child = new SkinnableDrawable(new ManiaSkinComponent(ManiaSkinComponents.KeyArea), _ => new DefaultKeyArea())
{
RelativeSizeAxes = Axes.Both
},
},
}
});
}
}
}

View File

@ -62,7 +62,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
accentColour = column.AccentColour.GetBoundCopy();
accentColour.BindValueChanged(colour =>
{
background.Colour = colour.NewValue.Darken(5);
background.Colour = colour.NewValue.Darken(3).Opacity(0.8f);
brightColour = colour.NewValue.Opacity(0.6f);
dimColour = colour.NewValue.Opacity(0);
}, true);

View File

@ -17,8 +17,6 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
public class ArgonHitExplosion : CompositeDrawable, IHitExplosion
{
private const float default_large_faint_size = 0.8f;
public override bool RemoveWhenNotAlive => true;
[Resolved]

View File

@ -8,6 +8,7 @@ using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
using osu.Game.Rulesets.Mania.Objects.Drawables;
using osu.Game.Rulesets.Mania.Skinning.Default;
using osu.Game.Rulesets.Objects.Drawables;
using osuTK.Graphics;
@ -16,7 +17,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
/// <summary>
/// Represents length-wise portion of a hold note.
/// </summary>
public class ArgonHoldBodyPiece : CompositeDrawable
public class ArgonHoldBodyPiece : CompositeDrawable, IHoldNoteBody
{
protected readonly Bindable<Color4> AccentColour = new Bindable<Color4>();
protected readonly IBindable<bool> IsHitting = new Bindable<bool>();
@ -26,12 +27,12 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
public ArgonHoldBodyPiece()
{
Blending = BlendingParameters.Additive;
RelativeSizeAxes = Axes.Both;
// Without this, the width of the body will be slightly larger than the head/tail.
Masking = true;
CornerRadius = ArgonNotePiece.CORNER_RADIUS;
Blending = BlendingParameters.Additive;
}
[BackgroundDependencyLoader(true)]
@ -52,14 +53,14 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
var holdNote = (DrawableHoldNote)drawableObject;
AccentColour.BindTo(drawableObject.AccentColour);
AccentColour.BindTo(holdNote.AccentColour);
IsHitting.BindTo(holdNote.IsHitting);
}
AccentColour.BindValueChanged(colour =>
{
background.Colour = colour.NewValue.Opacity(0.2f);
foreground.Colour = colour.NewValue.Opacity(0.1f);
background.Colour = colour.NewValue.Darken(1.2f);
foreground.Colour = colour.NewValue.Opacity(0.2f);
}, true);
IsHitting.BindValueChanged(hitting =>
@ -76,7 +77,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
using (foreground.BeginDelayedSequence(synchronisedOffset))
{
foreground.FadeTo(1, animation_length).Then()
.FadeTo(0, animation_length)
.FadeTo(0.5f, animation_length)
.Loop();
}
}
@ -86,5 +87,11 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
}
});
}
public void Recycle()
{
foreground.ClearTransforms();
foreground.Alpha = 0;
}
}
}

View File

@ -10,6 +10,7 @@ using osu.Framework.Graphics.Effects;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Bindings;
using osu.Framework.Input.Events;
using osu.Framework.Utils;
using osu.Game.Graphics;
using osu.Game.Rulesets.Mania.UI;
using osu.Game.Rulesets.UI.Scrolling;
@ -50,7 +51,10 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
InternalChild = directionContainer = new Container
{
RelativeSizeAxes = Axes.X,
Height = Stage.HIT_TARGET_POSITION,
// Ensure the area is tall enough to put the target line in the correct location.
// This is to also allow the main background component to overlap the target line
// and avoid an inner corner radius being shown below the target line.
Height = Stage.HIT_TARGET_POSITION + ArgonNotePiece.CORNER_RADIUS * 2,
Children = new[]
{
new Container
@ -62,7 +66,6 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
Name = "Key gradient",
Alpha = 0,
Blending = BlendingParameters.Additive,
RelativeSizeAxes = Axes.Both,
},
},
@ -70,10 +73,11 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
RelativeSizeAxes = Axes.X,
Anchor = Anchor.TopCentre,
Origin = Anchor.BottomCentre,
Origin = Anchor.TopCentre,
Colour = OsuColour.Gray(196 / 255f),
Height = ArgonNotePiece.CORNER_RADIUS * 2,
Masking = true,
EdgeEffect = new EdgeEffectParameters { Type = EdgeEffectType.Glow },
},
new Container
{
@ -97,6 +101,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
Size = new Vector2(icon_circle_size),
Anchor = Anchor.BottomCentre,
Origin = Anchor.Centre,
EdgeEffect = new EdgeEffectParameters { Type = EdgeEffectType.Glow },
},
new Circle
{
@ -105,6 +110,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
Size = new Vector2(icon_circle_size),
Anchor = Anchor.BottomCentre,
Origin = Anchor.Centre,
EdgeEffect = new EdgeEffectParameters { Type = EdgeEffectType.Glow },
},
new Circle
{
@ -113,6 +119,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
Size = new Vector2(icon_circle_size),
Anchor = Anchor.BottomCentre,
Origin = Anchor.Centre,
EdgeEffect = new EdgeEffectParameters { Type = EdgeEffectType.Glow },
},
}
},
@ -125,6 +132,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
Masking = true,
BorderThickness = 4,
BorderColour = Color4.White,
EdgeEffect = new EdgeEffectParameters { Type = EdgeEffectType.Glow },
Children = new Drawable[]
{
new Box
@ -146,10 +154,13 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
accentColour = column.AccentColour.GetBoundCopy();
accentColour.BindValueChanged(colour =>
{
background.Colour = colour.NewValue.Darken(1f);
background.Colour = colour.NewValue.Darken(0.2f);
bottomIcon.Colour = colour.NewValue;
},
true);
// Yes, proxy everything.
column.TopLevelContainer.Add(CreateProxy());
}
private void onDirectionChanged(ValueChangedEvent<ScrollingDirection> direction)
@ -174,18 +185,20 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
if (e.Action != column.Action.Value) return false;
const double lighting_fade_in_duration = 50;
Color4 lightingColour = accentColour.Value.Lighten(0.9f);
const double lighting_fade_in_duration = 70;
Color4 lightingColour = getLightingColour();
background
.FadeTo(1, 40).Then()
.FadeTo(0.8f, 150, Easing.OutQuint);
.FlashColour(accentColour.Value.Lighten(0.8f), 200, Easing.OutQuint)
.FadeTo(1, lighting_fade_in_duration, Easing.OutQuint)
.Then()
.FadeTo(0.8f, 500);
hitTargetLine.FadeColour(Color4.White, lighting_fade_in_duration, Easing.OutQuint);
hitTargetLine.TransformTo(nameof(EdgeEffect), new EdgeEffectParameters
{
Type = EdgeEffectType.Glow,
Colour = lightingColour.Opacity(0.7f),
Colour = lightingColour.Opacity(0.4f),
Radius = 20,
}, lighting_fade_in_duration, Easing.OutQuint);
@ -204,7 +217,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
circle.TransformTo(nameof(EdgeEffect), new EdgeEffectParameters
{
Type = EdgeEffectType.Glow,
Colour = lightingColour.Opacity(0.3f),
Colour = lightingColour.Opacity(0.2f),
Radius = 60,
}, lighting_fade_in_duration, Easing.OutQuint);
}
@ -216,10 +229,14 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
if (e.Action != column.Action.Value) return;
const double lighting_fade_out_duration = 300;
Color4 lightingColour = accentColour.Value.Lighten(0.9f).Opacity(0);
const double lighting_fade_out_duration = 800;
background.FadeTo(0, lighting_fade_out_duration, Easing.OutQuint);
Color4 lightingColour = getLightingColour().Opacity(0);
// background fades out faster than lighting elements to give better definition to the player.
background.FadeTo(0.3f, 50, Easing.OutQuint)
.Then()
.FadeOut(lighting_fade_out_duration, Easing.OutQuint);
topIcon.ScaleTo(1f, 200, Easing.OutQuint);
topIcon.TransformTo(nameof(EdgeEffect), new EdgeEffectParameters
@ -249,5 +266,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
}, lighting_fade_out_duration, Easing.OutQuint);
}
}
private Color4 getLightingColour() => Interpolation.ValueAt(0.2f, accentColour.Value, Color4.White, 0, 1);
}
}

View File

@ -20,7 +20,7 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
{
public const float NOTE_HEIGHT = 42;
public const float CORNER_RADIUS = 3;
public const float CORNER_RADIUS = 3.4f;
private readonly IBindable<ScrollingDirection> direction = new Bindable<ScrollingDirection>();
private readonly IBindable<Color4> accentColour = new Bindable<Color4>();

View File

@ -73,6 +73,9 @@ namespace osu.Game.Rulesets.Mania.Skinning.Argon
switch (maniaLookup.Lookup)
{
case LegacyManiaSkinConfigurationLookups.ColumnSpacing:
return SkinUtils.As<TValue>(new Bindable<float>(2));
case LegacyManiaSkinConfigurationLookups.StagePaddingBottom:
case LegacyManiaSkinConfigurationLookups.StagePaddingTop:
return SkinUtils.As<TValue>(new Bindable<float>(30));