some example

2025-11-14 17:16:09 -05:00
parent 36010381c2
commit 42ab82381d
6 changed files with 1092 additions and 0 deletions
--- a/examples/input_handling.lua
+++ b/examples/input_handling.lua
@@ -0,0 +1,232 @@
+-- Example: Input Handling System
+-- This demonstrates how to handle various input events in FlexLove
+
+local FlexLove = require("libs.FlexLove")
+
+local InputExample = {}
+
+function InputExample:new()
+    local obj = {
+        -- State variables for input handling example
+        mousePosition = { x = 0, y = 0 },
+        keyPressed = "",
+        touchPosition = { x = 0, y = 0 },
+        isMouseOver = false,
+        hoverCount = 0
+    }
+    setmetatable(obj, {__index = self})
+    return obj
+end
+
+function InputExample:render()
+    local flex = FlexLove.new({
+        x = "10%",
+        y = "10%",
+        width = "80%",
+        height = "80%",
+        positioning = "flex",
+        flexDirection = "vertical",
+        gap = 10,
+        padding = { horizontal = 10, vertical = 10 },
+    })
+    
+    -- Title
+    FlexLove.new({
+        parent = flex,
+        text = "Input Handling System Example",
+        textAlign = "center",
+        textSize = "2xl",
+        width = "100%",
+        height = "10%",
+    })
+    
+    -- Mouse interaction section
+    local mouseSection = FlexLove.new({
+        parent = flex,
+        positioning = "flex",
+        flexDirection = "horizontal",
+        justifyContent = "space-between",
+        alignItems = "center",
+        width = "100%",
+        height = "20%",
+        backgroundColor = "#2d3748",
+        borderRadius = 8,
+        padding = { horizontal = 15 },
+    })
+    
+    FlexLove.new({
+        parent = mouseSection,
+        text = "Mouse Position: (" .. self.mousePosition.x .. ", " .. self.mousePosition.y .. ")",
+        textAlign = "left",
+        textSize = "md",
+        width = "60%",
+    })
+    
+    -- Hoverable area
+    local hoverArea = FlexLove.new({
+        parent = mouseSection,
+        positioning = "flex",
+        justifyContent = "center",
+        alignItems = "center",
+        width = "30%",
+        height = "100%",
+        backgroundColor = "#4a5568",
+        borderRadius = 8,
+        padding = { horizontal = 10 },
+        onEvent = function(_, event)
+            if event.type == "mousemoved" then
+                self.mousePosition.x = event.x
+                self.mousePosition.y = event.y
+            elseif event.type == "mouseenter" then
+                self.isMouseOver = true
+                self.hoverCount = self.hoverCount + 1
+            elseif event.type == "mouseleave" then
+                self.isMouseOver = false
+            end
+        end,
+    })
+    
+    FlexLove.new({
+        parent = hoverArea,
+        text = "Hover over me!",
+        textAlign = "center",
+        textSize = "md",
+        width = "100%",
+        height = "100%",
+        color = self.isMouseOver and "#48bb78" or "#a0aec0",  -- Green when hovered
+    })
+    
+    -- Keyboard input section
+    local keyboardSection = FlexLove.new({
+        parent = flex,
+        positioning = "flex",
+        flexDirection = "horizontal",
+        justifyContent = "space-between",
+        alignItems = "center",
+        width = "100%",
+        height = "20%",
+        backgroundColor = "#4a5568",
+        borderRadius = 8,
+        padding = { horizontal = 15 },
+    })
+    
+    FlexLove.new({
+        parent = keyboardSection,
+        text = "Last Key Pressed: " .. (self.keyPressed or "None"),
+        textAlign = "left",
+        textSize = "md",
+        width = "60%",
+    })
+    
+    -- Input field for typing
+    local inputField = FlexLove.new({
+        parent = keyboardSection,
+        themeComponent = "inputv2",
+        text = "",
+        textAlign = "left",
+        textSize = "md",
+        width = "30%",
+        onEvent = function(_, event)
+            if event.type == "textinput" then
+                self.keyPressed = event.text
+            elseif event.type == "keypressed" then
+                self.keyPressed = event.key
+            end
+        end,
+    })
+    
+    -- Touch input section
+    local touchSection = FlexLove.new({
+        parent = flex,
+        positioning = "flex",
+        flexDirection = "horizontal",
+        justifyContent = "space-between",
+        alignItems = "center",
+        width = "100%",
+        height = "20%",
+        backgroundColor = "#2d3748",
+        borderRadius = 8,
+        padding = { horizontal = 15 },
+    })
+    
+    FlexLove.new({
+        parent = touchSection,
+        text = "Touch Position: (" .. self.touchPosition.x .. ", " .. self.touchPosition.y .. ")",
+        textAlign = "left",
+        textSize = "md",
+        width = "60%",
+    })
+    
+    -- Touchable area
+    local touchArea = FlexLove.new({
+        parent = touchSection,
+        positioning = "flex",
+        justifyContent = "center",
+        alignItems = "center",
+        width = "30%",
+        height = "100%",
+        backgroundColor = "#4a5568",
+        borderRadius = 8,
+        padding = { horizontal = 10 },
+        onEvent = function(_, event)
+            if event.type == "touch" then
+                self.touchPosition.x = event.x
+                self.touchPosition.y = event.y
+            end
+        end,
+    })
+    
+    FlexLove.new({
+        parent = touchArea,
+        text = "Touch me!",
+        textAlign = "center",
+        textSize = "md",
+        width = "100%",
+        height = "100%",
+    })
+    
+    -- Status section showing interaction counts
+    local statusSection = FlexLove.new({
+        parent = flex,
+        positioning = "flex",
+        flexDirection = "horizontal",
+        justifyContent = "space-between",
+        alignItems = "center",
+        width = "100%",
+        height = "20%",
+        backgroundColor = "#4a5568",
+        borderRadius = 8,
+        padding = { horizontal = 15 },
+    })
+    
+    FlexLove.new({
+        parent = statusSection,
+        text = "Hover Count: " .. self.hoverCount,
+        textAlign = "left",
+        textSize = "md",
+        width = "30%",
+    })
+    
+    -- Reset button
+    FlexLove.new({
+        parent = statusSection,
+        themeComponent = "buttonv2",
+        text = "Reset All",
+        textAlign = "center",
+        width = "30%",
+        onEvent = function(_, event)
+            if event.type == "release" then
+                self.mousePosition = { x = 0, y = 0 }
+                self.keyPressed = ""
+                self.touchPosition = { x = 0, y = 0 }
+                self.hoverCount = 0
+                self.isMouseOver = false
+                print("All input states reset")
+            end
+        end,
+    })
+    
+    return flex
+end
+
+return InputExample