Fix skin editor not accounting for aspect ratios in base-game sizing logic

osu.Game/Screens/Edit/Components/EditorSidebar.cs

@@ -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[]

osu.Game/Skinning/Editor/SkinEditor.cs

@@ -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

osu.Game/Skinning/Editor/SkinEditorOverlay.cs

@@ -4,14 +4,17 @@
 using System.Diagnostics;
 using JetBrains.Annotations;
 using osu.Framework.Allocation;
+using osu.Framework.Extensions.EnumExtensions;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Primitives;
 using osu.Framework.Input.Bindings;
 using osu.Framework.Input.Events;
+using osu.Framework.Layout;
 using osu.Game.Graphics.Containers;
 using osu.Game.Input.Bindings;
 using osu.Game.Screens;
+using osu.Game.Screens.Edit.Components;
 
 namespace osu.Game.Skinning.Editor
 {
@@ -81,15 +84,37 @@ namespace osu.Game.Skinning.Editor
 
         protected override void PopOut() => skinEditor?.Hide();
 
+        protected override bool OnInvalidate(Invalidation invalidation, InvalidationSource source)
+        {
+            if (invalidation.HasFlagFast(Invalidation.DrawSize))
+                Scheduler.AddOnce(updateScreenSizing);
+
+            return base.OnInvalidate(invalidation, source);
+        }
+
+        private void updateScreenSizing()
+        {
+            if (skinEditor?.State.Value != Visibility.Visible) return;
+
+            float relativeSidebarWidth = EditorSidebar.WIDTH / DrawWidth;
+            float relativeToolbarHeight = (SkinEditorSceneLibrary.HEIGHT + SkinEditor.MENU_HEIGHT) / DrawHeight;
+
+            var rect = new RectangleF(
+                relativeSidebarWidth,
+                relativeToolbarHeight,
+                1 - relativeSidebarWidth * 2,
+                1f - relativeToolbarHeight);
+
+            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();

osu.Game/Skinning/Editor/SkinEditorSceneLibrary.cs

@@ -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]