Implement overlined components

osu.Game.Tests/Visual/Multiplayer/TestSceneOverlinedParticipants.cs

@@ -0,0 +1,28 @@
+// 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.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Game.Screens.Multi.Match.Components;
+using osuTK;
+
+namespace osu.Game.Tests.Visual.Multiplayer
+{
+    public class TestSceneOverlinedParticipants : MultiplayerTestScene
+    {
+        protected override bool UseOnlineAPI => true;
+
+        public TestSceneOverlinedParticipants()
+        {
+            Room.RoomID.Value = 7;
+
+            Add(new Container
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                Size = new Vector2(500),
+                Child = new OverlinedParticipants()
+            });
+        }
+    }
+}

osu.Game.Tests/Visual/Multiplayer/TestSceneOverlinedPlaylist.cs

@@ -0,0 +1,39 @@
+// 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.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Game.Online.Multiplayer;
+using osu.Game.Rulesets.Osu;
+using osu.Game.Screens.Multi.Match.Components;
+using osu.Game.Tests.Beatmaps;
+using osuTK;
+
+namespace osu.Game.Tests.Visual.Multiplayer
+{
+    public class TestSceneOverlinedPlaylist : MultiplayerTestScene
+    {
+        protected override bool UseOnlineAPI => true;
+
+        public TestSceneOverlinedPlaylist()
+        {
+            for (int i = 0; i < 10; i++)
+            {
+                Room.Playlist.Add(new PlaylistItem
+                {
+                    ID = i,
+                    Beatmap = { Value = new TestBeatmap(new OsuRuleset().RulesetInfo).BeatmapInfo },
+                    Ruleset = { Value = new OsuRuleset().RulesetInfo }
+                });
+            }
+
+            Add(new Container
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                Size = new Vector2(500),
+                Child = new OverlinedPlaylist(false)
+            });
+        }
+    }
+}

osu.Game/Screens/Multi/Match/Components/OverlinedDisplay.cs

@@ -0,0 +1,87 @@
+// 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.Graphics;
+using osu.Game.Graphics.Sprites;
+using osuTK;
+
+namespace osu.Game.Screens.Multi.Match.Components
+{
+    public abstract class OverlinedDisplay : MultiplayerComposite
+    {
+        protected readonly Container Content;
+
+        protected string Details
+        {
+            set => details.Text = value;
+        }
+
+        private readonly Circle line;
+        private readonly OsuSpriteText details;
+
+        protected OverlinedDisplay(string title)
+        {
+            RelativeSizeAxes = Axes.Both;
+
+            InternalChild = new GridContainer
+            {
+                RelativeSizeAxes = Axes.Both,
+                Content = new[]
+                {
+                    new Drawable[]
+                    {
+                        line = new Circle
+                        {
+                            RelativeSizeAxes = Axes.X,
+                            Height = 2,
+                            Margin = new MarginPadding { Bottom = 2 }
+                        },
+                    },
+                    new Drawable[]
+                    {
+                        new FillFlowContainer
+                        {
+                            AutoSizeAxes = Axes.Both,
+                            Direction = FillDirection.Horizontal,
+                            Margin = new MarginPadding { Top = 5 },
+                            Spacing = new Vector2(10, 0),
+                            Children = new Drawable[]
+                            {
+                                new OsuSpriteText
+                                {
+                                    Text = title,
+                                    Font = OsuFont.GetFont(size: 14)
+                                },
+                                details = new OsuSpriteText { Font = OsuFont.GetFont(size: 14) },
+                            }
+                        },
+                    },
+                    new Drawable[]
+                    {
+                        Content = new Container
+                        {
+                            Margin = new MarginPadding { Top = 5 },
+                            RelativeSizeAxes = Axes.Both
+                        }
+                    }
+                },
+                RowDimensions = new[]
+                {
+                    new Dimension(GridSizeMode.AutoSize),
+                    new Dimension(GridSizeMode.AutoSize),
+                }
+            };
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(OsuColour colours)
+        {
+            line.Colour = colours.Yellow;
+            details.Colour = colours.Yellow;
+        }
+    }
+}

osu.Game/Screens/Multi/Match/Components/OverlinedParticipants.cs

@@ -0,0 +1,29 @@
+// 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.Screens.Multi.Components;
+
+namespace osu.Game.Screens.Multi.Match.Components
+{
+    public class OverlinedParticipants : OverlinedDisplay
+    {
+        public OverlinedParticipants()
+            : base("Participants")
+        {
+            Content.Add(new ParticipantsList { RelativeSizeAxes = Axes.Both });
+        }
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            ParticipantCount.BindValueChanged(_ => setParticipantCount());
+            MaxParticipants.BindValueChanged(_ => setParticipantCount());
+
+            setParticipantCount();
+        }
+
+        private void setParticipantCount() => Details = MaxParticipants.Value != null ? $"{ParticipantCount.Value}/{MaxParticipants.Value}" : ParticipantCount.Value.ToString();
+    }
+}

osu.Game/Screens/Multi/Match/Components/OverlinedPlaylist.cs

@@ -0,0 +1,33 @@
+// 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.Game.Online.Multiplayer;
+
+namespace osu.Game.Screens.Multi.Match.Components
+{
+    public class OverlinedPlaylist : OverlinedDisplay
+    {
+        public readonly Bindable<PlaylistItem> SelectedItem = new Bindable<PlaylistItem>();
+
+        private readonly DrawableRoomPlaylist playlist;
+
+        public OverlinedPlaylist(bool allowSelection)
+            : base("Playlist")
+        {
+            Content.Add(playlist = new DrawableRoomPlaylist(false, allowSelection)
+            {
+                RelativeSizeAxes = Axes.Both,
+                SelectedItem = { BindTarget = SelectedItem }
+            });
+        }
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            playlist.Items.BindTo(Playlist);
+        }
+    }
+}