1
0
mirror of https://github.com/ppy/osu.git synced 2024-12-15 21:03:08 +08:00

Merge pull request #18587 from peppy/skin-editor-fix-sizing

Fix skin editor not accounting for aspect ratios in base-game sizing logic
This commit is contained in:
Dan Balasescu 2022-06-07 13:19:50 +09:00 committed by GitHub
commit 561a932d17
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 54 additions and 16 deletions

View File

@ -21,7 +21,7 @@ namespace osu.Game.Graphics.Containers
/// </summary>
public class ScalingContainer : Container
{
private const float duration = 500;
internal const float TRANSITION_DURATION = 500;
private Bindable<float> sizeX;
private Bindable<float> sizeY;
@ -99,7 +99,7 @@ namespace osu.Game.Graphics.Containers
if (applyUIScale)
{
uiScale = osuConfig.GetBindable<float>(OsuSetting.UIScale);
uiScale.BindValueChanged(args => this.TransformTo(nameof(CurrentScale), args.NewValue, duration, Easing.OutQuart), true);
uiScale.BindValueChanged(args => this.TransformTo(nameof(CurrentScale), args.NewValue, TRANSITION_DURATION, Easing.OutQuart), true);
}
}
@ -163,10 +163,10 @@ namespace osu.Game.Graphics.Containers
backgroundStack.Push(new ScalingBackgroundScreen());
}
backgroundStack.FadeIn(duration);
backgroundStack.FadeIn(TRANSITION_DURATION);
}
else
backgroundStack?.FadeOut(duration);
backgroundStack?.FadeOut(TRANSITION_DURATION);
}
RectangleF targetRect = new RectangleF(Vector2.Zero, Vector2.One);
@ -195,13 +195,13 @@ namespace osu.Game.Graphics.Containers
if (requiresMasking)
sizableContainer.Masking = true;
sizableContainer.MoveTo(targetRect.Location, duration, Easing.OutQuart);
sizableContainer.ResizeTo(targetRect.Size, duration, Easing.OutQuart);
sizableContainer.MoveTo(targetRect.Location, TRANSITION_DURATION, Easing.OutQuart);
sizableContainer.ResizeTo(targetRect.Size, TRANSITION_DURATION, Easing.OutQuart);
// Of note, this will not work great in the case of nested ScalingContainers where multiple are applying corner radius.
// Masking and corner radius should likely only be applied at one point in the full game stack to fix this.
// An example of how this can occur is when the skin editor is visible and the game screen scaling is set to "Everything".
sizableContainer.TransformTo(nameof(CornerRadius), requiresMasking ? corner_radius : 0, duration, requiresMasking ? Easing.OutQuart : Easing.None)
sizableContainer.TransformTo(nameof(CornerRadius), requiresMasking ? corner_radius : 0, TRANSITION_DURATION, requiresMasking ? Easing.OutQuart : Easing.None)
.OnComplete(_ => { sizableContainer.Masking = requiresMasking; });
}

View File

@ -16,13 +16,15 @@ namespace osu.Game.Screens.Edit.Components
/// </summary>
internal class EditorSidebar : Container<EditorSidebarSection>
{
public const float WIDTH = 250;
private readonly Box background;
protected override Container<EditorSidebarSection> Content { get; }
public EditorSidebar()
{
Width = 250;
Width = WIDTH;
RelativeSizeAxes = Axes.Y;
InternalChildren = new Drawable[]

View File

@ -29,6 +29,8 @@ namespace osu.Game.Skinning.Editor
{
public const double TRANSITION_DURATION = 500;
public const float MENU_HEIGHT = 40;
public readonly BindableList<ISkinnableDrawable> SelectedComponents = new BindableList<ISkinnableDrawable>();
protected override bool StartHidden => true;
@ -78,8 +80,6 @@ namespace osu.Game.Skinning.Editor
{
RelativeSizeAxes = Axes.Both;
const float menu_height = 40;
InternalChild = new OsuContextMenuContainer
{
RelativeSizeAxes = Axes.Both,
@ -102,7 +102,7 @@ namespace osu.Game.Skinning.Editor
Name = "Menu container",
RelativeSizeAxes = Axes.X,
Depth = float.MinValue,
Height = menu_height,
Height = MENU_HEIGHT,
Children = new Drawable[]
{
new EditorMenuBar
@ -322,7 +322,10 @@ namespace osu.Game.Skinning.Editor
protected override void PopIn()
{
this.FadeIn(TRANSITION_DURATION, Easing.OutQuint);
this
// align animation to happen after the majority of the ScalingContainer animation completes.
.Delay(ScalingContainer.TRANSITION_DURATION * 0.3f)
.FadeIn(TRANSITION_DURATION, Easing.OutQuint);
}
protected override void PopOut()

View File

@ -12,6 +12,8 @@ using osu.Framework.Input.Events;
using osu.Game.Graphics.Containers;
using osu.Game.Input.Bindings;
using osu.Game.Screens;
using osu.Game.Screens.Edit.Components;
using osuTK;
namespace osu.Game.Skinning.Editor
{
@ -33,6 +35,8 @@ namespace osu.Game.Skinning.Editor
private OsuScreen lastTargetScreen;
private Vector2 lastDrawSize;
public SkinEditorOverlay(ScalingContainer scalingContainer)
{
this.scalingContainer = scalingContainer;
@ -81,15 +85,42 @@ namespace osu.Game.Skinning.Editor
protected override void PopOut() => skinEditor?.Hide();
protected override void Update()
{
base.Update();
if (game.DrawSize != lastDrawSize)
{
lastDrawSize = game.DrawSize;
updateScreenSizing();
}
}
private void updateScreenSizing()
{
if (skinEditor?.State.Value != Visibility.Visible) return;
const float padding = 10;
float relativeSidebarWidth = (EditorSidebar.WIDTH + padding) / DrawWidth;
float relativeToolbarHeight = (SkinEditorSceneLibrary.HEIGHT + SkinEditor.MENU_HEIGHT + padding) / DrawHeight;
var rect = new RectangleF(
relativeSidebarWidth,
relativeToolbarHeight,
1 - relativeSidebarWidth * 2,
1f - relativeToolbarHeight - padding / DrawHeight);
scalingContainer.SetCustomRect(rect, true);
}
private void updateComponentVisibility()
{
Debug.Assert(skinEditor != null);
const float toolbar_padding_requirement = 0.18f;
if (skinEditor.State.Value == Visibility.Visible)
{
scalingContainer.SetCustomRect(new RectangleF(toolbar_padding_requirement, 0.2f, 0.8f - toolbar_padding_requirement, 0.7f), true);
Scheduler.AddOnce(updateScreenSizing);
game?.Toolbar.Hide();
game?.CloseAllOverlays();

View File

@ -27,6 +27,8 @@ namespace osu.Game.Skinning.Editor
{
public class SkinEditorSceneLibrary : CompositeDrawable
{
public const float HEIGHT = BUTTON_HEIGHT + padding * 2;
public const float BUTTON_HEIGHT = 40;
private const float padding = 10;
@ -42,7 +44,7 @@ namespace osu.Game.Skinning.Editor
public SkinEditorSceneLibrary()
{
Height = BUTTON_HEIGHT + padding * 2;
Height = HEIGHT;
}
[BackgroundDependencyLoader]