Taiko drumroll drawing

osu.Desktop.VisualTests/Tests/TestCaseTaikoHitObjects.cs

@@ -87,39 +87,23 @@ public override void Reset()
                 }
             });
 
-            Add(new DrumRollCircle(new CirclePiece
-            {
-                KiaiMode = kiai
-            })
+            Add(new CirclePiece
             {
-                Width = 250,
-                Position = new Vector2(575, 100)
+                Position = new Vector2(575, 100),
+                Width = 0.25f,
+                AccentColour = Color4.Orange,
+                KiaiMode = kiai,
             });
 
-            Add(new DrumRollCircle(new StrongCirclePiece
+            Add(new StrongCirclePiece
             {
+                Position = new Vector2(575, 300),
+                Width = 0.25f,
+                AccentColour = Color4.Orange,
                 KiaiMode = kiai
-            })
-            {
-                Width = 250,
-                Position = new Vector2(575, 300)
             });
         }
 
-        private class DrumRollCircle : BaseCircle
-        {
-            public DrumRollCircle(CirclePiece piece)
-                : base(piece)
-            {
-            }
-
-            [BackgroundDependencyLoader]
-            private void load(OsuColour colours)
-            {
-                Piece.AccentColour = colours.YellowDark;
-            }
-        }
-
         private abstract class BaseCircle : Container
         {
             protected readonly CirclePiece Piece;

osu.Desktop.VisualTests/Tests/TestCaseTaikoPlayfield.cs

@@ -26,6 +26,8 @@ public override void Reset()
 
             AddButton("Hit!", addHitJudgement);
             AddButton("Miss :(", addMissJudgement);
+            AddButton("DrumRoll", () => addDrumRoll(false));
+            AddButton("Strong DrumRoll", () => addDrumRoll(true));
             AddButton("Swell", addSwell);
             AddButton("Centre", () => addCentreHit(false));
             AddButton("Strong Centre", () => addCentreHit(true));
@@ -75,6 +77,18 @@ private void addMissJudgement()
             });
         }
 
+        private void addDrumRoll(bool strong)
+        {
+            var d = new DrumRoll
+            {
+                StartTime = Time.Current + 1000,
+                Distance = 20000,
+                PreEmpt = 1000,
+            };
+
+            playfield.Add(strong ? new DrawableStrongDrumRoll(d) : new DrawableDrumRoll(d));
+        }
+
         private void addSwell()
         {
             playfield.Add(new DrawableSwell(new Swell

osu.Game.Modes.Taiko/Objects/Drawable/DrawableDrumRoll.cs

@@ -1,38 +1,90 @@
 // Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
 // Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
 
+using OpenTK;
+using OpenTK.Graphics;
+using osu.Framework.Allocation;
+using osu.Framework.Graphics;
+using osu.Framework.MathUtils;
+using osu.Game.Graphics;
 using osu.Game.Modes.Objects.Drawables;
 using osu.Game.Modes.Taiko.Judgements;
+using osu.Game.Modes.Taiko.Objects.Drawable.Pieces;
 using System.Linq;
 
 namespace osu.Game.Modes.Taiko.Objects.Drawable
 {
     public class DrawableDrumRoll : DrawableTaikoHitObject
     {
+        /// <summary>
+        /// Number of consecutive hits required to reach the dark/final accent colour.
+        /// </summary>
+        private const int consecutive_hits_for_dark_accent = 5;
+
         private readonly DrumRoll drumRoll;
 
+        private readonly CirclePiece circle;
+
+        private Color4 accentDarkColour;
+
+        /// <summary>
+        /// Number of consecutive tick hits.
+        /// </summary>
+        private int consecutiveHits;
+
         public DrawableDrumRoll(DrumRoll drumRoll)
             : base(drumRoll)
         {
             this.drumRoll = drumRoll;
 
-            int tickIndex = 0;
+            RelativeSizeAxes = Axes.X;
+            Width = (float)(drumRoll.Duration / drumRoll.PreEmpt);
+
+            Add(circle = CreateCirclePiece());
+
             foreach (var tick in drumRoll.Ticks)
             {
                 var newTick = new DrawableDrumRollTick(tick)
                 {
-                    Depth = tickIndex,
                     X = (float)((tick.StartTime - HitObject.StartTime) / drumRoll.Duration)
                 };
 
-                AddNested(newTick);
+                newTick.OnJudgement += onTickJudgement;
 
-                tickIndex++;
+                AddNested(newTick);
+                Add(newTick);
             }
         }
 
-        protected override void UpdateState(ArmedState state)
+        [BackgroundDependencyLoader]
+        private void load(OsuColour colours)
+        {
+            circle.AccentColour = AccentColour = colours.YellowDark;
+            accentDarkColour = colours.YellowDarker;
+        }
+
+        protected override void LoadComplete()
         {
+            base.LoadComplete();
+
+            // This is naive, however it's based on the reasoning that the hit target
+            // is further than mid point of the play field, so the time taken to scroll in should always
+            // be greater than the time taken to scroll out to the left of the screen.
+            // Thus, using PreEmpt here is enough for the drum roll to completely scroll out.
+            LifetimeEnd = drumRoll.EndTime + drumRoll.PreEmpt;
+        }
+
+        private void onTickJudgement(DrawableHitObject<TaikoHitObject, TaikoJudgement> obj)
+        {
+            if (obj.Judgement.Result == HitResult.Hit)
+                consecutiveHits++;
+            else
+                consecutiveHits--;
+
+            consecutiveHits = MathHelper.Clamp(consecutiveHits, 0, consecutive_hits_for_dark_accent);
+
+            Color4 newAccent = Interpolation.ValueAt((float)consecutiveHits / consecutive_hits_for_dark_accent, AccentColour, accentDarkColour, 0, 1);
+            circle.FadeAccent(newAccent, 100);
         }
 
         protected override void CheckJudgement(bool userTriggered)
@@ -53,5 +105,11 @@ protected override void CheckJudgement(bool userTriggered)
             else
                 Judgement.Result = HitResult.Miss;
         }
+
+        protected override void UpdateState(ArmedState state)
+        {
+        }
+
+        protected virtual CirclePiece CreateCirclePiece() => new CirclePiece();
     }
 }

osu.Game.Modes.Taiko/Objects/Drawable/DrawableDrumRollTick.cs

@@ -5,20 +5,66 @@
 using osu.Game.Modes.Taiko.Judgements;
 using System;
 using osu.Game.Modes.Objects.Drawables;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using OpenTK;
+using OpenTK.Graphics;
+using osu.Framework.Graphics.Sprites;
 
 namespace osu.Game.Modes.Taiko.Objects.Drawable
 {
     public class DrawableDrumRollTick : DrawableTaikoHitObject
     {
+        /// <summary>
+        /// The size of a tick.
+        /// </summary>
+        private const float tick_size = TaikoHitObject.CIRCLE_RADIUS / 2;
+
+        /// <summary>
+        /// Any tick that is not the first for a drumroll is not filled, but is instead displayed
+        /// as a hollow circle. This is what controls the border width of that circle.
+        /// </summary>
+        private const float tick_border_width = tick_size / 4;
+
         private readonly DrumRollTick tick;
 
+        private readonly CircularContainer bodyContainer;
+
         public DrawableDrumRollTick(DrumRollTick tick)
             : base(tick)
         {
             this.tick = tick;
+
+            Anchor = Anchor.CentreLeft;
+            Origin = Anchor.Centre;
+
+            RelativePositionAxes = Axes.X;
+            Size = new Vector2(tick_size);
+
+            Children = new[]
+            {
+                bodyContainer = new CircularContainer
+                {
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre,
+                    RelativeSizeAxes = Axes.Both,
+                    Masking = true,
+                    BorderThickness = tick_border_width,
+                    BorderColour = Color4.White,
+                    Children = new[]
+                    {
+                        new Box
+                        {
+                            RelativeSizeAxes = Axes.Both,
+                            Alpha = tick.FirstTick ? 1 : 0,
+                            AlwaysPresent = true
+                        }
+                    }
+                }
+            };
         }
 
-        protected override TaikoJudgement CreateJudgement() => new TaikoDrumRollTickJudgement();
+        protected override TaikoJudgement CreateJudgement() => new TaikoDrumRollTickJudgement { SecondHit = tick.IsStrong };
 
         protected override void CheckJudgement(bool userTriggered)
         {
@@ -38,11 +84,17 @@ protected override void CheckJudgement(bool userTriggered)
 
         protected override void UpdateState(ArmedState state)
         {
+            switch (state)
+            {
+                case ArmedState.Hit:
+                    bodyContainer.ScaleTo(0, 100, EasingTypes.OutQuint);
+                    break;
+            }
         }
 
         protected override void UpdateScrollPosition(double time)
         {
-            // Drum roll ticks shouldn't move
+            // Ticks don't move
         }
 
         protected override bool HandleKeyPress(Key key)

osu.Game.Modes.Taiko/Objects/Drawable/DrawableStrongDrumRoll.cs

@@ -0,0 +1,20 @@
+// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
+// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
+
+using osu.Game.Modes.Taiko.Judgements;
+using osu.Game.Modes.Taiko.Objects.Drawable.Pieces;
+
+namespace osu.Game.Modes.Taiko.Objects.Drawable
+{
+    public class DrawableStrongDrumRoll : DrawableDrumRoll
+    {
+        public DrawableStrongDrumRoll(DrumRoll drumRoll)
+            : base(drumRoll)
+        {
+        }
+
+        protected override TaikoJudgement CreateJudgement() => new TaikoJudgement { SecondHit = true };
+
+        protected override CirclePiece CreateCirclePiece() => new StrongCirclePiece();
+    }
+}

osu.Game.Modes.Taiko/Objects/Drawable/DrawableTaikoHitObject.cs

@@ -22,7 +22,7 @@ protected DrawableTaikoHitObject(TaikoHitObject hitObject)
             : base(hitObject)
         {
             Anchor = Anchor.CentreLeft;
-            Origin = Anchor.Centre;
+            Origin = Anchor.CentreLeft;
 
             RelativePositionAxes = Axes.X;
         }

osu.Game.Modes.Taiko/Objects/Drawable/Pieces/CirclePiece.cs

@@ -8,6 +8,7 @@
 using osu.Game.Graphics.Backgrounds;
 using OpenTK.Graphics;
 using System;
+using osu.Game.Graphics;
 
 namespace osu.Game.Modes.Taiko.Objects.Drawable.Pieces
 {
@@ -18,7 +19,7 @@ namespace osu.Game.Modes.Taiko.Objects.Drawable.Pieces
     /// a rounded (_[-Width-]_) figure such that a regular "circle" is the result of a parent with Width = 0.
     /// </para>
     /// </summary>
-    public class CirclePiece : Container
+    public class CirclePiece : Container, IAccented
     {
         public const float SYMBOL_SIZE = TaikoHitObject.CIRCLE_RADIUS * 2f * 0.45f;
         public const float SYMBOL_BORDER = 8;
@@ -35,10 +36,7 @@ public Color4 AccentColour
             {
                 accentColour = value;
 
-                innerBackground.Colour = AccentColour;
-
-                triangles.ColourLight = AccentColour;
-                triangles.ColourDark = AccentColour.Darken(0.1f);
+                background.Colour = AccentColour;
 
                 resetEdgeEffects();
             }
@@ -68,10 +66,8 @@ public override Anchor Origin
         protected override Container<Framework.Graphics.Drawable> Content => SymbolContainer;
         protected readonly Container SymbolContainer;
 
+        private readonly Container background;
         private readonly Container innerLayer;
-        private readonly Container innerCircleContainer;
-        private readonly Box innerBackground;
-        private readonly Triangles triangles;
 
         public CirclePiece()
         {
@@ -87,26 +83,28 @@ public CirclePiece()
                 RelativeSizeAxes = Axes.Y,
                 Children = new Framework.Graphics.Drawable[]
                 {
-                    innerCircleContainer = new CircularContainer
+                    background = new CircularContainer
                     {
-                        Name = "Inner Circle",
+                        Name = "Background",
                         Anchor = Anchor.Centre,
                         Origin = Anchor.Centre,
                         RelativeSizeAxes = Axes.Both,
                         Masking = true,
                         Children = new Framework.Graphics.Drawable[]
                         {
-                            innerBackground = new Box
+                            new Box
                             {
                                 Anchor = Anchor.Centre,
                                 Origin = Anchor.Centre,
                                 RelativeSizeAxes = Axes.Both,
                             },
-                            triangles = new Triangles
+                            new Triangles
                             {
                                 Anchor = Anchor.Centre,
                                 Origin = Anchor.Centre,
                                 RelativeSizeAxes = Axes.Both,
+                                ColourLight = Color4.White,
+                                ColourDark = Color4.White.Darken(0.1f)
                             }
                         }
                     },
@@ -149,7 +147,7 @@ protected override void Update()
 
         private void resetEdgeEffects()
         {
-            innerCircleContainer.EdgeEffect = new EdgeEffect
+            background.EdgeEffect = new EdgeEffect
             {
                 Type = EdgeEffectType.Glow,
                 Colour = AccentColour,