added the option to auto-scale both the camera and ui systems

Demos/UiDemo.cs

@@ -58,12 +58,16 @@ namespace Demos {
             this.UiSystem.Style = style;
             // scale every ui up by 5
             this.UiSystem.GlobalScale = 5;
+            // set the ui system to automatically scale with screen size
+            // this will cause all ui elements to be scaled based on the reference resolution (AutoScaleReferenceSize)
+            // by default, the reference resolution is set to the initial screen size, however this value can be changed through the ui system
+            this.UiSystem.AutoScaleWithScreen = true;
 
             // create the root panel that all the other components sit on and add it to the ui system
             var root = new Panel(Anchor.Center, new Vector2(80, 100), Vector2.Zero, false, true, new Point(5, 10));
             this.UiSystem.Add("Test", root);
 
-            root.AddChild(new Paragraph(Anchor.AutoLeft, 1, "This is a small demo for MLEM.Ui, a user interface library that is part of (M)LEM (L)ibrary by (E)llpeck for (M)onoGame."){LineSpace = 1.5F});
+            root.AddChild(new Paragraph(Anchor.AutoLeft, 1, "This is a small demo for MLEM.Ui, a user interface library that is part of (M)LEM (L)ibrary by (E)llpeck for (M)onoGame.") {LineSpace = 1.5F});
             var image = root.AddChild(new Image(Anchor.AutoCenter, new Vector2(50, 50), new TextureRegion(this.testTexture, 0, 0, 8, 8)) {IsHidden = true, Padding = new Point(3)});
             // Setting the x or y coordinate of the size to 1 or a lower number causes the width or height to be a percentage of the parent's width or height
             // (for example, setting the size's x to 0.75 would make the element's width be 0.75*parentWidth)

MLEM.Ui/UiSystem.cs

@@ -17,9 +17,16 @@ namespace MLEM.Ui {
         public readonly InputHandler InputHandler;
         private readonly bool isInputOurs;
 
+        public bool AutoScaleWithScreen;
+        public Point AutoScaleReferenceSize;
+
         private float globalScale = 1;
         public float GlobalScale {
-            get => this.globalScale;
+            get {
+                if (!this.AutoScaleWithScreen)
+                    return this.globalScale;
+                return Math.Min(this.Viewport.Width / (float) this.AutoScaleReferenceSize.X, this.Viewport.Height / (float) this.AutoScaleReferenceSize.Y) * this.globalScale;
+            }
             set {
                 this.globalScale = value;
                 foreach (var root in this.rootElements)
@@ -49,6 +56,7 @@ namespace MLEM.Ui {
             this.isInputOurs = inputHandler == null;
             this.style = style;
             this.Viewport = device.Viewport.Bounds;
+            this.AutoScaleReferenceSize = this.Viewport.Size;
 
             window.ClientSizeChanged += (sender, args) => {
                 this.Viewport = device.Viewport.Bounds;

MLEM/Cameras/Camera.cs

@@ -1,3 +1,4 @@
+using System;
 using Microsoft.Xna.Framework;
 using Microsoft.Xna.Framework.Graphics;
 using MLEM.Extensions;
@@ -7,12 +8,22 @@ namespace MLEM.Cameras {
 
         public Vector2 Position;
         public float Scale;
+        public bool AutoScaleWithScreen;
+        public Point AutoScaleReferenceSize;
+        public float ActualScale {
+            get {
+                if (!this.AutoScaleWithScreen)
+                    return this.Scale;
+                return Math.Min(this.Viewport.Width / (float) this.AutoScaleReferenceSize.X, this.Viewport.Height / (float) this.AutoScaleReferenceSize.Y) * this.Scale;
+            }
+        }
         public Matrix ViewMatrix {
             get {
-                var pos = -this.Position * this.Scale;
+                var sc = this.ActualScale;
+                var pos = -this.Position * sc;
                 if (this.roundPosition)
                     pos = pos.Floor();
-                return Matrix.CreateScale(this.Scale, this.Scale, 1) * Matrix.CreateTranslation(new Vector3(pos, 0));
+                return Matrix.CreateScale(sc, sc, 1) * Matrix.CreateTranslation(new Vector3(pos, 0));
             }
         }
         public Vector2 Max {
@@ -23,14 +34,15 @@ namespace MLEM.Cameras {
             get => this.Position + this.ScaledViewport / 2;
             set => this.Position = value - this.ScaledViewport / 2;
         }
-        public Viewport Viewport => this.graphicsDevice.Viewport;
+        public Rectangle Viewport => this.graphicsDevice.Viewport.Bounds;
-        public Vector2 ScaledViewport => new Vector2(this.Viewport.Width, this.Viewport.Height) / this.Scale;
+        public Vector2 ScaledViewport => new Vector2(this.Viewport.Width, this.Viewport.Height) / this.ActualScale;
 
         private readonly bool roundPosition;
         private readonly GraphicsDevice graphicsDevice;
 
         public Camera(GraphicsDevice graphicsDevice, bool roundPosition = true) {
             this.graphicsDevice = graphicsDevice;
+            this.AutoScaleReferenceSize = this.Viewport.Size;
             this.roundPosition = roundPosition;
         }