Use a scissor rectangle for panels in favor of a render target, and marked UiSystem.DrawEarly and Element.DrawEarly as obsolete

CHANGELOG.md

@@ -35,12 +35,14 @@ Improvements
 - Avoid unnecessary panel updates by using an Epsilon comparison when scrolling children
 - Allow setting a default text alignment for paragraphs in UiStyle
 - Made custom values of Element.Style persist when a new ui style is set
+- Use a scissor rectangle for panels in favor of a render target
 
 Fixes
 - Fixed paragraph links having incorrect hover locations when using special text alignments
 
 Removals
 - Marked StyleProp equality members as obsolete
+- Marked UiSystem.DrawEarly and Element.DrawEarly as obsolete
 
 ### MLEM.Extended
 Improvements

MLEM.Startup/MlemGame.cs

@@ -114,7 +114,6 @@ namespace MLEM.Startup {
             this.PreDraw?.Invoke(this, gameTime);
             CoroutineHandler.RaiseEvent(CoroutineEvents.PreDraw);
 
-            this.UiSystem.DrawEarly(gameTime, this.SpriteBatch);
             this.DoDraw(gameTime);
             this.UiSystem.Draw(gameTime, this.SpriteBatch);
 

MLEM.Ui/Elements/Element.cs

@@ -924,6 +924,7 @@ namespace MLEM.Ui.Elements {
         public void DrawTransformed(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) {
             var customDraw = this.BeginImpl != null || this.Transform != Matrix.Identity;
             var mat = this.Transform * matrix;
+            // TODO ending and beginning again when the matrix changes isn't ideal (https://github.com/MonoGame/MonoGame/issues/3156)
             if (customDraw) {
                 // end the usual draw so that we can begin our own
                 batch.End();
@@ -984,6 +985,7 @@ namespace MLEM.Ui.Elements {
         /// <param name="effect">The effect that is used for drawing</param>
         /// <param name="depthStencilState">The depth stencil state that is used for drawing</param>
         /// <param name="matrix">The transformation matrix that is used for drawing</param>
+        [Obsolete("DrawEarly has been deprecated. There is no replacement, and all drawing code should be placed in Draw.")]
         public virtual void DrawEarly(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) {
             foreach (var child in this.GetRelevantChildren()) {
                 if (!child.IsHidden)

MLEM.Ui/Elements/Panel.cs

@@ -13,10 +13,15 @@ namespace MLEM.Ui.Elements {
     /// A panel element to be used inside of a <see cref="UiSystem"/>.
     /// The panel is a complex element that displays a box as a background to all of its child elements.
     /// Additionally, a panel can be set to <see cref="scrollOverflow"/> on construction, which causes all elements that don't fit into the panel to be hidden until scrolled to using a <see cref="ScrollBar"/>.
-    /// As this behavior is accomplished using a <see cref="RenderTarget2D"/>, scrolling panels need to have their <see cref="DrawEarly"/> methods called using <see cref="UiSystem.DrawEarly"/>.
     /// </summary>
     public class Panel : Element {
 
+        private static readonly RasterizerState ScissorRasterizer = new RasterizerState {
+            // use the default cull mode from SpriteBatch, but with scissor test enabled
+            CullMode = CullMode.CullCounterClockwiseFace,
+            ScissorTestEnable = true
+        };
+
         /// <summary>
         /// The scroll bar that this panel contains.
         /// This is only nonnull if <see cref="scrollOverflow"/> is true.
@@ -51,7 +56,6 @@ namespace MLEM.Ui.Elements {
         private readonly List<Element> relevantChildren = new List<Element>();
         private readonly bool scrollOverflow;
 
-        private RenderTarget2D renderTarget;
         private bool relevantChildrenDirty;
         private float scrollBarChildOffset;
 
@@ -170,44 +174,34 @@ namespace MLEM.Ui.Elements {
         public override void Draw(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) {
             if (this.Texture.HasValue())
                 batch.Draw(this.Texture, this.DisplayArea, this.DrawColor.OrDefault(Color.White) * alpha, this.Scale);
-            // if we handle overflow, draw using the render target in DrawUnbound
+            // if we handle overflow, draw using a scissor rectangle
-            if (!this.scrollOverflow || this.renderTarget == null) {
+            if (this.scrollOverflow) {
-                base.Draw(time, batch, alpha, blendState, samplerState, depthStencilState, effect, matrix);
+                this.UpdateAreaIfDirty();
-            } else {
-                // draw the actual render target (don't apply the alpha here because it's already drawn onto with alpha)
-                batch.Draw(this.renderTarget, this.GetRenderTargetArea(), Color.White);
-            }
-        }
 
-        /// <inheritdoc />
+                batch.End();
-        public override void DrawEarly(GameTime time, SpriteBatch batch, float alpha, BlendState blendState, SamplerState samplerState, DepthStencilState depthStencilState, Effect effect, Matrix matrix) {
+                batch.GraphicsDevice.ScissorRectangle = (Rectangle) this.GetInnerArea();
-            this.UpdateAreaIfDirty();
+
-            if (this.scrollOverflow && this.renderTarget != null) {
+                // do the usual draw, but with the scissor rectangle applied
-                // draw children onto the render target
+                batch.Begin(SpriteSortMode.Deferred, blendState, samplerState, depthStencilState, ScissorRasterizer, effect, matrix);
-                using (batch.GraphicsDevice.WithRenderTarget(this.renderTarget)) {
+                base.Draw(time, batch, alpha, blendState, samplerState, depthStencilState, effect, matrix);
-                    batch.GraphicsDevice.Clear(Color.Transparent);
+                batch.End();
-                    // offset children by the render target's location
+
-                    var area = this.GetRenderTargetArea();
+                batch.Begin(SpriteSortMode.Deferred, blendState, samplerState, depthStencilState, null, effect, matrix);
-                    var trans = Matrix.CreateTranslation(-area.X, -area.Y, 0);
+            } else {
-                    // do the usual draw, but within the render target
+                base.Draw(time, batch, alpha, blendState, samplerState, depthStencilState, effect, matrix);
-                    batch.Begin(SpriteSortMode.Deferred, blendState, samplerState, depthStencilState, null, effect, trans);
-                    base.Draw(time, batch, alpha, blendState, samplerState, depthStencilState, effect, trans);
-                    batch.End();
-                }
             }
-            base.DrawEarly(time, batch, alpha, blendState, samplerState, depthStencilState, effect, matrix);
         }
 
         /// <inheritdoc />
         public override Element GetElementUnderPos(Vector2 position) {
             // if overflow is handled, don't propagate mouse checks to hidden children
             var transformed = this.TransformInverse(position);
-            if (this.scrollOverflow && !this.GetRenderTargetArea().Contains(transformed))
+            if (this.scrollOverflow && !this.GetInnerArea().Contains(transformed))
                 return !this.IsHidden && this.CanBeMoused && this.DisplayArea.Contains(transformed) ? this : null;
             return base.GetElementUnderPos(position);
         }
 
-        private RectangleF GetRenderTargetArea() {
+        private RectangleF GetInnerArea() {
             var area = this.ChildPaddedArea;
             area.X = this.DisplayArea.X;
             area.Width = this.DisplayArea.Width;
@@ -258,26 +252,6 @@ namespace MLEM.Ui.Elements {
             // the scroller height has the same relation to the scroll bar height as the visible area has to the total height of the panel's content
             var scrollerHeight = Math.Min(this.ChildPaddedArea.Height / childrenHeight / this.Scale, 1) * this.ScrollBar.Area.Height;
             this.ScrollBar.ScrollerSize = new Vector2(this.ScrollerSize.Value.X, Math.Max(this.ScrollerSize.Value.Y, scrollerHeight));
-
-            // update the render target
-            var targetArea = (Rectangle) this.GetRenderTargetArea();
-            if (targetArea.Width <= 0 || targetArea.Height <= 0)
-                return;
-            if (this.renderTarget == null || targetArea.Width != this.renderTarget.Width || targetArea.Height != this.renderTarget.Height) {
-                if (this.renderTarget != null)
-                    this.renderTarget.Dispose();
-                this.renderTarget = targetArea.IsEmpty ? null : new RenderTarget2D(this.System.Game.GraphicsDevice, targetArea.Width, targetArea.Height);
-                this.relevantChildrenDirty = true;
-            }
-        }
-
-        /// <inheritdoc />
-        public override void Dispose() {
-            if (this.renderTarget != null) {
-                this.renderTarget.Dispose();
-                this.renderTarget = null;
-            }
-            base.Dispose();
         }
 
         private void SetScrollBarStyle() {
@@ -291,7 +265,7 @@ namespace MLEM.Ui.Elements {
         private void ForceUpdateRelevantChildren() {
             this.relevantChildrenDirty = false;
             this.relevantChildren.Clear();
-            var visible = this.GetRenderTargetArea();
+            var visible = this.GetInnerArea();
             foreach (var child in this.SortedChildren) {
                 if (child.Area.Intersects(visible)) {
                     this.relevantChildren.Add(child);

MLEM.Ui/UiSystem.cs

@@ -264,6 +264,7 @@ namespace MLEM.Ui {
         /// </summary>
         /// <param name="time">The game's time</param>
         /// <param name="batch">The sprite batch to use for drawing</param>
+        [Obsolete("DrawEarly has been deprecated. There is no replacement, so only Draw has to be called.")]
         public void DrawEarly(GameTime time, SpriteBatch batch) {
             this.Metrics.ResetDraws();
             this.Stopwatch.Restart();