Merge pull request #24347 from peppy/tournament-ladder-editor-improvements

Apply various visual and usability improvements to tournament ladder editor
This commit is contained in:
Bartłomiej Dach 2023-07-24 21:02:58 +02:00 committed by GitHub
commit 2e2c0cef74
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 123 additions and 74 deletions

View File

@ -1,8 +1,11 @@
// 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.Linq;
using NUnit.Framework;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Testing;
using osu.Game.Tournament.Models;
using osu.Game.Tournament.Screens.Ladder.Components;
@ -10,60 +13,67 @@ namespace osu.Game.Tournament.Tests.Components
{
public partial class TestSceneDrawableTournamentMatch : TournamentTestScene
{
public TestSceneDrawableTournamentMatch()
[Test]
public void TestBasic()
{
Container<DrawableTournamentMatch> level1;
Container<DrawableTournamentMatch> level2;
Container<DrawableTournamentMatch> level1 = null!;
Container<DrawableTournamentMatch> level2 = null!;
var match1 = new TournamentMatch(
new TournamentTeam { FlagName = { Value = "AU" }, FullName = { Value = "Australia" }, },
new TournamentTeam { FlagName = { Value = "JP" }, FullName = { Value = "Japan" }, Acronym = { Value = "JPN" } })
TournamentMatch match1 = null!;
TournamentMatch match2 = null!;
AddStep("setup test", () =>
{
Team1Score = { Value = 4 },
Team2Score = { Value = 1 },
};
var match2 = new TournamentMatch(
new TournamentTeam
match1 = new TournamentMatch(
new TournamentTeam { FlagName = { Value = "AU" }, FullName = { Value = "Australia" }, },
new TournamentTeam { FlagName = { Value = "JP" }, FullName = { Value = "Japan" }, Acronym = { Value = "JPN" } })
{
FlagName = { Value = "RO" },
FullName = { Value = "Romania" },
}
);
Team1Score = { Value = 4 },
Team2Score = { Value = 1 },
};
Child = new FillFlowContainer
{
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Horizontal,
Children = new Drawable[]
match2 = new TournamentMatch(
new TournamentTeam
{
FlagName = { Value = "RO" },
FullName = { Value = "Romania" },
}
);
Child = new FillFlowContainer
{
level1 = new FillFlowContainer<DrawableTournamentMatch>
RelativeSizeAxes = Axes.Both,
Direction = FillDirection.Horizontal,
Children = new Drawable[]
{
AutoSizeAxes = Axes.X,
Direction = FillDirection.Vertical,
Children = new[]
level1 = new FillFlowContainer<DrawableTournamentMatch>
{
new DrawableTournamentMatch(match1),
new DrawableTournamentMatch(match2),
new DrawableTournamentMatch(new TournamentMatch()),
}
},
level2 = new FillFlowContainer<DrawableTournamentMatch>
{
AutoSizeAxes = Axes.X,
Direction = FillDirection.Vertical,
Margin = new MarginPadding(20),
Children = new[]
AutoSizeAxes = Axes.X,
Direction = FillDirection.Vertical,
Children = new[]
{
new DrawableTournamentMatch(match1),
new DrawableTournamentMatch(match2),
new DrawableTournamentMatch(new TournamentMatch()),
}
},
level2 = new FillFlowContainer<DrawableTournamentMatch>
{
new DrawableTournamentMatch(new TournamentMatch()),
new DrawableTournamentMatch(new TournamentMatch())
AutoSizeAxes = Axes.X,
Direction = FillDirection.Vertical,
Margin = new MarginPadding(20),
Children = new[]
{
new DrawableTournamentMatch(new TournamentMatch()),
new DrawableTournamentMatch(new TournamentMatch())
}
}
}
}
};
};
level1.Children[0].Match.Progression.Value = level2.Children[0].Match;
level1.Children[1].Match.Progression.Value = level2.Children[0].Match;
level1.Children[0].Match.Progression.Value = level2.Children[0].Match;
level1.Children[1].Match.Progression.Value = level2.Children[0].Match;
});
AddRepeatStep("change scores", () => match1.Team2Score.Value++, 4);
AddStep("add new team", () => match2.Team2.Value = new TournamentTeam { FlagName = { Value = "PT" }, FullName = { Value = "Portugal" } });
@ -78,6 +88,9 @@ namespace osu.Game.Tournament.Tests.Components
AddRepeatStep("change scores", () => level2.Children[0].Match.Team1Score.Value++, 5);
AddRepeatStep("change scores", () => level2.Children[0].Match.Team2Score.Value++, 4);
AddStep("select as current", () => match1.Current.Value = true);
AddStep("select as editing", () => this.ChildrenOfType<DrawableTournamentMatch>().Last().Selected = true);
}
}
}

View File

@ -14,6 +14,7 @@ using osu.Framework.Graphics.UserInterface;
using osu.Framework.Input.Events;
using osu.Framework.Input.States;
using osu.Game.Graphics.UserInterface;
using osu.Game.Screens.Edit.Compose.Components;
using osu.Game.Tournament.Components;
using osu.Game.Tournament.Models;
using osu.Game.Tournament.Screens.Ladder;
@ -26,6 +27,8 @@ namespace osu.Game.Tournament.Screens.Editors
[Cached]
public partial class LadderEditorScreen : LadderScreen, IHasContextMenu
{
public const float GRID_SPACING = 10;
[Cached]
private LadderEditorInfo editorInfo = new LadderEditorInfo();
@ -43,6 +46,13 @@ namespace osu.Game.Tournament.Screens.Editors
AddInternal(rightClickMessage = new WarningBox("Right click to place and link matches"));
ScrollContent.Add(new RectangularPositionSnapGrid(Vector2.Zero)
{
Spacing = new Vector2(GRID_SPACING),
RelativeSizeAxes = Axes.Both,
Depth = float.MaxValue
});
LadderInfo.Matches.CollectionChanged += (_, _) => updateMessage();
updateMessage();
}
@ -68,8 +78,12 @@ namespace osu.Game.Tournament.Screens.Editors
{
new OsuMenuItem("Create new match", MenuItemType.Highlighted, () =>
{
var pos = MatchesContainer.ToLocalSpace(GetContainingInputManager().CurrentState.Mouse.Position);
LadderInfo.Matches.Add(new TournamentMatch { Position = { Value = new Point((int)pos.X, (int)pos.Y) } });
Vector2 pos = MatchesContainer.ToLocalSpace(GetContainingInputManager().CurrentState.Mouse.Position);
TournamentMatch newMatch = new TournamentMatch { Position = { Value = new Point((int)pos.X, (int)pos.Y) } };
LadderInfo.Matches.Add(newMatch);
editorInfo.Selected.Value = newMatch;
}),
new OsuMenuItem("Reset teams", MenuItemType.Destructive, () =>
{

View File

@ -13,6 +13,7 @@ using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Game.Tournament.Models;
using osu.Game.Tournament.Screens.Editors;
using osuTK;
using osuTK.Graphics;
using osuTK.Input;
@ -41,35 +42,60 @@ namespace osu.Game.Tournament.Screens.Ladder.Components
AutoSizeAxes = Axes.Both;
Margin = new MarginPadding(5);
const float border_thickness = 5;
const float spacing = 2;
InternalChildren = new[]
Margin = new MarginPadding(10);
InternalChildren = new Drawable[]
{
selectionBox = new Container
{
Scale = new Vector2(1.1f),
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Alpha = 0,
Colour = Color4.YellowGreen,
Child = new Box { RelativeSizeAxes = Axes.Both }
},
CurrentMatchSelectionBox = new Container
{
Scale = new Vector2(1.05f, 1.1f),
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Alpha = 0,
Colour = Color4.White,
Child = new Box { RelativeSizeAxes = Axes.Both }
},
Flow = new FillFlowContainer<DrawableMatchTeam>
{
AutoSizeAxes = Axes.Both,
Direction = FillDirection.Vertical,
Spacing = new Vector2(2)
Spacing = new Vector2(spacing)
},
new Container
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding(-10),
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Child = selectionBox = new Container
{
RelativeSizeAxes = Axes.Both,
Alpha = 0,
Masking = true,
BorderColour = Color4.YellowGreen,
BorderThickness = border_thickness,
Child = new Box
{
RelativeSizeAxes = Axes.Both,
AlwaysPresent = true,
Alpha = 0,
}
},
},
new Container
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding(-(spacing + border_thickness)),
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Child = CurrentMatchSelectionBox = new Container
{
RelativeSizeAxes = Axes.Both,
Alpha = 0,
BorderColour = Color4.White,
BorderThickness = border_thickness,
Masking = true,
Child = new Box
{
RelativeSizeAxes = Axes.Both,
AlwaysPresent = true,
Alpha = 0,
}
},
}
};
@ -97,7 +123,6 @@ namespace osu.Game.Tournament.Screens.Ladder.Components
Position = new Vector2(pos.NewValue.X, pos.NewValue.Y);
Changed?.Invoke();
}, true);
updateTeams();
}
@ -225,10 +250,7 @@ namespace osu.Game.Tournament.Screens.Ladder.Components
if (editorInfo != null)
{
globalSelection = editorInfo.Selected.GetBoundCopy();
globalSelection.BindValueChanged(s =>
{
if (s.NewValue != Match) Selected = false;
});
globalSelection.BindValueChanged(s => Selected = s.NewValue == Match, true);
}
}
@ -312,8 +334,8 @@ namespace osu.Game.Tournament.Screens.Ladder.Components
private Vector2 snapToGrid(Vector2 pos) =>
new Vector2(
(int)(pos.X / 10) * 10,
(int)(pos.Y / 10) * 10
(int)(pos.X / LadderEditorScreen.GRID_SPACING) * LadderEditorScreen.GRID_SPACING,
(int)(pos.Y / LadderEditorScreen.GRID_SPACING) * LadderEditorScreen.GRID_SPACING
);
public void Remove()