simplified grid implementation

examples/SimpleGrid.lua

@@ -0,0 +1,236 @@
+-- Example demonstrating the simplified grid layout system
+-- Shows how to create grids with simple row/column counts
+
+package.path = package.path .. ";?.lua"
+require("testing/loveStub")
+local FlexLove = require("FlexLove")
+local Gui = FlexLove.GUI
+local Color = FlexLove.Color
+local enums = FlexLove.enums
+
+print("=== Simplified Grid Layout Examples ===\n")
+
+-- Example 1: Simple 3x2 grid
+print("1. Simple 3x2 Grid")
+print("   Grid with 3 columns and 2 rows")
+
+local grid1 = Gui.new({
+  x = 50,
+  y = 50,
+  width = 600,
+  height = 400,
+  positioning = enums.Positioning.GRID,
+  gridRows = 2,
+  gridColumns = 3,
+  columnGap = 10,
+  rowGap = 10,
+  background = Color.new(0.9, 0.9, 0.9, 1),
+  padding = { horizontal = 20, vertical = 20 },
+})
+
+-- Add grid items - they auto-tile in order
+for i = 1, 6 do
+  Gui.new({
+    parent = grid1,
+    background = Color.new(0.2, 0.5, 0.8, 1),
+    text = "Item " .. i,
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+print("   Grid container: 600x400, 3 columns, 2 rows")
+print("   Column gap: 10px, Row gap: 10px")
+print("   Items: 6 items auto-tiled in order\n")
+
+-- Example 2: Square grid (4x4)
+print("2. Square Grid (4x4)")
+print("   Perfect for icon grids or game boards")
+
+Gui.destroy()
+local grid2 = Gui.new({
+  x = 50,
+  y = 50,
+  width = 400,
+  height = 400,
+  positioning = enums.Positioning.GRID,
+  gridRows = 4,
+  gridColumns = 4,
+  columnGap = 5,
+  rowGap = 5,
+  background = Color.new(0.9, 0.9, 0.9, 1),
+  padding = { horizontal = 10, vertical = 10 },
+})
+
+for i = 1, 16 do
+  Gui.new({
+    parent = grid2,
+    background = Color.new(0.3, 0.6, 0.3, 1),
+    text = tostring(i),
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+print("   16 items in a 4x4 grid")
+print("   Each cell is equal size\n")
+
+-- Example 3: Horizontal strip (1 row, multiple columns)
+print("3. Horizontal Strip")
+print("   Single row with multiple columns")
+
+Gui.destroy()
+local grid3 = Gui.new({
+  x = 50,
+  y = 50,
+  width = 800,
+  height = 100,
+  positioning = enums.Positioning.GRID,
+  gridRows = 1,
+  gridColumns = 5,
+  columnGap = 10,
+  rowGap = 0,
+  background = Color.new(0.9, 0.9, 0.9, 1),
+  padding = { horizontal = 10, vertical = 10 },
+})
+
+local labels = { "Home", "Products", "About", "Contact", "Login" }
+for i = 1, 5 do
+  Gui.new({
+    parent = grid3,
+    background = Color.new(0.3, 0.3, 0.8, 1),
+    text = labels[i],
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+print("   Perfect for navigation bars\n")
+
+-- Example 4: Vertical strip (multiple rows, 1 column)
+print("4. Vertical Strip")
+print("   Single column with multiple rows")
+
+Gui.destroy()
+local grid4 = Gui.new({
+  x = 50,
+  y = 50,
+  width = 200,
+  height = 500,
+  positioning = enums.Positioning.GRID,
+  gridRows = 5,
+  gridColumns = 1,
+  columnGap = 0,
+  rowGap = 10,
+  background = Color.new(0.9, 0.9, 0.9, 1),
+  padding = { horizontal = 10, vertical = 10 },
+})
+
+for i = 1, 5 do
+  Gui.new({
+    parent = grid4,
+    background = Color.new(0.5, 0.3, 0.7, 1),
+    text = "Option " .. i,
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+print("   Perfect for sidebar menus\n")
+
+-- Example 5: Nested grids
+print("5. Nested Grids")
+print("   Grid containers within grid cells")
+
+Gui.destroy()
+local outerGrid = Gui.new({
+  x = 50,
+  y = 50,
+  width = 600,
+  height = 400,
+  positioning = enums.Positioning.GRID,
+  gridRows = 2,
+  gridColumns = 2,
+  columnGap = 10,
+  rowGap = 10,
+  background = Color.new(0.85, 0.85, 0.85, 1),
+  padding = { horizontal = 10, vertical = 10 },
+})
+
+-- Top-left: Simple item
+Gui.new({
+  parent = outerGrid,
+  background = Color.new(0.5, 0.3, 0.7, 1),
+  text = "Single Item",
+  textColor = Color.new(1, 1, 1, 1),
+  textAlign = enums.TextAlign.CENTER,
+})
+
+-- Top-right: Nested 2x2 grid
+local nestedGrid1 = Gui.new({
+  parent = outerGrid,
+  positioning = enums.Positioning.GRID,
+  gridRows = 2,
+  gridColumns = 2,
+  columnGap = 5,
+  rowGap = 5,
+  background = Color.new(0.7, 0.7, 0.7, 1),
+  padding = { horizontal = 5, vertical = 5 },
+})
+
+for i = 1, 4 do
+  Gui.new({
+    parent = nestedGrid1,
+    background = Color.new(0.3, 0.6, 0.9, 1),
+    text = "A" .. i,
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+-- Bottom-left: Nested 1x3 grid
+local nestedGrid2 = Gui.new({
+  parent = outerGrid,
+  positioning = enums.Positioning.GRID,
+  gridRows = 1,
+  gridColumns = 3,
+  columnGap = 5,
+  rowGap = 5,
+  background = Color.new(0.7, 0.7, 0.7, 1),
+  padding = { horizontal = 5, vertical = 5 },
+})
+
+for i = 1, 3 do
+  Gui.new({
+    parent = nestedGrid2,
+    background = Color.new(0.9, 0.6, 0.3, 1),
+    text = "B" .. i,
+    textColor = Color.new(1, 1, 1, 1),
+    textAlign = enums.TextAlign.CENTER,
+  })
+end
+
+-- Bottom-right: Another simple item
+Gui.new({
+  parent = outerGrid,
+  background = Color.new(0.3, 0.7, 0.5, 1),
+  text = "Another Item",
+  textColor = Color.new(1, 1, 1, 1),
+  textAlign = enums.TextAlign.CENTER,
+})
+
+print("   Outer grid: 2x2 layout")
+print("   Top-right: 2x2 nested grid")
+print("   Bottom-left: 1x3 nested grid\n")
+
+print("=== Summary ===")
+print("The simplified grid system provides:")
+print("• Simple API: Just set gridRows and gridColumns")
+print("• Auto-tiling: Children are placed in order automatically")
+print("• Equal sizing: All cells are equal size")
+print("• Gaps: Use columnGap and rowGap for spacing")
+print("• Stretch: Children stretch to fill cells by default")
+print("• Nesting: Grids can contain other grids")
+print("\nNo need for complex track definitions, explicit placement, or spans!")
+
+Gui.destroy()