From 8136d2823f5f5c573c571d50738a4fd3f66c0d8b Mon Sep 17 00:00:00 2001
From: ScottLongley <scott.elongley@gmail.com>
Date: Fri, 20 Aug 2021 22:49:46 +1000
Subject: [PATCH 1/3] Add margin to TilesPanel tile

---
 Source/Engine/UI/GUI/Panels/GridPanel.cs  | 12 ++++----
 Source/Engine/UI/GUI/Panels/TilesPanel.cs | 36 ++++++++++++++++++++---
 2 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/Source/Engine/UI/GUI/Panels/GridPanel.cs b/Source/Engine/UI/GUI/Panels/GridPanel.cs
index 1a0e69338..65119d8d1 100644
--- a/Source/Engine/UI/GUI/Panels/GridPanel.cs
+++ b/Source/Engine/UI/GUI/Panels/GridPanel.cs
@@ -93,28 +93,28 @@ namespace FlaxEngine.GUI
 
             int i = 0;
             Vector2 upperLeft = Vector2.Zero;
-            float reamingHeight = Height;
+            float remainingHeight = Height;
             for (int rowIndex = 0; rowIndex < _cellsV.Length; rowIndex++)
             {
                 upperLeft.X = 0;
-                float cellHeight = _cellsV[rowIndex] * reamingHeight;
+                float cellHeight = _cellsV[rowIndex] * remainingHeight;
                 if (_cellsV[rowIndex] < 0)
                 {
                     cellHeight = -_cellsV[rowIndex];
-                    reamingHeight -= cellHeight;
+                    remainingHeight -= cellHeight;
                 }
 
-                float reamingWidth = Width;
+                float remainingWidth = Width;
                 for (int columnIndex = 0; columnIndex < _cellsH.Length; columnIndex++)
                 {
                     if (i >= ChildrenCount)
                         break;
 
-                    float cellWidth = _cellsH[columnIndex] * reamingWidth;
+                    float cellWidth = _cellsH[columnIndex] * remainingWidth;
                     if (_cellsH[columnIndex] < 0)
                     {
                         cellWidth = -_cellsH[columnIndex];
-                        reamingWidth -= cellWidth;
+                        remainingWidth -= cellWidth;
                     }
 
                     var slotBounds = new Rectangle(upperLeft, cellWidth, cellHeight);
diff --git a/Source/Engine/UI/GUI/Panels/TilesPanel.cs b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
index c201c05ab..43fc59fee 100644
--- a/Source/Engine/UI/GUI/Panels/TilesPanel.cs
+++ b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
@@ -10,9 +10,27 @@ namespace FlaxEngine.GUI
     /// <seealso cref="FlaxEngine.GUI.ContainerControl" />
     public class TilesPanel : ContainerControl
     {
+        private Margin _tileMargin;
         private Vector2 _tileSize = new Vector2(64);
         private bool _autoResize = false;
 
+        /// <summary>
+        /// Gets or sets the margin applied to each tile.
+        /// </summary>
+        [EditorOrder(0), Tooltip("The margin applied to each tile.")]
+        public Margin TileMargin
+        {
+            get => _tileMargin;
+            set
+            {
+                if (_tileMargin != value)
+                {
+                    _tileMargin = value;
+                    PerformLayout();
+                }
+            }
+        }
+
         /// <summary>
         /// Gets or sets the size of the tile.
         /// </summary>
@@ -54,7 +72,17 @@ namespace FlaxEngine.GUI
         /// Initializes a new instance of the <see cref="TilesPanel"/> class.
         /// </summary>
         public TilesPanel()
+        : this(2)
         {
+        }
+
+        /// <summary>
+        /// Initializes a new instance of the <see cref="TilesPanel"/> class.
+        /// </summary>
+        /// <param name="tileMargin">The tile margin.</param>
+        public TilesPanel(float tileMargin)
+        {
+            TileMargin = new Margin(tileMargin);
             AutoFocus = false;
         }
 
@@ -83,15 +111,15 @@ namespace FlaxEngine.GUI
 
                 c.Bounds = new Rectangle(x, y, itemsWidth, itemsHeight);
 
-                x += itemsWidth;
-                if (x + itemsWidth > width)
+                x += itemsWidth + TileMargin.Width;
+                if (x + itemsWidth + TileMargin.Width > width)
                 {
                     x = 0;
-                    y += itemsHeight;
+                    y += itemsHeight + TileMargin.Height;
                 }
             }
             if (x > 0)
-                y += itemsHeight;
+                y += itemsHeight + TileMargin.Height;
 
             if (_autoResize)
             {

From 96f4f676e4667ccd2e765a9560ae0caae226278d Mon Sep 17 00:00:00 2001
From: ScottLongley <scott.elongley@gmail.com>
Date: Mon, 23 Aug 2021 22:06:28 +1000
Subject: [PATCH 2/3] Bounds fix

---
 Source/Engine/UI/GUI/Panels/TilesPanel.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Source/Engine/UI/GUI/Panels/TilesPanel.cs b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
index 43fc59fee..8d35396b6 100644
--- a/Source/Engine/UI/GUI/Panels/TilesPanel.cs
+++ b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
@@ -109,7 +109,7 @@ namespace FlaxEngine.GUI
             {
                 var c = _children[i];
 
-                c.Bounds = new Rectangle(x, y, itemsWidth, itemsHeight);
+                c.Bounds = new Rectangle(x + TileMargin.Left, y + TileMargin.Top, itemsWidth + TileMargin.Width, itemsHeight + TileMargin.Height);
 
                 x += itemsWidth + TileMargin.Width;
                 if (x + itemsWidth + TileMargin.Width > width)

From b8c82ec47d0bda15c541076a7f40783ac87cb039 Mon Sep 17 00:00:00 2001
From: ScottLongley <scott.elongley@gmail.com>
Date: Mon, 23 Aug 2021 22:17:54 +1000
Subject: [PATCH 3/3] Bounds fix 2

---
 Source/Engine/UI/GUI/Panels/TilesPanel.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Source/Engine/UI/GUI/Panels/TilesPanel.cs b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
index 8d35396b6..d3e29fabe 100644
--- a/Source/Engine/UI/GUI/Panels/TilesPanel.cs
+++ b/Source/Engine/UI/GUI/Panels/TilesPanel.cs
@@ -109,7 +109,7 @@ namespace FlaxEngine.GUI
             {
                 var c = _children[i];
 
-                c.Bounds = new Rectangle(x + TileMargin.Left, y + TileMargin.Top, itemsWidth + TileMargin.Width, itemsHeight + TileMargin.Height);
+                c.Bounds = new Rectangle(x + TileMargin.Left, y + TileMargin.Top, itemsWidth, itemsHeight);
 
                 x += itemsWidth + TileMargin.Width;
                 if (x + itemsWidth + TileMargin.Width > width)