Merge pull request #12485 from peppy/timing-screen-more-updates

Timing screen more updates

osu.Game/Screens/Edit/EditorTable.cs

@@ -96,8 +96,8 @@ namespace osu.Game.Screens.Edit
             [BackgroundDependencyLoader]
             private void load(OverlayColourProvider colours)
             {
-                hoveredBackground.Colour = colourHover = colours.Background3;
+                hoveredBackground.Colour = colourHover = colours.Background1;
-                colourSelected = colours.Background1;
+                colourSelected = colours.Colour3;
             }
 
             private bool selected;

osu.Game/Screens/Edit/Timing/ControlPointTable.cs

@@ -1,6 +1,7 @@
 // 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.
 
+using System;
 using System.Collections.Generic;
 using System.Linq;
 using osu.Framework.Allocation;
@@ -25,6 +26,8 @@ namespace osu.Game.Screens.Edit.Timing
         [Resolved]
         private EditorClock clock { get; set; }
 
+        public const float TIMING_COLUMN_WIDTH = 220;
+
         public IEnumerable<ControlPointGroup> ControlGroups
         {
             set
@@ -66,35 +69,62 @@ namespace osu.Game.Screens.Edit.Timing
         {
             var columns = new List<TableColumn>
             {
-                new TableColumn("Time", Anchor.CentreLeft, new Dimension(GridSizeMode.Absolute, 120)),
+                new TableColumn("Time", Anchor.CentreLeft, new Dimension(GridSizeMode.Absolute, TIMING_COLUMN_WIDTH)),
                 new TableColumn("Attributes", Anchor.CentreLeft),
             };
 
             return columns.ToArray();
         }
 
-        private Drawable[] createContent(int index, ControlPointGroup group) => new Drawable[]
+        private Drawable[] createContent(int index, ControlPointGroup group)
         {
-            new OsuSpriteText
+            return new Drawable[]
             {
-                Text = group.Time.ToEditorFormattedString(),
+                new FillFlowContainer
-                Font = OsuFont.GetFont(size: TEXT_SIZE, weight: FontWeight.Bold)
+                {
-            },
+                    RelativeSizeAxes = Axes.Y,
-            new ControlGroupAttributes(group),
+                    Width = TIMING_COLUMN_WIDTH,
-        };
+                    Spacing = new Vector2(5),
+                    Children = new Drawable[]
+                    {
+                        new OsuSpriteText
+                        {
+                            Text = group.Time.ToEditorFormattedString(),
+                            Font = OsuFont.GetFont(size: TEXT_SIZE, weight: FontWeight.Bold),
+                            Width = 60,
+                            Anchor = Anchor.CentreLeft,
+                            Origin = Anchor.CentreLeft,
+                        },
+                        new ControlGroupAttributes(group, c => c is TimingControlPoint)
+                        {
+                            Anchor = Anchor.CentreLeft,
+                            Origin = Anchor.CentreLeft,
+                        }
+                    }
+                },
+                new ControlGroupAttributes(group, c => !(c is TimingControlPoint))
+            };
+        }
 
         private class ControlGroupAttributes : CompositeDrawable
         {
+            private readonly Func<ControlPoint, bool> matchFunction;
+
             private readonly IBindableList<ControlPoint> controlPoints = new BindableList<ControlPoint>();
 
             private readonly FillFlowContainer fill;
 
-            public ControlGroupAttributes(ControlPointGroup group)
+            public ControlGroupAttributes(ControlPointGroup group, Func<ControlPoint, bool> matchFunction)
             {
-                RelativeSizeAxes = Axes.Both;
+                this.matchFunction = matchFunction;
+
+                AutoSizeAxes = Axes.X;
+                RelativeSizeAxes = Axes.Y;
+
                 InternalChild = fill = new FillFlowContainer
                 {
-                    RelativeSizeAxes = Axes.Both,
+                    AutoSizeAxes = Axes.X,
+                    RelativeSizeAxes = Axes.Y,
                     Direction = FillDirection.Horizontal,
                     Spacing = new Vector2(2)
                 };
@@ -120,6 +150,7 @@ namespace osu.Game.Screens.Edit.Timing
             private void createChildren()
             {
                 fill.ChildrenEnumerable = controlPoints
+                                          .Where(matchFunction)
                                           .Select(createAttribute)
                                           .Where(c => c != null)
                                           // arbitrary ordering to make timing points first.

osu.Game/Screens/Edit/Timing/RowAttribute.cs

@@ -39,7 +39,7 @@ namespace osu.Game.Screens.Edit.Timing
             Origin = Anchor.CentreLeft;
 
             Masking = true;
-            CornerRadius = 5;
+            CornerRadius = 3;
 
             InternalChildren = new Drawable[]
             {
@@ -53,33 +53,25 @@ namespace osu.Game.Screens.Edit.Timing
                     RelativeSizeAxes = Axes.Y,
                     AutoSizeAxes = Axes.X,
                     Direction = FillDirection.Horizontal,
-                    Margin = new MarginPadding { Right = 5 },
+                    Margin = new MarginPadding { Horizontal = 5 },
                     Spacing = new Vector2(5),
                     Children = new Drawable[]
                     {
-                        new Container
+                        new Circle
                         {
-                            RelativeSizeAxes = Axes.Y,
-                            AutoSizeAxes = Axes.X,
                             Anchor = Anchor.CentreLeft,
                             Origin = Anchor.CentreLeft,
-                            Children = new Drawable[]
+                            Colour = Point.GetRepresentingColour(colours),
-                            {
+                            RelativeSizeAxes = Axes.Y,
-                                new Box
+                            Size = new Vector2(4, 0.6f),
-                                {
+                        },
-                                    Colour = Point.GetRepresentingColour(colours),
+                        new OsuSpriteText
-                                    RelativeSizeAxes = Axes.Both,
+                        {
-                                },
+                            Anchor = Anchor.CentreLeft,
-                                new OsuSpriteText
+                            Origin = Anchor.CentreLeft,
-                                {
+                            Padding = new MarginPadding(3),
-                                    Anchor = Anchor.CentreLeft,
+                            Font = OsuFont.Default.With(weight: FontWeight.Bold, size: 12),
-                                    Origin = Anchor.CentreLeft,
+                            Text = label,
-                                    Padding = new MarginPadding(3),
-                                    Font = OsuFont.Default.With(weight: FontWeight.SemiBold, size: 12),
-                                    Text = label,
-                                    Colour = overlayColours.Background5,
-                                },
-                            },
                         },
                     },
                 }

osu.Game/Screens/Edit/Timing/RowAttributes/AttributeBubbledWord.cs

@@ -1,71 +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.
-
-using osu.Framework.Allocation;
-using osu.Framework.Graphics;
-using osu.Framework.Graphics.Containers;
-using osu.Framework.Graphics.Shapes;
-using osu.Game.Beatmaps.ControlPoints;
-using osu.Game.Graphics;
-using osu.Game.Graphics.Sprites;
-using osu.Game.Overlays;
-
-namespace osu.Game.Screens.Edit.Timing.RowAttributes
-{
-    public class AttributeBubbledWord : CompositeDrawable
-    {
-        private readonly ControlPoint controlPoint;
-
-        private OsuSpriteText textDrawable;
-
-        private string text;
-
-        public string Text
-        {
-            get => text;
-            set
-            {
-                if (value == text)
-                    return;
-
-                text = value;
-                if (textDrawable != null)
-                    textDrawable.Text = text;
-            }
-        }
-
-        public AttributeBubbledWord(ControlPoint controlPoint)
-        {
-            this.controlPoint = controlPoint;
-        }
-
-        [BackgroundDependencyLoader]
-        private void load(OsuColour colours, OverlayColourProvider overlayColours)
-        {
-            AutoSizeAxes = Axes.X;
-
-            Anchor = Anchor.CentreLeft;
-            Origin = Anchor.CentreLeft;
-
-            Height = 12;
-
-            InternalChildren = new Drawable[]
-            {
-                new Circle
-                {
-                    Colour = controlPoint.GetRepresentingColour(colours),
-                    RelativeSizeAxes = Axes.Both,
-                },
-                textDrawable = new OsuSpriteText
-                {
-                    Anchor = Anchor.CentreLeft,
-                    Origin = Anchor.CentreLeft,
-                    Padding = new MarginPadding(6),
-                    Font = OsuFont.Default.With(weight: FontWeight.SemiBold, size: 12),
-                    Text = text,
-                    Colour = overlayColours.Background5,
-                },
-            };
-        }
-    }
-}

osu.Game/Screens/Edit/Timing/RowAttributes/AttributeText.cs

@@ -0,0 +1,32 @@
+// 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.
+
+using osu.Framework.Allocation;
+using osu.Framework.Graphics;
+using osu.Game.Beatmaps.ControlPoints;
+using osu.Game.Graphics;
+using osu.Game.Graphics.Sprites;
+
+namespace osu.Game.Screens.Edit.Timing.RowAttributes
+{
+    public class AttributeText : OsuSpriteText
+    {
+        private readonly ControlPoint controlPoint;
+
+        public AttributeText(ControlPoint controlPoint)
+        {
+            this.controlPoint = controlPoint;
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(OsuColour colours)
+        {
+            Anchor = Anchor.CentreLeft;
+            Origin = Anchor.CentreLeft;
+
+            Padding = new MarginPadding(6);
+            Font = OsuFont.Default.With(weight: FontWeight.Bold, size: 12);
+            Colour = controlPoint.GetRepresentingColour(colours);
+        }
+    }
+}

osu.Game/Screens/Edit/Timing/RowAttributes/DifficultyRowAttribute.cs

@@ -5,7 +5,6 @@ using osu.Framework.Allocation;
 using osu.Framework.Bindables;
 using osu.Framework.Graphics;
 using osu.Game.Beatmaps.ControlPoints;
-using osu.Game.Graphics;
 using osu.Game.Graphics.Sprites;
 
 namespace osu.Game.Screens.Edit.Timing.RowAttributes
@@ -27,17 +26,14 @@ namespace osu.Game.Screens.Edit.Timing.RowAttributes
         {
             Content.AddRange(new Drawable[]
             {
-                text = new OsuSpriteText
-                {
-                    Anchor = Anchor.CentreLeft,
-                    Origin = Anchor.CentreLeft,
-                    Width = 40,
-                    Font = OsuFont.GetFont(size: EditorTable.TEXT_SIZE, weight: FontWeight.Regular),
-                },
                 new AttributeProgressBar(Point)
                 {
                     Current = speedMultiplier,
-                }
+                },
+                text = new AttributeText(Point)
+                {
+                    Width = 40,
+                },
             });
 
             speedMultiplier.BindValueChanged(_ => updateText(), true);

osu.Game/Screens/Edit/Timing/RowAttributes/EffectRowAttribute.cs

@@ -12,8 +12,8 @@ namespace osu.Game.Screens.Edit.Timing.RowAttributes
     {
         private readonly Bindable<bool> kiaiMode;
         private readonly Bindable<bool> omitBarLine;
-        private AttributeBubbledWord kiaiModeBubble;
+        private AttributeText kiaiModeBubble;
-        private AttributeBubbledWord omitBarLineBubble;
+        private AttributeText omitBarLineBubble;
 
         public EffectRowAttribute(EffectControlPoint effect)
             : base(effect, "effect")
@@ -27,8 +27,8 @@ namespace osu.Game.Screens.Edit.Timing.RowAttributes
         {
             Content.AddRange(new Drawable[]
             {
-                kiaiModeBubble = new AttributeBubbledWord(Point) { Text = "kiai" },
+                kiaiModeBubble = new AttributeText(Point) { Text = "kiai" },
-                omitBarLineBubble = new AttributeBubbledWord(Point) { Text = "no barline" },
+                omitBarLineBubble = new AttributeText(Point) { Text = "no barline" },
             });
 
             kiaiMode.BindValueChanged(enabled => kiaiModeBubble.FadeTo(enabled.NewValue ? 1 : 0), true);

osu.Game/Screens/Edit/Timing/RowAttributes/SampleRowAttribute.cs

@@ -5,14 +5,13 @@ using osu.Framework.Allocation;
 using osu.Framework.Bindables;
 using osu.Framework.Graphics;
 using osu.Game.Beatmaps.ControlPoints;
-using osu.Game.Graphics;
 using osu.Game.Graphics.Sprites;
 
 namespace osu.Game.Screens.Edit.Timing.RowAttributes
 {
     public class SampleRowAttribute : RowAttribute
     {
-        private AttributeBubbledWord sampleText;
+        private AttributeText sampleText;
         private OsuSpriteText volumeText;
 
         private readonly Bindable<string> sampleBank;
@@ -32,15 +31,12 @@ namespace osu.Game.Screens.Edit.Timing.RowAttributes
 
             Content.AddRange(new Drawable[]
             {
-                volumeText = new OsuSpriteText
+                sampleText = new AttributeText(Point),
-                {
-                    Anchor = Anchor.CentreLeft,
-                    Origin = Anchor.CentreLeft,
-                    Width = 30,
-                    Font = OsuFont.GetFont(size: EditorTable.TEXT_SIZE, weight: FontWeight.Regular),
-                },
                 progress = new AttributeProgressBar(Point),
-                sampleText = new AttributeBubbledWord(Point),
+                volumeText = new AttributeText(Point)
+                {
+                    Width = 40,
+                },
             });
 
             volume.BindValueChanged(vol =>

osu.Game/Screens/Edit/Timing/RowAttributes/TimingRowAttribute.cs

@@ -4,10 +4,8 @@
 using osu.Framework.Allocation;
 using osu.Framework.Bindables;
 using osu.Framework.Extensions;
-using osu.Framework.Graphics;
 using osu.Game.Beatmaps.ControlPoints;
 using osu.Game.Beatmaps.Timing;
-using osu.Game.Graphics;
 using osu.Game.Graphics.Sprites;
 
 namespace osu.Game.Screens.Edit.Timing.RowAttributes
@@ -28,12 +26,7 @@ namespace osu.Game.Screens.Edit.Timing.RowAttributes
         [BackgroundDependencyLoader]
         private void load()
         {
-            Content.Add(text = new OsuSpriteText
+            Content.Add(text = new AttributeText(Point));
-            {
-                Anchor = Anchor.CentreLeft,
-                Origin = Anchor.CentreLeft,
-                Font = OsuFont.GetFont(size: EditorTable.TEXT_SIZE, weight: FontWeight.Regular),
-            });
 
             timeSignature.BindValueChanged(_ => updateText());
             beatLength.BindValueChanged(_ => updateText(), true);

osu.Game/Screens/Edit/Timing/TimingScreen.cs

@@ -71,13 +71,20 @@ namespace osu.Game.Screens.Edit.Timing
             {
                 RelativeSizeAxes = Axes.Both;
 
+                const float margins = 10;
                 InternalChildren = new Drawable[]
                 {
                     new Box
                     {
-                        Colour = colours.Background2,
+                        Colour = colours.Background3,
                         RelativeSizeAxes = Axes.Both,
                     },
+                    new Box
+                    {
+                        Colour = colours.Background2,
+                        RelativeSizeAxes = Axes.Y,
+                        Width = ControlPointTable.TIMING_COLUMN_WIDTH + margins,
+                    },
                     new OsuScrollContainer
                     {
                         RelativeSizeAxes = Axes.Both,
@@ -89,7 +96,7 @@ namespace osu.Game.Screens.Edit.Timing
                         Anchor = Anchor.BottomRight,
                         Origin = Anchor.BottomRight,
                         Direction = FillDirection.Horizontal,
-                        Margin = new MarginPadding(10),
+                        Margin = new MarginPadding(margins),
                         Spacing = new Vector2(5),
                         Children = new Drawable[]
                         {