Mike/FlexLove
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes to run individual

Browse Source
This commit is contained in:
Michael Freno
2025-12-12 20:46:16 -05:00
parent 1d6ad6018f
commit e9b532b8f8
28 changed files with 508 additions and 951 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
examples/touch_demo.lua
View File

@@ -1,285 +0,0 @@
-- Touch Interaction Examples for FlexLöve
-- Demonstrates multi-touch gestures, scrolling, and touch events
package.path = package.path .. ";../?.lua;../modules/?.lua"
local FlexLove = require("FlexLove")
local lv = love
FlexLove.init({
theme = "metal",
baseScale = { width = 800, height = 600 },
})
-- Application state
local app = {
touchPoints = {}, -- Active touch points for visualization
gestureLog = {}, -- Recent gestures
selectedTab = "basic", -- Current tab: basic, gestures, scroll
}
-- Helper to add gesture to log
local function logGesture(gestureName, details)
table.insert(app.gestureLog, 1, {
name = gestureName,
details = details or "",
time = lv.timer.getTime(),
})
-- Keep only last 5 gestures
while #app.gestureLog > 5 do
table.remove(app.gestureLog)
end
end
-- Create main container
function lv.load()
-- Tab buttons container
local tabContainer = FlexLove.new({
flexDirection = "row",
gap = 10,
padding = { top = 10, left = 10, right = 10, bottom = 10 },
width = "100vw",
})
-- Tab buttons
local tabs = { "basic", "gestures", "scroll" }
for _, tabName in ipairs(tabs) do
FlexLove.new({
parent = tabContainer,
text = tabName:upper(),
padding = { top = 10, left = 20, right = 20, bottom = 10 },
backgroundColor = app.selectedTab == tabName and { 0.3, 0.6, 0.8, 1 } or { 0.2, 0.2, 0.2, 1 },
color = { 1, 1, 1, 1 },
onEvent = function(el, event)
if event.type == "click" or event.type == "touchrelease" then
app.selectedTab = tabName
lv.load() -- Reload UI
end
end,
})
end
-- Content area based on selected tab
if app.selectedTab == "basic" then
createBasicTouchDemo()
elseif app.selectedTab == "gestures" then
createGesturesDemo()
elseif app.selectedTab == "scroll" then
createScrollDemo()
end
-- Touch visualization overlay (always visible)
createTouchVisualization()
end
-- Basic touch event demo
function createBasicTouchDemo()
local container = FlexLove.new({
width = "100vw",
height = "80vh",
padding = 20,
gap = 10,
flexDirection = "column",
})
FlexLove.new({
parent = container,
text = "Touch Events Demo",
fontSize = 24,
color = { 1, 1, 1, 1 },
})
local touchInfo = {
lastEvent = "None",
touchId = "None",
position = { x = 0, y = 0 },
}
local touchArea = FlexLove.new({
parent = container,
width = "90vw",
height = 300,
backgroundColor = { 0.2, 0.2, 0.3, 1 },
justifyContent = "center",
alignItems = "center",
onEvent = function(el, event)
if event.type == "touchpress" then
touchInfo.lastEvent = "Touch Press"
touchInfo.touchId = event.touchId or "unknown"
touchInfo.position = { x = event.x, y = event.y }
logGesture("Touch Press", string.format("ID: %s", touchInfo.touchId))
elseif event.type == "touchmove" then
touchInfo.lastEvent = "Touch Move"
touchInfo.position = { x = event.x, y = event.y }
elseif event.type == "touchrelease" then
touchInfo.lastEvent = "Touch Release"
logGesture("Touch Release", string.format("ID: %s", touchInfo.touchId))
end
end,
})
FlexLove.new({
parent = touchArea,
text = "Touch or click this area",
color = { 0.7, 0.7, 0.7, 1 },
fontSize = 18,
})
-- Info display
FlexLove.new({
parent = container,
text = string.format("Last Event: %s", touchInfo.lastEvent),
color = { 1, 1, 1, 1 },
})
FlexLove.new({
parent = container,
text = string.format("Touch ID: %s", touchInfo.touchId),
color = { 1, 1, 1, 1 },
})
FlexLove.new({
parent = container,
text = string.format("Position: (%.0f, %.0f)", touchInfo.position.x, touchInfo.position.y),
color = { 1, 1, 1, 1 },
})
end
-- Gesture recognition demo
function createGesturesDemo()
local container = FlexLove.new({
width = "100vw",
height = "80vh",
padding = 20,
gap = 10,
flexDirection = "column",
})
FlexLove.new({
parent = container,
text = "Gesture Recognition Demo",
fontSize = 24,
color = { 1, 1, 1, 1 },
})
FlexLove.new({
parent = container,
text = "Try: Tap, Double-tap, Long-press, Swipe",
fontSize = 14,
color = { 0.7, 0.7, 0.7, 1 },
})
local gestureArea = FlexLove.new({
parent = container,
width = "90vw",
height = 300,
backgroundColor = { 0.2, 0.3, 0.2, 1 },
justifyContent = "center",
alignItems = "center",
})
FlexLove.new({
parent = gestureArea,
text = "Perform gestures here",
color = { 0.7, 0.7, 0.7, 1 },
fontSize = 18,
})
-- Gesture log display
FlexLove.new({
parent = container,
text = "Recent Gestures:",
fontSize = 16,
color = { 1, 1, 1, 1 },
})
for i, gesture in ipairs(app.gestureLog) do
FlexLove.new({
parent = container,
text = string.format("%d. %s - %s", i, gesture.name, gesture.details),
fontSize = 12,
color = { 0.8, 0.8, 0.8, 1 },
})
end
end
-- Scrollable content demo
function createScrollDemo()
local container = FlexLove.new({
width = "100vw",
height = "80vh",
padding = 20,
gap = 10,
flexDirection = "column",
})
FlexLove.new({
parent = container,
text = "Touch Scrolling Demo",
fontSize = 24,
color = { 1, 1, 1, 1 },
})
FlexLove.new({
parent = container,
text = "Touch and drag to scroll • Momentum scrolling enabled",
fontSize = 14,
color = { 0.7, 0.7, 0.7, 1 },
})
local scrollContainer = FlexLove.new({
parent = container,
width = "90vw",
height = 400,
backgroundColor = { 0.15, 0.15, 0.2, 1 },
overflow = "auto",
padding = 10,
gap = 5,
})
-- Add many items to make it scrollable
for i = 1, 50 do
FlexLove.new({
parent = scrollContainer,
text = string.format("Scrollable Item #%d - Touch and drag to scroll", i),
padding = { top = 15, left = 10, right = 10, bottom = 15 },
backgroundColor = i % 2 == 0 and { 0.2, 0.2, 0.3, 1 } or { 0.25, 0.25, 0.35, 1 },
color = { 1, 1, 1, 1 },
width = "100%",
})
end
end
-- Touch visualization overlay
function createTouchVisualization()
-- This would need custom drawing in lv.draw() to show active touch points
end
function lv.update(dt)
FlexLove.update(dt)
-- Update active touch points for visualization
app.touchPoints = {}
local touches = lv.touch.getTouches()
for _, id in ipairs(touches) do
local x, y = lv.touch.getPosition(id)
table.insert(app.touchPoints, { x = x, y = y, id = tostring(id) })
end
end
function lv.draw()
FlexLove.draw()
-- Draw touch point visualization
for _, touch in ipairs(app.touchPoints) do
lv.graphics.setColor(1, 0, 0, 0.5)
lv.graphics.circle("fill", touch.x, touch.y, 30)
lv.graphics.setColor(1, 1, 1, 1)
lv.graphics.circle("line", touch.x, touch.y, 30)
-- Draw touch ID
lv.graphics.setColor(1, 1, 1, 1)
lv.graphics.print(touch.id, touch.x - 10, touch.y - 40)
end
end

124
examples/varying_border_widths.lua
View File

@@ -1,124 +0,0 @@
-- Example: Varying Border Widths
-- Demonstrates how to use different border widths on each side of an element
local FlexLove = require("FlexLove")
function love.load()
FlexLove.init({
baseScale = { width = 1920, height = 1080 },
})
-- Example 1: Different width on each side
FlexLove.Element.new({
x = 50,
y = 50,
width = 200,
height = 150,
backgroundColor = FlexLove.Color.new(0.95, 0.95, 0.95, 1),
border = {
top = 1, -- Thin top border
right = 2, -- Medium right border
bottom = 3, -- Thick bottom border
left = 4, -- Very thick left border
},
borderColor = FlexLove.Color.new(0.2, 0.4, 0.8, 1),
text = "Different width\non each side",
textSize = 16,
textAlign = "center",
padding = 20,
})
-- Example 2: Using boolean values (true = 1px)
FlexLove.Element.new({
x = 300,
y = 50,
width = 200,
height = 150,
backgroundColor = FlexLove.Color.new(0.95, 0.95, 0.95, 1),
border = {
top = true, -- true becomes 1px
right = 8, -- Thick border
bottom = true,-- true becomes 1px
left = false, -- No border
},
borderColor = FlexLove.Color.new(0.8, 0.2, 0.2, 1),
text = "Boolean borders\ntrue = 1px\nfalse = none",
textSize = 16,
textAlign = "center",
padding = 20,
})
-- Example 3: Uniform border with single number
FlexLove.Element.new({
x = 550,
y = 50,
width = 200,
height = 150,
backgroundColor = FlexLove.Color.new(0.95, 0.95, 0.95, 1),
border = 5, -- All sides 5px
borderColor = FlexLove.Color.new(0.2, 0.8, 0.2, 1),
cornerRadius = 10,
text = "Uniform 5px\nall around\nwith rounded\ncorners",
textSize = 16,
textAlign = "center",
padding = 20,
})
-- Example 4: Decorative card with emphasis on one side
FlexLove.Element.new({
x = 50,
y = 250,
width = 700,
height = 100,
backgroundColor = FlexLove.Color.new(1, 1, 1, 1),
border = {
top = 1,
right = 1,
bottom = 1,
left = 8, -- Thick accent border on left
},
borderColor = FlexLove.Color.new(0.9, 0.5, 0.1, 1),
text = "Card with accent border on the left side",
textSize = 18,
padding = { left = 20, top = 10, right = 10, bottom = 10 },
})
-- Instructions
FlexLove.Element.new({
x = 50,
y = 400,
width = 700,
height = "auto",
backgroundColor = FlexLove.Color.new(0.1, 0.1, 0.1, 0.8),
text = "Border Width Options:\n• Use numbers for specific pixel widths (1, 2, 3, etc.)\n• Use true for 1px border\n• Use false for no border\n• Use a single number for uniform borders on all sides\n• Combine with cornerRadius for rounded uniform borders",
textSize = 14,
textColor = FlexLove.Color.new(1, 1, 1, 1),
padding = 20,
cornerRadius = 5,
})
end
function love.draw()
love.graphics.clear(0.15, 0.15, 0.2, 1)
FlexLove.draw()
end
function love.update(dt)
FlexLove.update(dt)
end
function love.mousepressed(x, y, button)
FlexLove.mousepressed(x, y, button)
end
function love.mousereleased(x, y, button)
FlexLove.mousereleased(x, y, button)
end
function love.mousemoved(x, y, dx, dy)
FlexLove.mousemoved(x, y, dx, dy)
end
function love.wheelmoved(x, y)
FlexLove.wheelmoved(x, y)
end