1
0
mirror of https://github.com/ppy/osu.git synced 2025-01-14 19:22:56 +08:00

Extract header element from base DrawableCarouselItem class

This commit is contained in:
Dean Herbert 2020-10-13 15:19:32 +09:00
parent 2aad482545
commit cfec4f4fc1
5 changed files with 152 additions and 102 deletions

View File

@ -841,7 +841,7 @@ namespace osu.Game.Screens.Select
/// <param name="parent">For nested items, the parent of the item to be updated.</param>
private void updateItem(DrawableCarouselItem item, DrawableCarouselItem parent = null)
{
Vector2 posInScroll = scrollableContent.ToLocalSpace(item.ScreenSpaceDrawQuad.Centre);
Vector2 posInScroll = scrollableContent.ToLocalSpace(item.Header.ScreenSpaceDrawQuad.Centre);
float itemDrawY = posInScroll.Y - visibleUpperBound;
float dist = Math.Abs(1f - itemDrawY / visibleHalfHeight);

View File

@ -0,0 +1,108 @@
// 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 osu.Framework.Allocation;
using osu.Framework.Audio;
using osu.Framework.Audio.Sample;
using osu.Framework.Bindables;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Effects;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Framework.Utils;
using osu.Game.Graphics;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Screens.Select.Carousel
{
public class CarouselHeader : Container
{
private SampleChannel sampleHover;
private readonly Box hoverLayer;
public Container BorderContainer;
public readonly Bindable<CarouselItemState> State = new Bindable<CarouselItemState>(CarouselItemState.NotSelected);
protected override Container<Drawable> Content { get; } = new Container { RelativeSizeAxes = Axes.Both };
public CarouselHeader()
{
RelativeSizeAxes = Axes.X;
Height = DrawableCarouselItem.MAX_HEIGHT;
InternalChild = BorderContainer = new Container
{
RelativeSizeAxes = Axes.Both,
Masking = true,
CornerRadius = 10,
BorderColour = new Color4(221, 255, 255, 255),
Children = new Drawable[]
{
Content,
hoverLayer = new Box
{
RelativeSizeAxes = Axes.Both,
Alpha = 0,
Blending = BlendingParameters.Additive,
},
}
};
}
[BackgroundDependencyLoader]
private void load(AudioManager audio, OsuColour colours)
{
sampleHover = audio.Samples.Get($@"SongSelect/song-ping-variation-{RNG.Next(1, 5)}");
hoverLayer.Colour = colours.Blue.Opacity(0.1f);
}
protected override void LoadComplete()
{
base.LoadComplete();
State.BindValueChanged(updateState, true);
}
private void updateState(ValueChangedEvent<CarouselItemState> state)
{
switch (state.NewValue)
{
case CarouselItemState.Collapsed:
case CarouselItemState.NotSelected:
BorderContainer.BorderThickness = 0;
BorderContainer.EdgeEffect = new EdgeEffectParameters
{
Type = EdgeEffectType.Shadow, Offset = new Vector2(1), Radius = 10, Colour = Color4.Black.Opacity(100),
};
break;
case CarouselItemState.Selected:
BorderContainer.BorderThickness = 2.5f;
BorderContainer.EdgeEffect = new EdgeEffectParameters
{
Type = EdgeEffectType.Glow, Colour = new Color4(130, 204, 255, 150), Radius = 20, Roundness = 10,
};
break;
}
}
protected override bool OnHover(HoverEvent e)
{
sampleHover?.Play();
hoverLayer.FadeIn(100, Easing.OutQuint);
return base.OnHover(e);
}
protected override void OnHoverLost(HoverLostEvent e)
{
hoverLayer.FadeOut(1000, Easing.OutQuint);
base.OnHoverLost(e);
}
}
}

View File

@ -64,15 +64,14 @@ namespace osu.Game.Screens.Select.Carousel
public DrawableCarouselBeatmap(CarouselBeatmap panel)
{
beatmap = panel.Beatmap;
Height = HEIGHT;
// todo: temporary
Item = panel;
}
[BackgroundDependencyLoader(true)]
private void load(BeatmapManager manager, SongSelect songSelect)
{
Header.Height = HEIGHT;
if (songSelect != null)
{
startRequested = b => songSelect.FinaliseSelection(b);
@ -83,7 +82,7 @@ namespace osu.Game.Screens.Select.Carousel
if (manager != null)
hideRequested = manager.Hide;
Content.Children = new Drawable[]
Header.Children = new Drawable[]
{
background = new Box
{
@ -174,7 +173,7 @@ namespace osu.Game.Screens.Select.Carousel
{
base.Selected();
BorderContainer.MoveToX(-50, 500, Easing.OutExpo);
Header.MoveToX(-50, 500, Easing.OutExpo);
background.Colour = ColourInfo.GradientVertical(
new Color4(20, 43, 51, 255),
@ -187,7 +186,7 @@ namespace osu.Game.Screens.Select.Carousel
{
base.Deselected();
BorderContainer.MoveToX(0, 500, Easing.OutExpo);
Header.MoveToX(0, 500, Easing.OutExpo);
background.Colour = new Color4(20, 43, 51, 255);
triangles.Colour = OsuColour.Gray(0.5f);

View File

@ -67,16 +67,12 @@ namespace osu.Game.Screens.Select.Carousel
if (beatmapOverlay != null)
viewDetails = beatmapOverlay.FetchAndShowBeatmapSet;
// TODO: temporary. we probably want to *not* inherit DrawableCarouselItem for this class, but only the above header portion.
AddRangeInternal(new Drawable[]
Content.Add(beatmapContainer = new Container<DrawableCarouselItem>
{
beatmapContainer = new Container<DrawableCarouselItem>
{
X = 50,
Y = MAX_HEIGHT,
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
},
X = 50,
Y = MAX_HEIGHT,
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
});
}
@ -90,7 +86,7 @@ namespace osu.Game.Screens.Select.Carousel
return;
Logger.Log($"updating item {beatmapSet}");
Content.Children = new Drawable[]
Header.Children = new Drawable[]
{
new DelayedLoadUnloadWrapper(() =>
{
@ -163,7 +159,7 @@ namespace osu.Game.Screens.Select.Carousel
{
base.Deselected();
BorderContainer.MoveToX(0, 500, Easing.OutExpo);
MovementContainer.MoveToX(0, 500, Easing.OutExpo);
foreach (var beatmap in beatmapContainer)
{
@ -176,7 +172,7 @@ namespace osu.Game.Screens.Select.Carousel
{
base.Selected();
BorderContainer.MoveToX(-100, 500, Easing.OutExpo);
MovementContainer.MoveToX(-100, 500, Easing.OutExpo);
// on selection we show our child beatmaps.
// for now this is a simple drawable construction each selection.

View File

@ -4,21 +4,11 @@
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using osu.Framework.Allocation;
using osu.Framework.Audio;
using osu.Framework.Audio.Sample;
using osu.Framework.Bindables;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Effects;
using osu.Framework.Graphics.Pooling;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Input.Events;
using osu.Framework.Utils;
using osu.Game.Graphics;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Screens.Select.Carousel
{
@ -28,6 +18,14 @@ namespace osu.Game.Screens.Select.Carousel
public override bool IsPresent => base.IsPresent || Item?.Visible == true;
public readonly CarouselHeader Header;
protected readonly Container<Drawable> Content;
protected readonly Container MovementContainer;
private CarouselItem item;
public CarouselItem Item
{
get => item;
@ -38,8 +36,10 @@ namespace osu.Game.Screens.Select.Carousel
if (item != null)
{
Item.Filtered.ValueChanged -= onStateChange;
Item.State.ValueChanged -= onStateChange;
item.Filtered.ValueChanged -= onStateChange;
item.State.ValueChanged -= onStateChange;
Header.State.UnbindFrom(item.State);
if (item is CarouselGroup group)
{
@ -57,67 +57,33 @@ namespace osu.Game.Screens.Select.Carousel
public virtual IEnumerable<DrawableCarouselItem> ChildItems => Enumerable.Empty<DrawableCarouselItem>();
private readonly Container nestedContainer;
protected readonly Container BorderContainer;
private readonly Box hoverLayer;
protected Container<Drawable> Content => nestedContainer;
protected DrawableCarouselItem()
{
Height = MAX_HEIGHT;
RelativeSizeAxes = Axes.X;
AutoSizeAxes = Axes.Y;
Alpha = 0;
InternalChild = BorderContainer = new Container
InternalChildren = new Drawable[]
{
RelativeSizeAxes = Axes.Both,
Masking = true,
CornerRadius = 10,
BorderColour = new Color4(221, 255, 255, 255),
Children = new Drawable[]
MovementContainer = new Container
{
nestedContainer = new Container
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Children = new Drawable[]
{
RelativeSizeAxes = Axes.Both,
},
hoverLayer = new Box
{
RelativeSizeAxes = Axes.Both,
Alpha = 0,
Blending = BlendingParameters.Additive,
},
}
Header = new CarouselHeader(),
Content = new Container
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
}
}
},
};
}
private SampleChannel sampleHover;
private CarouselItem item;
[BackgroundDependencyLoader]
private void load(AudioManager audio, OsuColour colours)
{
sampleHover = audio.Samples.Get($@"SongSelect/song-ping-variation-{RNG.Next(1, 5)}");
hoverLayer.Colour = colours.Blue.Opacity(0.1f);
}
protected override bool OnHover(HoverEvent e)
{
sampleHover?.Play();
hoverLayer.FadeIn(100, Easing.OutQuint);
return base.OnHover(e);
}
protected override void OnHoverLost(HoverLostEvent e)
{
hoverLayer.FadeOut(1000, Easing.OutQuint);
base.OnHoverLost(e);
}
public void SetMultiplicativeAlpha(float alpha) => BorderContainer.Alpha = alpha;
public void SetMultiplicativeAlpha(float alpha) => Header.BorderContainer.Alpha = alpha;
protected override void LoadComplete()
{
@ -136,6 +102,8 @@ namespace osu.Game.Screens.Select.Carousel
Item.Filtered.ValueChanged += onStateChange;
Item.State.ValueChanged += onStateChange;
Header.State.BindTo(Item.State);
if (Item is CarouselGroup group)
{
foreach (var c in group.Children)
@ -171,31 +139,10 @@ namespace osu.Game.Screens.Select.Carousel
protected virtual void Selected()
{
Debug.Assert(Item != null);
Item.State.Value = CarouselItemState.Selected;
BorderContainer.BorderThickness = 2.5f;
BorderContainer.EdgeEffect = new EdgeEffectParameters
{
Type = EdgeEffectType.Glow,
Colour = new Color4(130, 204, 255, 150),
Radius = 20,
Roundness = 10,
};
}
protected virtual void Deselected()
{
Item.State.Value = CarouselItemState.NotSelected;
BorderContainer.BorderThickness = 0;
BorderContainer.EdgeEffect = new EdgeEffectParameters
{
Type = EdgeEffectType.Shadow,
Offset = new Vector2(1),
Radius = 10,
Colour = Color4.Black.Opacity(100),
};
}
protected override bool OnClick(ClickEvent e)