work on docs, video test, and some notes

This commit is contained in:
Paul Liverman 2016-04-04 01:16:32 -07:00
parent dc119e2dc6
commit 7b97abf1cc
7 changed files with 104 additions and 0 deletions

View File

@ -6,11 +6,14 @@ Pop.Box is a GUI library for use in the [LÖVE][2] engine, designed to be easy t
use and require as little code as possible to set up. It is primarily designed use and require as little code as possible to set up. It is primarily designed
to make it easy to experiment with GUIs during development. to make it easy to experiment with GUIs during development.
Supports LÖVE versions 0.9.1 and higher.
## Features ## Features
- Quickly set up and align GUI elements. - Quickly set up and align GUI elements.
- Fully customizable alignment / styling. - Fully customizable alignment / styling.
- Moving/resizing elements takes alignment into account. - Moving/resizing elements takes alignment into account.
- Mouse and key input handling. (**Note**: Work in progress.)
- Extensible: Make your own elements, skins, extensions, and everything is - Extensible: Make your own elements, skins, extensions, and everything is
automatically loaded. automatically loaded.
@ -25,6 +28,9 @@ local window = pop.window():align("center"):setTitle("Welcome!")
window:addChild(pop.text("Welcome to Pop.Box()!")) window:addChild(pop.text("Welcome to Pop.Box()!"))
``` ```
**Note**: Due to this being so early in development...the above example doesn't
actually work as expected. `window` is a very new element.
For more examples, see the code in `demo`. For documentation, see `docs`. For more examples, see the code in `demo`. For documentation, see `docs`.
# Documentation # Documentation

BIN
demo/test.ogv Normal file

Binary file not shown.

66
docs/Pop.md Normal file
View File

@ -0,0 +1,66 @@
# Pop Module
This is the main module that allows you to access everything else in Pop.Box.
Simply require it (`local pop = require "pop"`) and define LÖVE callbacks for:
- `pop.update(dt)`
- `pop.draw()`
- `pop.mousemoved(x, y, dx, dy)` (when using LÖVE 0.10.0 or later)
- `pop.mousepressed(x, y, button)`
- `pop.mousereleased(x, y, button)`
- `pop.keypressed(key)`
- `pop.keyreleased(key)`
- `pop.textinput(text)`
Every callback returns `true`/`false` for whether or not the event was handled.
For example, using the `mousepressed` event handler:
```lua
function love.mousepressed(x, y, button)
local handled = pop.mousepressed(x, y, button)
if not handled then
-- do something useful
end
end
```
## Creating Elements
Once `pop` has been required, you can create [Elements][1] and interact with
them. Most elements can be created like this: `local box = pop.box(...)`
However, if an element's name clashes with a function name used in Pop.Box, you
will have to use `pop.create(type, ...)` where `type` is a string naming the
element type.
When creating an element, the first argument is its parent element. If the first
argument is not an element, it will be treated as the second argument. If it is
`false`, then an element with no parent will be created. When no parent is
specified, an element's parent is `pop.screen`, which is the top-level element
of Pop.Box.
(This behavior can be modified by elements themselves. No standard element does
this, but if you use an element created by someone else, check its
documentation first.)
## Skinning Elements
See the [Skins][2] documentation.
## Custom Elements/Skins/Extensions
Any `.lua` file placed in the `elements`, `skins`, and `extensions` directories
within the module will be loaded and available as appropriate. See the
documentation on each for how to make them:
- [Elements][1]
- [Skins][2]
- [Extensions][3]
Also of use, there is a separate set of docs about how Pop.Box works under the
surface: [Pop Module (dev)][4]
[1]: ./Elements.md
[2]: ./Skins.md
[3]: ./Extensions.md
[4]: ./dev/Pop.md

19
docs/Skins.md Normal file
View File

@ -0,0 +1,19 @@
# Skins
**Note**: This system is mostly an after-thought right now, and will probably
be replaced with something else entirely.
Skins are simple tables containing information to style a variety of elements.
Use `pop.skin()` to apply a skin to an element and its children (see
[Pop Module][3] documentation). Skins are loaded from the `skins` directory.
- `color` - A table of RGBA values (see [love.graphics.setColor][2]), used as a
foreground color (currently for `text` elements only).
- `background` - A [supported Drawable][4], used for backgrounds (currently
used on `box` elements only).
- `font` - A [Font][5].
[2]: https://love2d.org/wiki/love.graphics.setColor
[3]: ./Pop.md
[4]: ./Drawables.md
[5]: https://love2d.org/wiki/Font

8
docs/dev/Pop.md Normal file
View File

@ -0,0 +1,8 @@
# Pop Module (dev)
(This document focuses on the structure and code of Pop.Box, not how to use it.
See the [regular documentation][1] for that.)
TODO: Write me.
[1]: ../Pop.md

View File

@ -157,6 +157,8 @@ pop.textinput = (text) ->
print "textinput", text print "textinput", text
return false --TODO event handlers return if they have handled the event! return false --TODO event handlers return if they have handled the event!
--TODO rewrite skin system to not rely on knowing internals of elements,
-- instead call functions like setColor and setBackground
-- skins an element (and its children unless depth == true or 0) -- skins an element (and its children unless depth == true or 0)
-- depth can be an integer for how many levels to go down when skinning -- depth can be an integer for how many levels to go down when skinning
-- defaults to pop.screen and the default skin -- defaults to pop.screen and the default skin

View File

@ -1,3 +1,6 @@
-- Note that the "default" name is a bit of a misnomer, as this does not
-- specify the defaults used in Pop.Box elements (they define their own)
import graphics from love import graphics from love
return { return {