From 8574e34b51dfd9c67e47488497216097c28996dc Mon Sep 17 00:00:00 2001 From: Mike Freno Date: Mon, 15 Sep 2025 19:19:33 -0400 Subject: [PATCH] update readme, update types --- FlexLove.lua | 26 ++++++++---- README.md | 118 ++++++++++++++++++++++++++++++++++++++++++++++++++- game/libs | 1 - 3 files changed, 135 insertions(+), 10 deletions(-) delete mode 160000 game/libs diff --git a/FlexLove.lua b/FlexLove.lua index 3172c39..59f38a9 100644 --- a/FlexLove.lua +++ b/FlexLove.lua @@ -23,10 +23,10 @@ function Color.new(r, g, b, a) end --- Convert hex string to color ----@param hex string -- e.g. "#RRGGBB" or "#RRGGBBAA" +---@param hexWithTag string -- e.g. "#RRGGBB" or "#RRGGBBAA" ---@return Color -function Color.fromHex(hex) - local hex = hex:gsub("#", "") +function Color.fromHex(hexWithTag) + local hex = hexWithTag:gsub("#", "") if #hex == 6 then local r = tonumber("0x" .. hex:sub(1, 2)) local g = tonumber("0x" .. hex:sub(3, 4)) @@ -206,6 +206,16 @@ Animation.__index = Animation ---@field transition table? local AnimationProps = {} +---@class TransformProps +---@field scale {x?:number, y?:number}? +---@field rotate number? +---@field translate {x?:number, y?:number}? +---@field skew {x?:number, y?:number}? + +---@class TransitionProps +---@field duration number? +---@field easing string? + ---@param props AnimationProps ---@return Animation function Animation.new(props) @@ -359,8 +369,8 @@ end ---@field justifySelf JustifySelf -- Alignment of the item itself along main axis (default: AUTO) ---@field alignSelf AlignSelf -- Alignment of the item itself along cross axis (default: AUTO) ---@field textSize number? -- Font size for text content ----@field transform table -- Transform properties for animations and styling ----@field transition table -- Transition settings for animations +---@field transform TransformProps -- Transform properties for animations and styling +---@field transition TransitionProps -- Transition settings for animations local Window = {} Window.__index = Window @@ -553,7 +563,7 @@ function Window:layoutChildren() -- Position children local currentPos = spacing - for i, child in ipairs(self.children) do + for _, child in ipairs(self.children) do if child.positioning == Positioning.ABSOLUTE then goto continue end @@ -949,8 +959,8 @@ end ---@field textSize number? ---@field justifySelf JustifySelf -- default: auto ---@field alignSelf AlignSelf -- default: auto ----@field transform table ----@field transition table +---@field transform TransformProps +---@field transition TransitionProps local Button = {} Button.__index = Button diff --git a/README.md b/README.md index 0dc0477..f33575f 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,120 @@ # FlexLöve + A Löve Gui based on Flexbox -This is a single file lib, to use all you need is FlexLove.lua. But you shouldn't use this lib, it is way too early for sane use. +FlexLöve is a lightweight, flexible GUI library for Löve2D that implements a flexbox-based layout system. It provides a simple way to create and manage UI elements like windows and buttons with automatic layout calculations, animations, and responsive design. + +## Features + +- **Flexbox Layout**: Implement modern flexbox layouts for UI elements +- **Window Management**: Create hierarchical window structures with automatic sizing +- **Button System**: Interactive buttons with click detection and callbacks +- **Animations**: Built-in animation support for transitions and effects +- **Responsive Design**: Automatic resizing based on window dimensions +- **Color Handling**: Utility classes for managing colors in various formats +- **Text Rendering**: Flexible text display with alignment options + +## Installation + +To use FlexLove, simply copy the `FlexLove.lua` file into your project's `libs` directory and require it in your main application: + +```lua +local FlexLove = require("libs.FlexLove") +``` + +## Basic Usage + +```lua +-- Create a main window +local mainWindow = FlexLove.GUI.Window.new({ + x = 100, + y = 100, + w = 400, + h = 300, + background = FlexLove.Color.new(0.2, 0.2, 0.2, 1), + text = "Main Window", +}) + +-- Create a button inside the window +local button = FlexLove.GUI.Button.new({ + parent = mainWindow, + x = 50, + y = 50, + w = 100, + h = 40, + text = "Click Me", + callback = function(button) + print("Button clicked!") + end, +}) + +-- In your love.update function +function love.update(dt) + FlexLove.GUI.update(dt) +end + +-- In your love.draw function +function love.draw() + FlexLove.GUI.draw() +end +``` + +## API Reference + +### Color + +Utility class for color handling with RGB and RGBA components. + +- `Color.new(r, g, b, a)` - Create new color instance +- `Color.fromHex(hex)` - Convert hex string to color +- `Color:toHex()` - Convert color to hex string +- `Color:toRGBA()` - Get RGBA values + +### Window + +Main window class for creating UI containers. + +- `Window.new(props)` - Create a new window +- `Window:addChild(child)` - Add child elements to the window +- `Window:draw()` - Draw the window and all its children +- `Window:update(dt)` - Update window state (propagates to children) +- `Window:resize(newWidth, newHeight)` - Resize window based on game size change + +### Button + +Interactive button element. + +- `Button.new(props)` - Create a new button +- `Button:draw()` - Draw the button +- `Button:update(dt)` - Update button state (handles click detection) +- `Button:updateText(newText, autoresize)` - Update button text + +### Animation + +Animation system for UI transitions. + +- `Animation.new(props)` - Create a new animation +- `Animation:interpolate()` - Get interpolated values during animation +- `Animation:apply(element)` - Apply animation to a GUI element +- `Animation.fade(duration, fromOpacity, toOpacity)` - Create a fade animation +- `Animation.scale(duration, fromScale, toScale)` - Create a scale animation + +## Enums + +Predefined enums for various layout and styling options: + +- TextAlign: START, CENTER, END, JUSTIFY +- Positioning: ABSOLUTE, FLEX +- FlexDirection: HORIZONTAL, VERTICAL +- JustifyContent: FLEX_START, CENTER, SPACE_AROUND, FLEX_END, SPACE_EVENLY, SPACE_BETWEEN +- AlignItems: STRETCH, FLEX_START, FLEX_END, CENTER, BASELINE +- AlignSelf: AUTO, STRETCH, FLEX_START, FLEX_END, CENTER, BASELINE +- AlignContent: STRETCH, FLEX_START, FLEX_END, CENTER, SPACE_BETWEEN, SPACE_AROUND + +## Examples + +See the `examples/` directory for complete usage examples. + +## License + +MIT License - see LICENSE file for details. \ No newline at end of file diff --git a/game/libs b/game/libs deleted file mode 160000 index 899a76b..0000000 --- a/game/libs +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 899a76b4a58c12ee175f572b354da37e9720b3e9