diff --git a/Demos/UiDemo.cs b/Demos/UiDemo.cs index 5f7028e..f5fe287 100644 --- a/Demos/UiDemo.cs +++ b/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) diff --git a/MLEM.Ui/UiSystem.cs b/MLEM.Ui/UiSystem.cs index f623750..998e971 100644 --- a/MLEM.Ui/UiSystem.cs +++ b/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; diff --git a/MLEM/Cameras/Camera.cs b/MLEM/Cameras/Camera.cs index 26c472a..0c2a850 100644 --- a/MLEM/Cameras/Camera.cs +++ b/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 Vector2 ScaledViewport => new Vector2(this.Viewport.Width, this.Viewport.Height) / this.Scale; + public Rectangle Viewport => this.graphicsDevice.Viewport.Bounds; + 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; }