mirror of
https://github.com/ppy/osu.git
synced 2025-03-18 03:27:20 +08:00
Update DrawableRoom design.
This commit is contained in:
DrabWeb
parent
7e5b920c92
commit
0de55776c0
@ -8,6 +8,7 @@ using osu.Game.Screens.Multiplayer;
|
||||
using osu.Game.Online.Multiplayer;
|
||||
using osu.Game.Users;
|
||||
using osu.Game.Database;
|
||||
using osu.Framework.Allocation;
|
||||
|
||||
namespace osu.Desktop.VisualTests.Tests
|
||||
{
|
||||
@ -15,74 +16,105 @@ namespace osu.Desktop.VisualTests.Tests
|
||||
{
|
||||
public override string Description => @"Select your favourite room";
|
||||
|
||||
private RulesetDatabase rulesets;
|
||||
|
||||
public override void Reset()
|
||||
{
|
||||
base.Reset();
|
||||
|
||||
DrawableRoom first;
|
||||
DrawableRoom second;
|
||||
Add(new FillFlowContainer
|
||||
{
|
||||
Anchor = Anchor.Centre,
|
||||
Origin = Anchor.Centre,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Width = 500f,
|
||||
Width = 580f,
|
||||
Direction = FillDirection.Vertical,
|
||||
Children = new Drawable[]
|
||||
{
|
||||
first = new DrawableRoom(new Room()),
|
||||
second = new DrawableRoom(new Room()),
|
||||
first = new DrawableRoom(new Room
|
||||
{
|
||||
Name = { Value = @"Great Room Right Here" },
|
||||
Host = { Value = new User { Username = @"Naeferith", Id = 9492835, Country = new Country { FlagName = @"FR" } } },
|
||||
Status = { Value = new RoomStatusOpen() },
|
||||
Type = { Value = new GameTypeTeamVersus() },
|
||||
Beatmap =
|
||||
{
|
||||
Value = new BeatmapInfo
|
||||
{
|
||||
StarDifficulty = 4.65,
|
||||
Ruleset = rulesets.GetRuleset(3),
|
||||
Metadata = new BeatmapMetadata
|
||||
{
|
||||
Title = @"Critical Crystal",
|
||||
Artist = @"Seiryu",
|
||||
},
|
||||
OnlineInfo = new BeatmapOnlineInfo
|
||||
{
|
||||
Covers = new[] { @"https://assets.ppy.sh//beatmaps/376340/covers/cover.jpg?1456478455" },
|
||||
},
|
||||
},
|
||||
},
|
||||
Participants =
|
||||
{
|
||||
Value = new[]
|
||||
{
|
||||
new User { GlobalRank = 1355 },
|
||||
new User { GlobalRank = 8756 },
|
||||
},
|
||||
},
|
||||
}),
|
||||
new DrawableRoom(new Room
|
||||
{
|
||||
Name = { Value = @"Relax It's The Weekend" },
|
||||
Host = { Value = new User { Username = @"peppy", Id = 2, Country = new Country { FlagName = @"AU" } } },
|
||||
Status = { Value = new RoomStatusPlaying() },
|
||||
Type = { Value = new GameTypeTagTeam() },
|
||||
Beatmap =
|
||||
{
|
||||
Value = new BeatmapInfo
|
||||
{
|
||||
StarDifficulty = 1.96,
|
||||
Ruleset = rulesets.GetRuleset(0),
|
||||
Metadata = new BeatmapMetadata
|
||||
{
|
||||
Title = @"Serendipity",
|
||||
Artist = @"ZAQ",
|
||||
},
|
||||
OnlineInfo = new BeatmapOnlineInfo
|
||||
{
|
||||
Covers = new[] { @"https://assets.ppy.sh//beatmaps/526839/covers/cover.jpg?1493815706" },
|
||||
},
|
||||
},
|
||||
},
|
||||
Participants =
|
||||
{
|
||||
Value = new[]
|
||||
{
|
||||
new User { GlobalRank = 578975 },
|
||||
new User { GlobalRank = 24554 },
|
||||
},
|
||||
},
|
||||
}),
|
||||
}
|
||||
});
|
||||
|
||||
first.Room.Name.Value = @"Great Room Right Here";
|
||||
first.Room.Host.Value = new User { Username = @"Naeferith", Id = 9492835, Country = new Country { FlagName = @"FR" } };
|
||||
first.Room.Status.Value = new RoomStatusOpen();
|
||||
first.Room.Beatmap.Value = new BeatmapInfo
|
||||
AddStep(@"change title", () => first.Room.Name.Value = @"I Changed Name");
|
||||
AddStep(@"change host", () => first.Room.Host.Value = new User { Username = @"DrabWeb", Id = 6946022, Country = new Country { FlagName = @"CA" } });
|
||||
AddStep(@"change status", () => first.Room.Status.Value = new RoomStatusPlaying());
|
||||
AddStep(@"change type", () => first.Room.Type.Value = new GameTypeVersus());
|
||||
AddStep(@"change beatmap", () => first.Room.Beatmap.Value = null);
|
||||
AddStep(@"change participants", () => first.Room.Participants.Value = new[]
|
||||
{
|
||||
Metadata = new BeatmapMetadata
|
||||
{
|
||||
Title = @"Seiryu",
|
||||
Artist = @"Critical Crystal",
|
||||
},
|
||||
};
|
||||
|
||||
second.Room.Name.Value = @"Relax It's The Weekend";
|
||||
second.Room.Host.Value = new User { Username = @"peppy", Id = 2, Country = new Country { FlagName = @"AU" } };
|
||||
second.Room.Status.Value = new RoomStatusPlaying();
|
||||
second.Room.Beatmap.Value = new BeatmapInfo
|
||||
{
|
||||
Metadata = new BeatmapMetadata
|
||||
{
|
||||
Title = @"Serendipity",
|
||||
Artist = @"ZAQ",
|
||||
},
|
||||
};
|
||||
|
||||
AddStep(@"change state", () =>
|
||||
{
|
||||
first.Room.Status.Value = new RoomStatusPlaying();
|
||||
new User { GlobalRank = 1254 },
|
||||
new User { GlobalRank = 123189 },
|
||||
});
|
||||
}
|
||||
|
||||
AddStep(@"change name", () =>
|
||||
{
|
||||
first.Room.Name.Value = @"I Changed Name";
|
||||
});
|
||||
|
||||
AddStep(@"change host", () =>
|
||||
{
|
||||
first.Room.Host.Value = new User { Username = @"DrabWeb", Id = 6946022, Country = new Country { FlagName = @"CA" } };
|
||||
});
|
||||
|
||||
AddStep(@"change beatmap", () =>
|
||||
{
|
||||
first.Room.Beatmap.Value = null;
|
||||
});
|
||||
|
||||
AddStep(@"change state", () =>
|
||||
{
|
||||
first.Room.Status.Value = new RoomStatusOpen();
|
||||
});
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(RulesetDatabase rulesets)
|
||||
{
|
||||
this.rulesets = rulesets;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,14 +1,18 @@
|
||||
// Copyright (c) 2007-2017 ppy Pty Ltd <contact@ppy.sh>.
|
||||
// Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
|
||||
|
||||
using System.Linq;
|
||||
using OpenTK;
|
||||
using OpenTK.Graphics;
|
||||
using osu.Framework.Allocation;
|
||||
using osu.Framework.Configuration;
|
||||
using osu.Framework.Extensions.Color4Extensions;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Framework.Graphics.Textures;
|
||||
using osu.Framework.Localisation;
|
||||
using osu.Game.Beatmaps.Drawables;
|
||||
using osu.Game.Database;
|
||||
using osu.Game.Graphics;
|
||||
using osu.Game.Graphics.Sprites;
|
||||
@ -19,22 +23,36 @@ namespace osu.Game.Screens.Multiplayer
|
||||
{
|
||||
public class DrawableRoom : ClickableContainer
|
||||
{
|
||||
private const float content_padding = 5;
|
||||
private const float height = 90;
|
||||
private const float transition_duration = 100;
|
||||
private const float content_padding = 10;
|
||||
private const float height = 100;
|
||||
private const float side_strip_width = 5;
|
||||
private const float cover_width = 145;
|
||||
private const float ruleset_height = 30;
|
||||
|
||||
private readonly Box sideStrip;
|
||||
private readonly UpdateableAvatar avatar;
|
||||
private readonly Container coverContainer, rulesetContainer, gameTypeContainer;
|
||||
private readonly OsuSpriteText name;
|
||||
private readonly Container flagContainer;
|
||||
private readonly OsuSpriteText host;
|
||||
private readonly OsuSpriteText rankBounds;
|
||||
private readonly FillFlowContainer levelRangeContainer;
|
||||
private readonly OsuSpriteText levelRangeLower;
|
||||
private readonly OsuSpriteText levelRangeHigher;
|
||||
private readonly OsuSpriteText status;
|
||||
private readonly FillFlowContainer<OsuSpriteText> beatmapInfoFlow;
|
||||
private readonly OsuSpriteText beatmapTitle;
|
||||
private readonly OsuSpriteText beatmapDash;
|
||||
private readonly OsuSpriteText beatmapArtist;
|
||||
|
||||
private readonly Bindable<string> nameBind = new Bindable<string>();
|
||||
private readonly Bindable<User> hostBind = new Bindable<User>();
|
||||
private readonly Bindable<RoomStatus> statusBind = new Bindable<RoomStatus>();
|
||||
private readonly Bindable<GameType> typeBind = new Bindable<GameType>();
|
||||
private readonly Bindable<BeatmapInfo> beatmapBind = new Bindable<BeatmapInfo>();
|
||||
private readonly Bindable<User[]> participantsBind = new Bindable<User[]>();
|
||||
|
||||
private OsuColour colours;
|
||||
private TextureStore textures;
|
||||
private LocalisationEngine localisation;
|
||||
|
||||
public readonly Room Room;
|
||||
@ -59,24 +77,36 @@ namespace osu.Game.Screens.Multiplayer
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = OsuColour.Gray(34),
|
||||
Colour = OsuColour.FromHex(@"212121"),
|
||||
},
|
||||
sideStrip = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Width = content_padding,
|
||||
Width = side_strip_width,
|
||||
},
|
||||
avatar = new UpdateableAvatar
|
||||
new Container
|
||||
{
|
||||
Size = new Vector2(Height - content_padding * 2),
|
||||
Width = cover_width,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Masking = true,
|
||||
CornerRadius = 5f,
|
||||
Margin = new MarginPadding { Left = content_padding * 2, Top = content_padding },
|
||||
Margin = new MarginPadding { Left = side_strip_width },
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = Color4.Black,
|
||||
},
|
||||
coverContainer = new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
},
|
||||
},
|
||||
},
|
||||
new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Padding = new MarginPadding { Top = content_padding, Bottom = content_padding, Left = Height + content_padding * 2, Right = content_padding },
|
||||
Padding = new MarginPadding { Top = content_padding, Bottom = content_padding, Left = side_strip_width + cover_width + content_padding, Right = content_padding },
|
||||
Children = new Drawable[]
|
||||
{
|
||||
new FillFlowContainer
|
||||
@ -100,20 +130,30 @@ namespace osu.Game.Screens.Multiplayer
|
||||
new FillFlowContainer
|
||||
{
|
||||
AutoSizeAxes = Axes.X,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
Height = 15f,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Spacing = new Vector2(5f, 0f),
|
||||
Children = new Drawable[]
|
||||
{
|
||||
flagContainer = new Container
|
||||
{
|
||||
Width = 30f,
|
||||
Width = 22f,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
},
|
||||
new Container
|
||||
new Container //todo: team banners
|
||||
{
|
||||
Width = 40f,
|
||||
Width = 38f,
|
||||
RelativeSizeAxes = Axes.Y,
|
||||
CornerRadius = 2f,
|
||||
Masking = true,
|
||||
Children = new[]
|
||||
{
|
||||
new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Colour = OsuColour.FromHex(@"ad387e"),
|
||||
},
|
||||
},
|
||||
},
|
||||
new OsuSpriteText
|
||||
{
|
||||
@ -131,13 +171,40 @@ namespace osu.Game.Screens.Multiplayer
|
||||
},
|
||||
},
|
||||
},
|
||||
rankBounds = new OsuSpriteText
|
||||
levelRangeContainer = new FillFlowContainer
|
||||
{
|
||||
Anchor = Anchor.CentreRight,
|
||||
Origin = Anchor.CentreRight,
|
||||
Text = "#0 - #0",
|
||||
TextSize = 14,
|
||||
Margin = new MarginPadding { Right = 10 },
|
||||
AutoSizeAxes = Axes.Both,
|
||||
Direction = FillDirection.Horizontal,
|
||||
Children = new[]
|
||||
{
|
||||
new OsuSpriteText
|
||||
{
|
||||
Text = "#",
|
||||
TextSize = 14,
|
||||
},
|
||||
levelRangeLower = new OsuSpriteText
|
||||
{
|
||||
TextSize = 14,
|
||||
Font = @"Exo2.0-Bold",
|
||||
},
|
||||
new OsuSpriteText
|
||||
{
|
||||
Text = " - ",
|
||||
TextSize = 14,
|
||||
},
|
||||
new OsuSpriteText
|
||||
{
|
||||
Text = "#",
|
||||
TextSize = 14,
|
||||
},
|
||||
levelRangeHigher = new OsuSpriteText
|
||||
{
|
||||
TextSize = 14,
|
||||
Font = @"Exo2.0-Bold",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
@ -150,7 +217,6 @@ namespace osu.Game.Screens.Multiplayer
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Direction = FillDirection.Vertical,
|
||||
Margin = new MarginPadding { Bottom = content_padding },
|
||||
Children = new Drawable[]
|
||||
{
|
||||
status = new OsuSpriteText
|
||||
@ -173,7 +239,7 @@ namespace osu.Game.Screens.Multiplayer
|
||||
beatmapDash = new OsuSpriteText
|
||||
{
|
||||
TextSize = 14,
|
||||
Font = @"Exo2.0-RegularItalic",
|
||||
Font = @"Exo2.0-BoldItalic",
|
||||
},
|
||||
beatmapArtist = new OsuSpriteText
|
||||
{
|
||||
@ -184,26 +250,64 @@ namespace osu.Game.Screens.Multiplayer
|
||||
},
|
||||
},
|
||||
},
|
||||
new FillFlowContainer
|
||||
{
|
||||
Anchor = Anchor.BottomRight,
|
||||
Origin = Anchor.BottomRight,
|
||||
Height = ruleset_height,
|
||||
Direction = FillDirection.Horizontal,
|
||||
LayoutDuration = transition_duration,
|
||||
Spacing = new Vector2(5f, 0f),
|
||||
Children = new[]
|
||||
{
|
||||
rulesetContainer = new Container
|
||||
{
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
AutoSizeAxes = Axes.Both,
|
||||
},
|
||||
gameTypeContainer = new Container
|
||||
{
|
||||
Anchor = Anchor.TopRight,
|
||||
Origin = Anchor.TopRight,
|
||||
AutoSizeAxes = Axes.Both,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
Room.Name.ValueChanged += displayName;
|
||||
Room.Host.ValueChanged += displayUser;
|
||||
Room.Status.ValueChanged += displayStatus;
|
||||
Room.Beatmap.ValueChanged += displayBeatmap;
|
||||
nameBind.ValueChanged += displayName;
|
||||
hostBind.ValueChanged += displayUser;
|
||||
participantsBind.ValueChanged += displayParticipants;
|
||||
|
||||
nameBind.BindTo(Room.Name);
|
||||
hostBind.BindTo(Room.Host);
|
||||
statusBind.BindTo(Room.Status);
|
||||
typeBind.BindTo(Room.Type);
|
||||
beatmapBind.BindTo(Room.Beatmap);
|
||||
participantsBind.BindTo(Room.Participants);
|
||||
}
|
||||
|
||||
[BackgroundDependencyLoader]
|
||||
private void load(OsuColour colours, LocalisationEngine localisation)
|
||||
private void load(OsuColour colours, TextureStore textures, LocalisationEngine localisation)
|
||||
{
|
||||
this.localisation = localisation;
|
||||
this.textures = textures;
|
||||
this.colours = colours;
|
||||
|
||||
beatmapInfoFlow.Colour = rankBounds.Colour = colours.Gray9;
|
||||
beatmapInfoFlow.Colour = levelRangeContainer.Colour = colours.Gray9;
|
||||
host.Colour = colours.Blue;
|
||||
|
||||
displayStatus(Room.Status.Value);
|
||||
//binded here instead of ctor because dependencies are needed
|
||||
statusBind.ValueChanged += displayStatus;
|
||||
typeBind.ValueChanged += displayGameType;
|
||||
beatmapBind.ValueChanged += displayBeatmap;
|
||||
|
||||
statusBind.TriggerChange();
|
||||
typeBind.TriggerChange();
|
||||
beatmapBind.TriggerChange();
|
||||
}
|
||||
|
||||
private void displayName(string value)
|
||||
@ -213,7 +317,6 @@ namespace osu.Game.Screens.Multiplayer
|
||||
|
||||
private void displayUser(User value)
|
||||
{
|
||||
avatar.User = value;
|
||||
host.Text = value.Username;
|
||||
flagContainer.Children = new[] { new DrawableFlag(value.Country?.FlagName ?? @"__") { RelativeSizeAxes = Axes.Both } };
|
||||
}
|
||||
@ -227,33 +330,64 @@ namespace osu.Game.Screens.Multiplayer
|
||||
d.FadeColour(value.GetAppropriateColour(colours), 100);
|
||||
}
|
||||
|
||||
private void displayGameType(GameType value)
|
||||
{
|
||||
gameTypeContainer.Children = new[]
|
||||
{
|
||||
new DrawableGameType(value)
|
||||
{
|
||||
Size = new Vector2(ruleset_height),
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
private void displayBeatmap(BeatmapInfo value)
|
||||
{
|
||||
if (value != null)
|
||||
{
|
||||
coverContainer.FadeIn(transition_duration);
|
||||
coverContainer.Children = new[]
|
||||
{
|
||||
new AsyncLoadWrapper(new BeatmapBackgroundSprite(new OnlineWorkingBeatmap(value, textures, null))
|
||||
{
|
||||
Anchor = Anchor.Centre,
|
||||
Origin = Anchor.Centre,
|
||||
FillMode = FillMode.Fill,
|
||||
OnLoadComplete = d => d.FadeInFromZero(400, EasingTypes.Out),
|
||||
}) { RelativeSizeAxes = Axes.Both }
|
||||
};
|
||||
|
||||
rulesetContainer.FadeIn(transition_duration);
|
||||
rulesetContainer.Children = new[]
|
||||
{
|
||||
new DifficultyIcon(value)
|
||||
{
|
||||
Size = new Vector2(ruleset_height),
|
||||
}
|
||||
};
|
||||
|
||||
beatmapTitle.Current = localisation.GetUnicodePreference(value.Metadata.TitleUnicode, value.Metadata.Title);
|
||||
beatmapDash.Text = @" - ";
|
||||
beatmapArtist.Current = localisation.GetUnicodePreference(value.Metadata.ArtistUnicode, value.Metadata.Artist);
|
||||
}
|
||||
else
|
||||
{
|
||||
coverContainer.FadeOut(transition_duration);
|
||||
rulesetContainer.FadeOut(transition_duration);
|
||||
|
||||
beatmapTitle.Current = null;
|
||||
beatmapArtist.Current = null;
|
||||
|
||||
beatmapTitle.Text = @"Changing map";
|
||||
beatmapDash.Text = string.Empty;
|
||||
beatmapArtist.Text = string.Empty;
|
||||
beatmapTitle.Text = "Changing map";
|
||||
beatmapDash.Text = beatmapArtist.Text = string.Empty;
|
||||
}
|
||||
}
|
||||
|
||||
protected override void Dispose(bool isDisposing)
|
||||
private void displayParticipants(User[] value)
|
||||
{
|
||||
Room.Name.ValueChanged -= displayName;
|
||||
Room.Host.ValueChanged -= displayUser;
|
||||
Room.Status.ValueChanged -= displayStatus;
|
||||
Room.Beatmap.ValueChanged -= displayBeatmap;
|
||||
|
||||
base.Dispose(isDisposing);
|
||||
var ranks = value.Select(u => u.GlobalRank);
|
||||
levelRangeLower.Text = ranks.Min().ToString();
|
||||
levelRangeHigher.Text = ranks.Max().ToString();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -331,7 +331,6 @@ namespace osu.Game.Screens.Multiplayer
|
||||
},
|
||||
levelRangeHigher = new OsuSpriteText
|
||||
{
|
||||
Text = "6251",
|
||||
TextSize = 14,
|
||||
Font = @"Exo2.0-Bold",
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user