h1or4dme8/osu-lazer
1
0
Fork 0
mirror of https://github.com/ppy/osu.git synced 2025-01-14 02:22:56 +08:00
Code Issues Releases Wiki Activity

Merge pull request #25339 from joshika39/change-clickable-avatars-tooltip-for-usergrid

Browse Source 
Add `UserGridPanel` as the `ClickableAvatar` tooltip
This commit is contained in:
Dean Herbert 2023-11-15 18:01:24 +09:00 committed by GitHub
commit 189fca2eb6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 186 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
osu.Game.Tests/Visual/Online/TestSceneUserClickableAvatar.cs Normal file
View File

@ -0,0 +1,86 @@
// 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.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Effects;
using osu.Framework.Testing;
using osu.Game.Graphics.Cursor;
using osu.Game.Online.API.Requests.Responses;
using osu.Game.Users;
using osu.Game.Users.Drawables;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Tests.Visual.Online
{
public partial class TestSceneUserClickableAvatar : OsuManualInputManagerTestScene
{
[SetUp]
public void SetUp() => Schedule(() =>
{
Child = new FillFlowContainer
{
AutoSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Spacing = new Vector2(10f),
Children = new[]
{
generateUser(@"peppy", 2, CountryCode.AU, @"https://osu.ppy.sh/images/headers/profile-covers/c3.jpg", false, "99EB47"),
generateUser(@"flyte", 3103765, CountryCode.JP, @"https://osu.ppy.sh/images/headers/profile-covers/c6.jpg", true),
generateUser(@"joshika39", 17032217, CountryCode.RS, @"https://osu.ppy.sh/images/headers/profile-covers/c3.jpg", false),
new UpdateableAvatar(),
new UpdateableAvatar()
},
};
});
[Test]
public void TestClickableAvatarHover()
{
AddStep("hover avatar with user panel", () => InputManager.MoveMouseTo(this.ChildrenOfType<ClickableAvatar>().ElementAt(1)));
AddUntilStep("wait for tooltip to show", () => this.ChildrenOfType<ClickableAvatar.UserCardTooltip>().FirstOrDefault()?.State.Value == Visibility.Visible);
AddStep("hover out", () => InputManager.MoveMouseTo(new Vector2(0)));
AddUntilStep("wait for tooltip to hide", () => this.ChildrenOfType<ClickableAvatar.UserCardTooltip>().FirstOrDefault()?.State.Value == Visibility.Hidden);
AddStep("hover avatar without user panel", () => InputManager.MoveMouseTo(this.ChildrenOfType<ClickableAvatar>().ElementAt(0)));
AddUntilStep("wait for tooltip to show", () => this.ChildrenOfType<OsuTooltipContainer.OsuTooltip>().FirstOrDefault()?.State.Value == Visibility.Visible);
AddStep("hover out", () => InputManager.MoveMouseTo(new Vector2(0)));
AddUntilStep("wait for tooltip to hide", () => this.ChildrenOfType<OsuTooltipContainer.OsuTooltip>().FirstOrDefault()?.State.Value == Visibility.Hidden);
}
private Drawable generateUser(string username, int id, CountryCode countryCode, string cover, bool showPanel, string? color = null)
{
var user = new APIUser
{
Username = username,
Id = id,
CountryCode = countryCode,
CoverUrl = cover,
Colour = color ?? "000000",
Status =
{
Value = new UserStatusOnline()
},
};
return new ClickableAvatar(user, showPanel)
{
Width = 50,
Height = 50,
CornerRadius = 10,
Masking = true,
EdgeEffect = new EdgeEffectParameters
{
Type = EdgeEffectType.Shadow,
Radius = 1,
Colour = Color4.Black.Opacity(0.2f),
},
};
}
}
}

2
osu.Game/Beatmaps/Drawables/Cards/Statistics/BeatmapCardStatistic.cs
View File

@ -74,7 +74,7 @@ namespace osu.Game.Beatmaps.Drawables.Cards.Statistics
#region Tooltip implementation
public virtual ITooltip GetCustomTooltip() => null;
public virtual ITooltip GetCustomTooltip() => null!;
public virtual object TooltipContent => null;
#endregion

2
osu.Game/Overlays/BeatmapSet/AuthorInfo.cs
View File

@ -55,7 +55,7 @@ namespace osu.Game.Overlays.BeatmapSet
AutoSizeAxes = Axes.Both,
CornerRadius = 4,
Masking = true,
Child = avatar = new UpdateableAvatar(showGuestOnNull: false)
Child = avatar = new UpdateableAvatar(showUserPanelOnHover: true, showGuestOnNull: false)
{
Size = new Vector2(height),
},

2
osu.Game/Overlays/Comments/CommentsContainer.cs
View File

@ -102,7 +102,7 @@ namespace osu.Game.Overlays.Comments
Padding = new MarginPadding { Horizontal = WaveOverlayContainer.HORIZONTAL_PADDING, Vertical = 20 },
Children = new Drawable[]
{
avatar = new UpdateableAvatar(api.LocalUser.Value)
avatar = new UpdateableAvatar(api.LocalUser.Value, isInteractive: false)
{
Size = new Vector2(50),
CornerExponent = 2,

2
osu.Game/Overlays/Comments/DrawableComment.cs
View File

@ -144,7 +144,7 @@ namespace osu.Game.Overlays.Comments
Size = new Vector2(avatar_size),
Children = new Drawable[]
{
new UpdateableAvatar(Comment.User)
new UpdateableAvatar(Comment.User, showUserPanelOnHover: true)
{
Size = new Vector2(avatar_size),
Masking = true,

2
osu.Game/Screens/OnlinePlay/Components/ParticipantsList.cs
View File

@ -115,7 +115,7 @@ namespace osu.Game.Screens.OnlinePlay.Components
RelativeSizeAxes = Axes.Both,
Colour = Color4Extensions.FromHex(@"27252d"),
},
avatar = new UpdateableAvatar(showUsernameTooltip: true) { RelativeSizeAxes = Axes.Both },
avatar = new UpdateableAvatar(showUserPanelOnHover: true) { RelativeSizeAxes = Axes.Both },
};
}
}

2
osu.Game/Screens/OnlinePlay/Lounge/Components/DrawableRoomParticipantsList.cs
View File

@ -289,7 +289,7 @@ namespace osu.Game.Screens.OnlinePlay.Lounge.Components
set => avatar.User = value;
}
private readonly UpdateableAvatar avatar = new UpdateableAvatar(showUsernameTooltip: true) { RelativeSizeAxes = Axes.Both };
private readonly UpdateableAvatar avatar = new UpdateableAvatar(showUserPanelOnHover: true) { RelativeSizeAxes = Axes.Both };
[BackgroundDependencyLoader]
private void load(OverlayColourProvider colours)

100
osu.Game/Users/Drawables/ClickableAvatar.cs
View File

@ -1,38 +1,31 @@
// 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.Linq;
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Cursor;
using osu.Framework.Input.Events;
using osu.Framework.Localisation;
using osu.Game.Graphics.Containers;
using osu.Game.Graphics.Cursor;
using osu.Game.Localisation;
using osu.Game.Online.API;
using osu.Game.Online.API.Requests.Responses;
using osuTK;
namespace osu.Game.Users.Drawables
{
public partial class ClickableAvatar : OsuClickableContainer
public partial class ClickableAvatar : OsuClickableContainer, IHasCustomTooltip<APIUser?>
{
public override LocalisableString TooltipText
{
get
{
if (!Enabled.Value)
return string.Empty;
public ITooltip<APIUser?> GetCustomTooltip() => showCardOnHover ? new UserCardTooltip() : new NoCardTooltip();
return ShowUsernameTooltip ? (user?.Username ?? string.Empty) : ContextMenuStrings.ViewProfile;
}
set => throw new NotSupportedException();
}
/// <summary>
/// By default, the tooltip will show "view profile" as avatars are usually displayed next to a username.
/// Setting this to <c>true</c> exposes the username via tooltip for special cases where this is not true.
/// </summary>
public bool ShowUsernameTooltip { get; set; }
public APIUser? TooltipContent { get; }
private readonly APIUser? user;
private readonly bool showCardOnHover;
[Resolved]
private OsuGame? game { get; set; }
@ -40,12 +33,15 @@ namespace osu.Game.Users.Drawables
/// A clickable avatar for the specified user, with UI sounds included.
/// </summary>
/// <param name="user">The user. A null value will get a placeholder avatar.</param>
public ClickableAvatar(APIUser? user = null)
/// <param name="showCardOnHover">If set to true, the <see cref="UserGridPanel"/> will be shown for the tooltip</param>
public ClickableAvatar(APIUser? user = null, bool showCardOnHover = false)
{
this.user = user;
if (user?.Id != APIUser.SYSTEM_USER_ID)
Action = openProfile;
this.showCardOnHover = showCardOnHover;
TooltipContent = this.user = user ?? new GuestUser();
}
[BackgroundDependencyLoader]
@ -67,5 +63,65 @@ namespace osu.Game.Users.Drawables
return base.OnClick(e);
}
public partial class UserCardTooltip : VisibilityContainer, ITooltip<APIUser?>
{
public UserCardTooltip()
{
AutoSizeAxes = Axes.Both;
}
protected override void PopIn() => this.FadeIn(150, Easing.OutQuint);
protected override void PopOut() => this.Delay(150).FadeOut(500, Easing.OutQuint);
public void Move(Vector2 pos) => Position = pos;
private APIUser? user;
public void SetContent(APIUser? content)
{
if (content == user && Children.Any())
return;
user = content;
if (user != null)
{
LoadComponentAsync(new UserGridPanel(user)
{
Width = 300,
}, panel => Child = panel);
}
else
{
var tooltip = new OsuTooltipContainer.OsuTooltip();
tooltip.SetContent(ContextMenuStrings.ViewProfile);
tooltip.Show();
Child = tooltip;
}
}
}
public partial class NoCardTooltip : VisibilityContainer, ITooltip<APIUser?>
{
private readonly OsuTooltipContainer.OsuTooltip tooltip;
public NoCardTooltip()
{
tooltip = new OsuTooltipContainer.OsuTooltip();
tooltip.SetContent(ContextMenuStrings.ViewProfile);
Child = tooltip;
}
protected override void PopIn() => tooltip.Show();
protected override void PopOut() => tooltip.Hide();
public void Move(Vector2 pos) => Position = pos;
public void SetContent(APIUser? content)
{
}
}
}
}

24
osu.Game/Users/Drawables/UpdateableAvatar.cs
View File

@ -46,21 +46,24 @@ namespace osu.Game.Users.Drawables
protected override double LoadDelay => 200;
private readonly bool isInteractive;
private readonly bool showUsernameTooltip;
private readonly bool showGuestOnNull;
private readonly bool showUserPanelOnHover;
/// <summary>
/// Construct a new UpdateableAvatar.
/// </summary>
/// <param name="user">The initial user to display.</param>
/// <param name="isInteractive">If set to true, hover/click sounds will play and clicking the avatar will open the user's profile.</param>
/// <param name="showUsernameTooltip">Whether to show the username rather than "view profile" on the tooltip. (note: this only applies if <paramref name="isInteractive"/> is also true)</param>
/// <param name="showUserPanelOnHover">
/// If set to true, the user status panel will be displayed in the tooltip.
/// Only has an effect if <see cref="isInteractive"/> is true.
/// </param>
/// <param name="showGuestOnNull">Whether to show a default guest representation on null user (as opposed to nothing).</param>
public UpdateableAvatar(APIUser? user = null, bool isInteractive = true, bool showUsernameTooltip = false, bool showGuestOnNull = true)
public UpdateableAvatar(APIUser? user = null, bool isInteractive = true, bool showUserPanelOnHover = false, bool showGuestOnNull = true)
{
this.isInteractive = isInteractive;
this.showUsernameTooltip = showUsernameTooltip;
this.showGuestOnNull = showGuestOnNull;
this.showUserPanelOnHover = showUserPanelOnHover;
User = user;
}
@ -72,19 +75,16 @@ namespace osu.Game.Users.Drawables
if (isInteractive)
{
return new ClickableAvatar(user)
return new ClickableAvatar(user, showUserPanelOnHover)
{
ShowUsernameTooltip = showUsernameTooltip,
RelativeSizeAxes = Axes.Both,
};
}
else
return new DrawableAvatar(user)
{
return new DrawableAvatar(user)
{
RelativeSizeAxes = Axes.Both,
};
}
RelativeSizeAxes = Axes.Both,
};
}
}
}

4
osu.Game/Users/UserGridPanel.cs
View File

@ -10,6 +10,10 @@ using osuTK;
namespace osu.Game.Users
{
/// <summary>
/// A user "card", commonly used in a grid layout or in popovers.
/// Comes with a preset height, but width must be specified.
/// </summary>
public partial class UserGridPanel : ExtendedUserPanel
{
private const int margin = 10;