ArcMutex/helium
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
qfx 2020-02-13 19:17:37 +02:00
parent 77f20a1b8c
commit 59d71e3c27
1 changed files with 26 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
README.md
View File

@ -31,14 +31,14 @@
``` ```
## Basic overview: ## Basic overview:
Helium is practically more like a UI framework than a fully fledged UI library. Helium is practically more like a UI framework than a fully fledged UI library.
The idea is to build custom, build simple and build fast, encapsulate. The idea is to build custom, build simple and build fast, encapsulate.
## Getting started: ## Getting started:
Load helium with helium = require 'helium' Load helium with helium = require 'helium'
Create a new file for your awesome element, say 'helloWorld.lua' Create a new file for your awesome element, say 'helloWorld.lua'
The basic structure for an element file is: The basic structure for an element file is:
```lua ```lua
return function(param,state,view) return function(param,state,view)
@ -49,11 +49,11 @@
end end
``` ```
That's it, it's now a correct helium element That's it, it's now a correct helium element
So lets make a simple button! So lets make a simple button!
In helloWorld.lua: In helloWorld.lua:
```lua ```lua
local input = require "helium.core.input" local input = require "helium.core.input"
@ -77,7 +77,7 @@
end end
end end
``` ```
And in main.lua: And in main.lua:
```lua ```lua
local buttonFactory = HeliumLoader('helloWorld.lua') local buttonFactory = HeliumLoader('helloWorld.lua')
local button = buttonFactory({}, 200, 100) local button = buttonFactory({}, 200, 100)
@ -88,29 +88,30 @@
Now theres a lot to explain, but its fairly simple, so lets take it by chunks Now theres a lot to explain, but its fairly simple, so lets take it by chunks
```lua
local input = require "helium.core.input" local input = require "helium.core.input"
Here we import the input module of Helium, so that we can later subscribe to an event ```
Here we import the input module of Helium, so that we can later subscribe to an event
```lua ```lua
state.pressed = false state.pressed = false
``` ```
Here we create a state field called pressed, think of state as a helium elements self Here we create a state field called pressed, think of state as a helium elements self
It works like a regular table, with the caveat that you shouldnt overwrite it directly like state = {} It works like a regular table, with the caveat that you shouldnt overwrite it directly like state = {}
```lua ```lua
local callback = function() state.pressed = true end local callback = function() state.pressed = true end
``` ```
Then we overwrite that state.pressed inside a callback which will be called every time our button is pressed Then we overwrite that state.pressed inside a callback which will be called every time our button is pressed
```lua ```lua
input.subscribe(0,0,view.w,view.h,'clicked',callback) input.subscribe(0,0,view.w,view.h,'clicked',callback)
``` ```
This is creating an input subscription for the event of your choice This is creating an input subscription for the event of your choice
```lua ```lua
@ -125,20 +126,19 @@
love.graphics.printf("Pressed? "..tostring(state.pressed),0,view.h/2-5,view.w,'center') love.graphics.printf("Pressed? "..tostring(state.pressed),0,view.h/2-5,view.w,'center')
end end
``` ```
Is the rendering code, it works more or less like a mini window of a love.draw() Is the rendering code, it works more or less like a mini window of a love.draw()
Additional details: ### Additional details:
view is a table that holds the information about the position and size of an element **view** is a table that holds the information about the position and size of an element
x,y x, y, w, h
w,h Setting this from inside the element works as expected(so you can dynamically resize and reposition the element from inside)
Setting this from inside the element works as expected(so you can dynamically resize and reposition the element from inside)
param is the table that you pass in buttonFactory({}, 200, 100), it can be anything you need param is the table that you pass in buttonFactory({}, 200, 100), it can be anything you need
there's a configuration table inside of helium, which has a couple of default settings there's a configuration table inside of helium, which has a couple of default settings
if autorun is off then you NEED to place helium.update(dt), helium.render() somewhere if autorun is off then you NEED to place helium.update(dt), helium.render() somewhere
and if you need input, hook it up to the eventHandlers in your own love.run: and if you need input, hook it up to the eventHandlers in your own love.run:
```lua ```lua
if not(helium.input.eventHandlers[name]) or not(helium.input.eventHandlers[name](a, b, c, d, e, f)) then if not(helium.input.eventHandlers[name]) or not(helium.input.eventHandlers[name](a, b, c, d, e, f)) then
love.handlers[name](a, b, c, d, e, f) love.handlers[name](a, b, c, d, e, f)