1
0
mirror of https://github.com/ppy/osu.git synced 2025-01-15 15:12:57 +08:00

Merge pull request #7591 from peppy/improve-song-select-uiscale

Improve song select display on ultrawide displays (or when UI scale is set low)
This commit is contained in:
Dan Balasescu 2020-01-24 19:14:46 +09:00 committed by GitHub
commit 9be3d7a161
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 131 additions and 90 deletions

View File

@ -33,7 +33,7 @@ namespace osu.Game.Screens.Select
{ {
private const float shear_width = 36.75f; private const float shear_width = 36.75f;
private static readonly Vector2 wedged_container_shear = new Vector2(shear_width / SongSelect.WEDGED_CONTAINER_SIZE.Y, 0); private static readonly Vector2 wedged_container_shear = new Vector2(shear_width / SongSelect.WEDGE_HEIGHT, 0);
private readonly IBindable<RulesetInfo> ruleset = new Bindable<RulesetInfo>(); private readonly IBindable<RulesetInfo> ruleset = new Bindable<RulesetInfo>();

View File

@ -41,7 +41,7 @@ namespace osu.Game.Screens.Select
{ {
public abstract class SongSelect : OsuScreen, IKeyBindingHandler<GlobalAction> public abstract class SongSelect : OsuScreen, IKeyBindingHandler<GlobalAction>
{ {
public static readonly Vector2 WEDGED_CONTAINER_SIZE = new Vector2(0.5f, 245); public static readonly float WEDGE_HEIGHT = 245;
protected const float BACKGROUND_BLUR = 20; protected const float BACKGROUND_BLUR = 20;
private const float left_area_padding = 20; private const float left_area_padding = 20;
@ -95,56 +95,38 @@ namespace osu.Game.Screens.Select
transferRulesetValue(); transferRulesetValue();
AddRangeInternal(new Drawable[] AddRangeInternal(new Drawable[]
{
new ResetScrollContainer(() => Carousel.ScrollToSelected())
{
RelativeSizeAxes = Axes.Y,
Width = 250,
},
new VerticalMaskingContainer
{
Children = new Drawable[]
{
new GridContainer // used for max width implementation
{
RelativeSizeAxes = Axes.Both,
ColumnDimensions = new[]
{
new Dimension(),
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 850),
},
Content = new[]
{
new Drawable[]
{ {
new ParallaxContainer new ParallaxContainer
{ {
Masking = true,
ParallaxAmount = 0.005f, ParallaxAmount = 0.005f,
RelativeSizeAxes = Axes.Both, RelativeSizeAxes = Axes.Both,
Children = new[] Child = new WedgeBackground
{
new WedgeBackground
{ {
RelativeSizeAxes = Axes.Both, RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Right = -150 }, Padding = new MarginPadding { Right = -150 },
Size = new Vector2(WEDGED_CONTAINER_SIZE.X, 1),
}
}
}, },
new Container
{
Origin = Anchor.BottomLeft,
Anchor = Anchor.BottomLeft,
RelativeSizeAxes = Axes.Both,
Size = new Vector2(WEDGED_CONTAINER_SIZE.X, 1),
Padding = new MarginPadding
{
Bottom = Footer.HEIGHT,
Top = WEDGED_CONTAINER_SIZE.Y + left_area_padding,
Left = left_area_padding,
Right = left_area_padding * 2,
}, },
Child = BeatmapDetails = new BeatmapDetailArea
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Top = 10, Right = 5 },
}
},
new Container
{
RelativeSizeAxes = Axes.Both,
Masking = true,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Width = 2, //avoid horizontal masking so the panels don't clip when screen stack is pushed.
Child = new Container
{
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Width = 0.5f,
Children = new Drawable[]
{
new Container new Container
{ {
RelativeSizeAxes = Axes.Both, RelativeSizeAxes = Axes.Both,
@ -155,13 +137,15 @@ namespace osu.Game.Screens.Select
}, },
Child = Carousel = new BeatmapCarousel Child = Carousel = new BeatmapCarousel
{ {
RelativeSizeAxes = Axes.Both,
Size = new Vector2(1 - WEDGED_CONTAINER_SIZE.X, 1),
Anchor = Anchor.CentreRight, Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight, Origin = Anchor.CentreRight,
RelativeSizeAxes = Axes.Both,
SelectionChanged = updateSelectedBeatmap, SelectionChanged = updateSelectedBeatmap,
BeatmapSetsChanged = carouselBeatmapsLoaded, BeatmapSetsChanged = carouselBeatmapsLoaded,
}, },
}
},
}
}, },
FilterControl = new FilterControl FilterControl = new FilterControl
{ {
@ -170,12 +154,28 @@ namespace osu.Game.Screens.Select
FilterChanged = ApplyFilterToCarousel, FilterChanged = ApplyFilterToCarousel,
Background = { Width = 2 }, Background = { Width = 2 },
}, },
} new GridContainer // used for max width implementation
}, {
RelativeSizeAxes = Axes.Both,
ColumnDimensions = new[]
{
new Dimension(GridSizeMode.Relative, 0.5f, maxSize: 650),
}, },
Content = new[]
{
new Drawable[]
{
new Container
{
Origin = Anchor.BottomLeft,
Anchor = Anchor.BottomLeft,
RelativeSizeAxes = Axes.Both,
Children = new Drawable[]
{
beatmapInfoWedge = new BeatmapInfoWedge beatmapInfoWedge = new BeatmapInfoWedge
{ {
Size = WEDGED_CONTAINER_SIZE, Height = WEDGE_HEIGHT,
RelativeSizeAxes = Axes.X, RelativeSizeAxes = Axes.X,
Margin = new MarginPadding Margin = new MarginPadding
{ {
@ -183,11 +183,29 @@ namespace osu.Game.Screens.Select
Right = left_area_padding, Right = left_area_padding,
}, },
}, },
new ResetScrollContainer(() => Carousel.ScrollToSelected()) new Container
{ {
RelativeSizeAxes = Axes.Y, RelativeSizeAxes = Axes.Both,
Width = 250, Padding = new MarginPadding
{
Bottom = Footer.HEIGHT,
Top = WEDGE_HEIGHT + left_area_padding,
Left = left_area_padding,
Right = left_area_padding * 2,
},
Child = BeatmapDetails = new BeatmapDetailArea
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Top = 10, Right = 5 },
},
},
} }
},
},
}
}
}
},
}); });
if (ShowFooter) if (ShowFooter)
@ -705,6 +723,29 @@ namespace osu.Game.Screens.Select
return base.OnKeyDown(e); return base.OnKeyDown(e);
} }
private class VerticalMaskingContainer : Container
{
private const float panel_overflow = 1.2f;
protected override Container<Drawable> Content { get; }
public VerticalMaskingContainer()
{
RelativeSizeAxes = Axes.Both;
Masking = true;
Anchor = Anchor.Centre;
Origin = Anchor.Centre;
Width = panel_overflow; //avoid horizontal masking so the panels don't clip when screen stack is pushed.
InternalChild = Content = new Container
{
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Width = 1 / panel_overflow,
};
}
}
private class ResetScrollContainer : Container private class ResetScrollContainer : Container
{ {
private readonly Action onHoverAction; private readonly Action onHoverAction;