Add basic structure of colour palette

osu.Game/Graphics/UserInterfaceV2/ColourDisplay.cs

@@ -0,0 +1,103 @@
+// 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.Bindables;
+using osu.Framework.Extensions.Color4Extensions;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Shapes;
+using osu.Framework.Graphics.UserInterface;
+using osu.Framework.Localisation;
+using osu.Game.Graphics.Sprites;
+using osuTK;
+using osuTK.Graphics;
+
+namespace osu.Game.Graphics.UserInterfaceV2
+{
+    public class ColourDisplay : CompositeDrawable, IHasCurrentValue<Color4>
+    {
+        private readonly BindableWithCurrent<Color4> current = new BindableWithCurrent<Color4>();
+
+        private Box fill;
+        private OsuSpriteText colourHexCode;
+        private OsuSpriteText colourName;
+
+        public Bindable<Color4> Current
+        {
+            get => current.Current;
+            set => current.Current = value;
+        }
+
+        private LocalisableString name;
+
+        public LocalisableString ColourName
+        {
+            get => name;
+            set
+            {
+                if (name == value)
+                    return;
+
+                name = value;
+
+                colourName.Text = name;
+            }
+        }
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            AutoSizeAxes = Axes.Y;
+            Width = 100;
+
+            InternalChild = new FillFlowContainer
+            {
+                RelativeSizeAxes = Axes.X,
+                AutoSizeAxes = Axes.Y,
+                Direction = FillDirection.Vertical,
+                Spacing = new Vector2(0, 10),
+                Children = new Drawable[]
+                {
+                    new CircularContainer
+                    {
+                        RelativeSizeAxes = Axes.X,
+                        Height = 100,
+                        Masking = true,
+                        Children = new Drawable[]
+                        {
+                            fill = new Box
+                            {
+                                RelativeSizeAxes = Axes.Both
+                            },
+                            colourHexCode = new OsuSpriteText
+                            {
+                                Anchor = Anchor.Centre,
+                                Origin = Anchor.Centre,
+                                Font = OsuFont.Default.With(size: 12)
+                            }
+                        }
+                    },
+                    colourName = new OsuSpriteText
+                    {
+                        Anchor = Anchor.TopCentre,
+                        Origin = Anchor.TopCentre
+                    }
+                }
+            };
+        }
+
+        protected override void LoadComplete()
+        {
+            base.LoadComplete();
+
+            current.BindValueChanged(_ => updateColour(), true);
+        }
+
+        private void updateColour()
+        {
+            fill.Colour = current.Value;
+            colourHexCode.Text = current.Value.ToHex();
+        }
+    }
+}

osu.Game/Graphics/UserInterfaceV2/ColourPalette.cs

@@ -0,0 +1,67 @@
+// 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.Bindables;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osuTK;
+using osuTK.Graphics;
+
+namespace osu.Game.Graphics.UserInterfaceV2
+{
+    public class ColourPalette : CompositeDrawable
+    {
+        public BindableList<Color4> Colours { get; } = new BindableList<Color4>();
+
+        private FillFlowContainer<ColourDisplay> palette;
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            RelativeSizeAxes = Axes.X;
+            AutoSizeAxes = Axes.Y;
+
+            InternalChild = palette = new FillFlowContainer<ColourDisplay>
+            {
+                RelativeSizeAxes = Axes.X,
+                AutoSizeAxes = Axes.Y,
+                Spacing = new Vector2(10),
+                Direction = FillDirection.Full
+            };
+        }
+
+        protected override void LoadComplete()
+        {
+            base.LoadComplete();
+
+            Colours.BindCollectionChanged((_, __) => updatePalette(), true);
+        }
+
+        private void updatePalette()
+        {
+            palette.Clear();
+
+            foreach (var item in Colours)
+            {
+                palette.Add(new ColourDisplay
+                {
+                    Current = { Value = item }
+                });
+            }
+
+            reindexItems();
+        }
+
+        private void reindexItems()
+        {
+            int index = 1;
+
+            foreach (var colour in palette)
+            {
+                colour.ColourName = $"Colour {index}";
+                index += 1;
+            }
+        }
+    }
+}

osu.Game/Graphics/UserInterfaceV2/LabelledColourPalette.cs

@@ -0,0 +1,20 @@
+// 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.Bindables;
+using osuTK.Graphics;
+
+namespace osu.Game.Graphics.UserInterfaceV2
+{
+    public class LabelledColourPalette : LabelledDrawable<ColourPalette>
+    {
+        public LabelledColourPalette()
+            : base(true)
+        {
+        }
+
+        public BindableList<Color4> Colours => Component.Colours;
+
+        protected override ColourPalette CreateComponent() => new ColourPalette();
+    }
+}