mirror of
https://github.com/ppy/osu.git
synced 2024-12-14 17:32:54 +08:00
Implement visual behaviour of expanded card state
This commit is contained in:
parent
a07f8c74dc
commit
3fea8d5e62
@ -359,7 +359,8 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
{
|
||||
base.LoadComplete();
|
||||
|
||||
downloadTracker.State.BindValueChanged(_ => updateState(), true);
|
||||
downloadTracker.State.BindValueChanged(_ => updateState());
|
||||
Expanded.BindValueChanged(_ => updateState(), true);
|
||||
FinishTransforms(true);
|
||||
}
|
||||
|
||||
@ -401,19 +402,21 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
|
||||
private void updateState()
|
||||
{
|
||||
bool showDetails = IsHovered || Expanded.Value;
|
||||
|
||||
float targetWidth = width - height;
|
||||
if (IsHovered)
|
||||
if (showDetails)
|
||||
targetWidth = targetWidth - icon_area_width + CORNER_RADIUS;
|
||||
|
||||
thumbnail.Dimmed.Value = IsHovered;
|
||||
thumbnail.Dimmed.Value = showDetails;
|
||||
|
||||
mainContent.ResizeWidthTo(targetWidth, TRANSITION_DURATION, Easing.OutQuint);
|
||||
mainContentBackground.Dimmed.Value = IsHovered;
|
||||
mainContentBackground.Dimmed.Value = showDetails;
|
||||
|
||||
statisticsContainer.FadeTo(IsHovered ? 1 : 0, TRANSITION_DURATION, Easing.OutQuint);
|
||||
statisticsContainer.FadeTo(showDetails ? 1 : 0, TRANSITION_DURATION, Easing.OutQuint);
|
||||
|
||||
rightAreaBackground.FadeColour(downloadTracker.State.Value == DownloadState.LocallyAvailable ? colours.Lime0 : colourProvider.Background3, TRANSITION_DURATION, Easing.OutQuint);
|
||||
rightAreaButtons.FadeTo(IsHovered ? 1 : 0, TRANSITION_DURATION, Easing.OutQuint);
|
||||
rightAreaButtons.FadeTo(showDetails ? 1 : 0, TRANSITION_DURATION, Easing.OutQuint);
|
||||
|
||||
foreach (var button in rightAreaButtons)
|
||||
{
|
||||
|
@ -5,8 +5,10 @@ using osu.Framework.Allocation;
|
||||
using osu.Framework.Bindables;
|
||||
using osu.Framework.Graphics;
|
||||
using osu.Framework.Graphics.Containers;
|
||||
using osu.Framework.Graphics.Effects;
|
||||
using osu.Framework.Graphics.Shapes;
|
||||
using osu.Game.Overlays;
|
||||
using osuTK;
|
||||
|
||||
namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
{
|
||||
@ -25,15 +27,17 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
public Bindable<bool> Expanded { get; } = new BindableBool();
|
||||
|
||||
private readonly Box background;
|
||||
private readonly Container content;
|
||||
private readonly Container bodyContent;
|
||||
private readonly Container dropdownContent;
|
||||
private readonly Container borderContainer;
|
||||
|
||||
public BeatmapCardDropdown(float height)
|
||||
{
|
||||
RelativeSizeAxes = Axes.X;
|
||||
Height = height;
|
||||
|
||||
InternalChild = new Container
|
||||
InternalChild = content = new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.X,
|
||||
AutoSizeAxes = Axes.Y,
|
||||
@ -59,6 +63,19 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
AutoSizeAxes = Axes.Y,
|
||||
Margin = new MarginPadding { Top = height },
|
||||
Alpha = 0
|
||||
},
|
||||
borderContainer = new Container
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
CornerRadius = BeatmapCard.CORNER_RADIUS,
|
||||
Masking = true,
|
||||
BorderThickness = 3,
|
||||
Child = new Box
|
||||
{
|
||||
RelativeSizeAxes = Axes.Both,
|
||||
Alpha = 0,
|
||||
AlwaysPresent = true
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -68,18 +85,30 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
||||
private void load(OverlayColourProvider colourProvider)
|
||||
{
|
||||
background.Colour = colourProvider.Background2;
|
||||
borderContainer.BorderColour = colourProvider.Highlight1;
|
||||
}
|
||||
|
||||
protected override void LoadComplete()
|
||||
{
|
||||
base.LoadComplete();
|
||||
Expanded.BindValueChanged(_ => updateState());
|
||||
Expanded.BindValueChanged(_ => updateState(), true);
|
||||
FinishTransforms(true);
|
||||
}
|
||||
|
||||
private void updateState()
|
||||
{
|
||||
background.FadeTo(Expanded.Value ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
||||
dropdownContent.FadeTo(Expanded.Value ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
||||
borderContainer.FadeTo(Expanded.Value ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
||||
|
||||
content.TweenEdgeEffectTo(new EdgeEffectParameters
|
||||
{
|
||||
Type = EdgeEffectType.Shadow,
|
||||
Offset = new Vector2(0, 2),
|
||||
Radius = 10,
|
||||
Colour = Colour4.Black.Opacity(Expanded.Value ? 0.3f : 0f),
|
||||
Hollow = true,
|
||||
}, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user