mirror of
https://github.com/ppy/osu.git
synced 2024-12-15 08:22:56 +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();
|
base.LoadComplete();
|
||||||
|
|
||||||
downloadTracker.State.BindValueChanged(_ => updateState(), true);
|
downloadTracker.State.BindValueChanged(_ => updateState());
|
||||||
|
Expanded.BindValueChanged(_ => updateState(), true);
|
||||||
FinishTransforms(true);
|
FinishTransforms(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -401,19 +402,21 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
|||||||
|
|
||||||
private void updateState()
|
private void updateState()
|
||||||
{
|
{
|
||||||
|
bool showDetails = IsHovered || Expanded.Value;
|
||||||
|
|
||||||
float targetWidth = width - height;
|
float targetWidth = width - height;
|
||||||
if (IsHovered)
|
if (showDetails)
|
||||||
targetWidth = targetWidth - icon_area_width + CORNER_RADIUS;
|
targetWidth = targetWidth - icon_area_width + CORNER_RADIUS;
|
||||||
|
|
||||||
thumbnail.Dimmed.Value = IsHovered;
|
thumbnail.Dimmed.Value = showDetails;
|
||||||
|
|
||||||
mainContent.ResizeWidthTo(targetWidth, TRANSITION_DURATION, Easing.OutQuint);
|
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);
|
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)
|
foreach (var button in rightAreaButtons)
|
||||||
{
|
{
|
||||||
|
@ -5,8 +5,10 @@ using osu.Framework.Allocation;
|
|||||||
using osu.Framework.Bindables;
|
using osu.Framework.Bindables;
|
||||||
using osu.Framework.Graphics;
|
using osu.Framework.Graphics;
|
||||||
using osu.Framework.Graphics.Containers;
|
using osu.Framework.Graphics.Containers;
|
||||||
|
using osu.Framework.Graphics.Effects;
|
||||||
using osu.Framework.Graphics.Shapes;
|
using osu.Framework.Graphics.Shapes;
|
||||||
using osu.Game.Overlays;
|
using osu.Game.Overlays;
|
||||||
|
using osuTK;
|
||||||
|
|
||||||
namespace osu.Game.Beatmaps.Drawables.Cards
|
namespace osu.Game.Beatmaps.Drawables.Cards
|
||||||
{
|
{
|
||||||
@ -25,15 +27,17 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
|||||||
public Bindable<bool> Expanded { get; } = new BindableBool();
|
public Bindable<bool> Expanded { get; } = new BindableBool();
|
||||||
|
|
||||||
private readonly Box background;
|
private readonly Box background;
|
||||||
|
private readonly Container content;
|
||||||
private readonly Container bodyContent;
|
private readonly Container bodyContent;
|
||||||
private readonly Container dropdownContent;
|
private readonly Container dropdownContent;
|
||||||
|
private readonly Container borderContainer;
|
||||||
|
|
||||||
public BeatmapCardDropdown(float height)
|
public BeatmapCardDropdown(float height)
|
||||||
{
|
{
|
||||||
RelativeSizeAxes = Axes.X;
|
RelativeSizeAxes = Axes.X;
|
||||||
Height = height;
|
Height = height;
|
||||||
|
|
||||||
InternalChild = new Container
|
InternalChild = content = new Container
|
||||||
{
|
{
|
||||||
RelativeSizeAxes = Axes.X,
|
RelativeSizeAxes = Axes.X,
|
||||||
AutoSizeAxes = Axes.Y,
|
AutoSizeAxes = Axes.Y,
|
||||||
@ -59,6 +63,19 @@ namespace osu.Game.Beatmaps.Drawables.Cards
|
|||||||
AutoSizeAxes = Axes.Y,
|
AutoSizeAxes = Axes.Y,
|
||||||
Margin = new MarginPadding { Top = height },
|
Margin = new MarginPadding { Top = height },
|
||||||
Alpha = 0
|
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)
|
private void load(OverlayColourProvider colourProvider)
|
||||||
{
|
{
|
||||||
background.Colour = colourProvider.Background2;
|
background.Colour = colourProvider.Background2;
|
||||||
|
borderContainer.BorderColour = colourProvider.Highlight1;
|
||||||
}
|
}
|
||||||
|
|
||||||
protected override void LoadComplete()
|
protected override void LoadComplete()
|
||||||
{
|
{
|
||||||
base.LoadComplete();
|
base.LoadComplete();
|
||||||
Expanded.BindValueChanged(_ => updateState());
|
Expanded.BindValueChanged(_ => updateState(), true);
|
||||||
|
FinishTransforms(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
private void updateState()
|
private void updateState()
|
||||||
{
|
{
|
||||||
background.FadeTo(Expanded.Value ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
background.FadeTo(Expanded.Value ? 1 : 0, BeatmapCard.TRANSITION_DURATION, Easing.OutQuint);
|
||||||
dropdownContent.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