Draw touch note triangles with SDF shader

osu.Game.Rulesets.Sentakki.Tests/Graphics/TestSceneTouchTriangle.cs

@@ -0,0 +1,42 @@
+using System.Linq;
+using NUnit.Framework;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Shapes;
+using osu.Game.Beatmaps;
+using osu.Game.Beatmaps.ControlPoints;
+using osu.Game.Rulesets.Sentakki.Objects;
+using osu.Game.Rulesets.Sentakki.Objects.Drawables;
+using osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.Slides;
+using osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.Touches;
+using osu.Game.Tests.Visual;
+using osuTK;
+using osuTK.Graphics;
+
+namespace osu.Game.Rulesets.Sentakki.Tests.Graphics
+{
+    [TestFixture]
+    public partial class TestSceneTouchTriangle : OsuGridTestScene
+    {
+        protected override Ruleset CreateRuleset() => new SentakkiRuleset();
+        public TestSceneTouchTriangle() : base(1, 2)
+        {
+            Cell(0).Add(new Box
+            {
+                RelativeSizeAxes = Axes.Both,
+                Colour = Color4.White
+            });
+            Cell(1).Add(new Box
+            {
+                RelativeSizeAxes = Axes.Both,
+                Colour = Color4.White
+            });
+            Cell(0).Add(new TouchPiece());
+            Cell(1).Add(new TouchPiece()
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+            });
+        }
+    }
+}

osu.Game.Rulesets.Sentakki/Objects/Drawables/DrawableTouch.cs

@@ -141,15 +141,5 @@ protected override void UpdateHitStateTransforms(ArmedState state)
         }
 
         public bool OnNewPointInteraction() => UpdateResult(true);
-
-        private struct TouchEasingFunction : IEasingFunction
-        {
-            public readonly double ApplyEasing(double t)
-            {
-                double result = (3.5 * Math.Pow(t, 4)) - (3.75 * Math.Pow(t, 3)) + (1.45 * Math.Pow(t, 2)) - (0.05 * t) + 0.005;
-
-                return Math.Min(1, result);
-            }
-        }
     }
 }

osu.Game.Rulesets.Sentakki/Objects/Drawables/DrawableTouchHold.cs

@@ -51,7 +51,6 @@ private void load()
             Colour = Color4.SlateGray;
             Anchor = Anchor.Centre;
             Origin = Anchor.Centre;
-            Scale = new Vector2(0f);
             Alpha = 0;
             AddRangeInternal(new Drawable[]
             {
@@ -100,11 +99,19 @@ protected override void OnFree()
         protected override void UpdateInitialTransforms()
         {
             base.UpdateInitialTransforms();
-            double fadeIn = AnimationDuration.Value;
-            this.FadeInFromZero(fadeIn).ScaleTo(1, fadeIn);
+            double animTime = AnimationDuration.Value * 0.8;
+            double fadeTime = AnimationDuration.Value * 0.2;
 
-            using (BeginDelayedSequence(fadeIn))
+            this.FadeInFromZero(fadeTime).ScaleTo(1);
+
+            using (BeginAbsoluteSequence(HitObject.StartTime - animTime))
+            {
+                TouchHoldBody.ResizeTo(80, animTime, Easing.InCirc);
+            }
+            using (BeginDelayedSequence(fadeTime + animTime))
             {
+                TouchHoldBody.centrePiece.FadeOut();
+                TouchHoldBody.CompletedCentre.FadeIn();
                 TouchHoldBody.ProgressPiece.TransformBindableTo(TouchHoldBody.ProgressPiece.ProgressBindable, 1, ((IHasDuration)HitObject).Duration);
             }
         }

osu.Game.Rulesets.Sentakki/Objects/Drawables/Pieces/TouchHolds/TouchHoldBody.cs

@@ -1,29 +1,31 @@
-using osu.Framework.Allocation;
-using osu.Framework.Bindables;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
-using osu.Game.Rulesets.Objects.Drawables;
 using osuTK;
-using osuTK.Graphics;
 
 namespace osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.TouchHolds
 {
     public partial class TouchHoldBody : CircularContainer
     {
         public readonly TouchHoldProgressPiece ProgressPiece;
-        private readonly TouchHoldCentrePiece centrePiece;
+        public readonly TouchHoldCentrePiece centrePiece;
+
+        public readonly TouchHoldCompletedCentre CompletedCentre;
 
         public override bool ReceivePositionalInputAt(Vector2 screenSpacePos) => ProgressPiece.ReceivePositionalInputAt(screenSpacePos);
 
         public TouchHoldBody()
         {
-            Size = new Vector2(110);
+            Size = new Vector2(130);
             Anchor = Anchor.Centre;
             Origin = Anchor.Centre;
             InternalChildren = new Drawable[]
             {
                 ProgressPiece = new TouchHoldProgressPiece(),
                 centrePiece = new TouchHoldCentrePiece(),
+                // We swap the centre piece with this other drawable to make it look better with the progress bar
+                // Otherwise we'd need to add a thick border in between the centre and the progress
+                CompletedCentre = new TouchHoldCompletedCentre(),
+                new DotPiece(),
             };
         }
     }

osu.Game.Rulesets.Sentakki/Objects/Drawables/Pieces/TouchHolds/TouchHoldCentrePiece.cs

@@ -1,8 +1,10 @@
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Effects;
+using osu.Framework.Graphics.Shapes;
 using osu.Framework.Graphics.UserInterface;
 using osu.Game.Graphics;
+using osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.Touches;
 using osuTK;
 using osuTK.Graphics;
 
@@ -11,76 +13,64 @@ namespace osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.TouchHolds
     public partial class TouchHoldCentrePiece : CompositeDrawable
     {
         private readonly OsuColour colours = new OsuColour();
+        public Container PieceContainer;
 
         public TouchHoldCentrePiece()
         {
             Origin = Anchor.Centre;
             Anchor = Anchor.Centre;
-            Size = new Vector2(80);
-            Masking = true;
-            CornerRadius = 20f;
+            RelativeSizeAxes = Axes.Both;
             Rotation = 45;
-            EdgeEffect = new EdgeEffectParameters
-            {
-                Type = EdgeEffectType.Shadow,
-                Colour = Color4.Black,
-                Radius = 10f,
-            };
+            Scale = new Vector2(80 / 90f);
+
             InternalChildren = new Drawable[]
             {
-                new Container
+                PieceContainer = new Container
                 {
-                    Origin = Anchor.Centre,
                     Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
                     RelativeSizeAxes = Axes.Both,
-                    Size = new Vector2(2),
-                    Rotation = -45f,
                     Children = new Drawable[]
                     {
-                        new CircularProgress
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            InnerRadius = 1,
-                            Size = Vector2.One,
-                            RelativeSizeAxes = Axes.Both,
-                            Progress = 1,
-                            Colour = colours.Blue
-                        },
-                        new CircularProgress
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            InnerRadius = 1,
-                            Size = Vector2.One,
-                            RelativeSizeAxes = Axes.Both,
-                            Progress = 0.75 ,
-                            Colour = colours.Green
-                        },
-                        new CircularProgress
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            InnerRadius = 1,
-                            Size = Vector2.One,
-                            RelativeSizeAxes = Axes.Both,
-                            Progress = 0.5 ,
-                            Colour = colours.Yellow,
-                        },
-                        new CircularProgress
-                        {
-                            Anchor = Anchor.Centre,
-                            Origin = Anchor.Centre,
-                            InnerRadius = 1,
-                            Size = Vector2.One,
-                            RelativeSizeAxes = Axes.Both,
-                            Progress = 0.25 ,
-                            Colour = colours.Red,
-                        },
+                        createTouchShapeWith<TouchPieceShadow>(),
+                        createTouchShapeWith<TouchHoldPiece>(),
                     }
                 },
-                new DotPiece()
             };
         }
+
+        // Creates the touch shape using the provided drawable as each of the 4 quarters
+        private Drawable createTouchShapeWith<T>() where T : Drawable, new()
+            => new Container
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                RelativeSizeAxes = Axes.Both,
+                Children = new Drawable[]{
+                    new T
+                    {
+                        Anchor = Anchor.TopCentre,
+                        Colour = colours.Red
+                    },
+                    new T
+                    {
+                        Anchor = Anchor.CentreRight,
+                        Rotation = 90,
+                        Colour = colours.Yellow,
+                    },
+                    new T
+                    {
+                        Anchor = Anchor.BottomCentre,
+                        Rotation = 180,
+                        Colour = colours.Green
+                    },
+                    new T
+                    {
+                        Anchor = Anchor.CentreLeft,
+                        Rotation = 270,
+                        Colour = colours.Blue,
+                    },
+                }
+            };
     }
 }

osu.Game.Rulesets.Sentakki/Objects/Drawables/Pieces/TouchHolds/TouchHoldCompletedCentrePiece.cs

@@ -0,0 +1,86 @@
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Effects;
+using osu.Framework.Graphics.UserInterface;
+using osu.Game.Graphics;
+using osuTK;
+using osuTK.Graphics;
+
+namespace osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.TouchHolds
+{
+    public partial class TouchHoldCompletedCentre : CompositeDrawable
+    {
+        private readonly OsuColour colours = new OsuColour();
+
+        public TouchHoldCompletedCentre()
+        {
+            Origin = Anchor.Centre;
+            Anchor = Anchor.Centre;
+            Size = new Vector2(80);
+            Masking = true;
+            CornerRadius = 20;
+            Rotation = 45;
+            Alpha = 0;
+            EdgeEffect = new EdgeEffectParameters
+            {
+                Type = EdgeEffectType.Shadow,
+                Colour = Color4.Black,
+                Radius = 10f,
+            };
+            InternalChildren = new Drawable[]
+            {
+                new Container
+                {
+                    Origin = Anchor.Centre,
+                    Anchor = Anchor.Centre,
+                    RelativeSizeAxes = Axes.Both,
+                    Size = new Vector2(2),
+                    Rotation = -45f,
+                    Children = new Drawable[]
+                    {
+                        new CircularProgress
+                        {
+                            Anchor = Anchor.Centre,
+                            Origin = Anchor.Centre,
+                            InnerRadius = 1,
+                            Size = Vector2.One,
+                            RelativeSizeAxes = Axes.Both,
+                            Progress = 1,
+                            Colour = colours.Blue
+                        },
+                        new CircularProgress
+                        {
+                            Anchor = Anchor.Centre,
+                            Origin = Anchor.Centre,
+                            InnerRadius = 1,
+                            Size = Vector2.One,
+                            RelativeSizeAxes = Axes.Both,
+                            Progress = 0.75 ,
+                            Colour = colours.Green
+                        },
+                        new CircularProgress
+                        {
+                            Anchor = Anchor.Centre,
+                            Origin = Anchor.Centre,
+                            InnerRadius = 1,
+                            Size = Vector2.One,
+                            RelativeSizeAxes = Axes.Both,
+                            Progress = 0.5 ,
+                            Colour = colours.Yellow,
+                        },
+                        new CircularProgress
+                        {
+                            Anchor = Anchor.Centre,
+                            Origin = Anchor.Centre,
+                            InnerRadius = 1,
+                            Size = Vector2.One,
+                            RelativeSizeAxes = Axes.Both,
+                            Progress = 0.25 ,
+                            Colour = colours.Red,
+                        },
+                    }
+                },
+            };
+        }
+    }
+}

osu.Game.Rulesets.Sentakki/Objects/Drawables/Pieces/TouchHolds/TouchHoldTrianglePiece.cs

@@ -0,0 +1,26 @@
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.Touches;
+using osuTK;
+
+namespace osu.Game.Rulesets.Sentakki.Objects.Drawables.Pieces.TouchHolds
+{
+    public partial class TouchHoldPiece : CompositeDrawable
+    {
+        public TouchHoldPiece()
+        {
+            Anchor = Anchor.Centre;
+            Origin = Anchor.Centre;
+
+            AddInternal(new DrawableTouchTriangle
+            {
+                Anchor = Anchor.TopCentre,
+                Origin = Anchor.TopCentre,
+                Size = new Vector2(73, 45f),
+                Thickness = 8f,
+                ShadowRadius = 0f,
+                FillTriangle = true,
+            });
+        }
+    }
+}