Update README

This commit is contained in:
Insality 2020-03-22 12:54:56 +03:00
parent 6367e66203
commit 7b2578c0ef
6 changed files with 84 additions and 27 deletions

View File

@ -2,7 +2,7 @@
[![](media/druid_logo.png)](https://insality.github.io/druid/) [![](media/druid_logo.png)](https://insality.github.io/druid/)
**Druid** - powerful defold component UI library. Use basic Druid components or make your own game-specific components to make amazing GUI in your games. **Druid** - powerful defold component UI library. Use basic **Druid** components or make your own game-specific components to make amazing GUI in your games.
## Setup ## Setup
@ -15,8 +15,28 @@ You can use the **Druid** extension in your own project by adding this project a
Or point to the ZIP file of a [specific release](https://github.com/Insality/druid/releases). Or point to the ZIP file of a [specific release](https://github.com/Insality/druid/releases).
### Input bindings
### Code For **Druid** to work requires next input bindings:
- Mouse trigger - `Button 1` -> `touch` _For basic input components_
- Key trigger - `Backspace` -> `backspace` _For back_handler component_
- Key trigger - `Back` -> `text` _For back_handler component, Android back button_
![](media/input_binding.png)
### Input capturing [optional]
By default, **Druid** will auto-capture input focus, if any input component will be created. So you don't need to call `msg.post(".", "acquire_input_focus)"`
If you not need this behaviour, you can disable it by settings `druid.no_auto_input` field in _game.project_:
```
[druid]
no_auto_input = 1
```
### Code [optional]
Adjust **Druid** settings, if needed: Adjust **Druid** settings, if needed:
```lua ```lua
@ -34,25 +54,6 @@ druid.set_text_function(callback)
druid.set_default_style(your_style) druid.set_default_style(your_style)
``` ```
### Input bindings
For **Druid** to work requires next input bindings:
- Mouse trigger - `mouse-button-1` -> `touch` _For basic input components_
- Key trigger - `Backspace` -> `backspace` _For back_handler component_
- Key trigger - `Back` -> `text` _For back_handler component, Android back button_
![](media/input_binding.png)
### Input capturing
By default, **Druid** will auto-capture input focus, if any input component will be created. So you don't need to call `msg.post(".", "acquire_input_focus)"`
If you not need this behaviour, you can disable it by settings `druid.no_auto_input` field in _game.project_:
```
[druid]
no_auto_input = 1
```
## Components ## Components
@ -123,6 +124,22 @@ function on_input(self, action_id, action)
end end
``` ```
## Druid Events
Any **Druid** components as callbacks uses Druid Events. In component API ([button example](https://insality.github.io/druid/modules/druid.button.html#Events)) pointed list of component events. You can manually subscribe on this events by next API:
- **event:subscribe**(callback)
- **event:unsubscribe**(callback)
- **event:clear**()
Any events can handle several callbacks, if needed.
## Features
- Druid input goes as stack. Last created button will checked first. So create your GUI from back
- Don't forget about `return` in `on_input`: `return self.druid:on_input()`. It need, if you have more than 1 acquire inputs (several druid, other input system, etc)
## Examples ## Examples
@ -158,6 +175,8 @@ _Will fill later_
- Add on_change_language support (call single function to update all Druid instance) - Add on_change_language support (call single function to update all Druid instance)
- Unit tests
- Better documentation and examples - Better documentation and examples
- Add more comfortable gamepad support for GUI (ability to select button with DPAD and other stuff) - Add more comfortable gamepad support for GUI (ability to select button with DPAD and other stuff)

View File

@ -1,19 +1,50 @@
# Druid components # Druid components
## Button ## Button
Basic game button Basic Druid input component
- Button callback have next params: (self, params, button_instance)
- **self** - Druid self context
- **params** - Additional params, specified on button creating
- **button_instance** - button itself
- Button have next events:
- **on_click** - basic button callback
- **on_repeated_click** - repeated click callback, while holding the button, don't trigger if callback is empty
- **on_long_click** - callback on long button tap, don't trigger if callback is empty
- **on_hold_click** - hold callback, before long_click trigger, don't trigger if callback is empty
- **on_double_click** - different callback, if tap button 2+ in row, don't trigger if callback is empty
- If you have stencil on buttons and you don't want trigger them outside of stencil node, you can use `button:set_click_zone` to restrict button click zone
- Button can have key trigger to use then by key: `button:set_key_trigger`
## Text ## Text
Wrap on text node with text size adjusting Basic Druid text component
- Text component by default have auto adjust text sizing. Text never will be more, than text size, which you can setup in gui scene. It can be disabled on component creating
![](media/text_autosize.png)
- Text pivot can be changed with `text:set_pivot`, and text will save their position inside their text size box:
![](media/text_anchor.gif)
## Blocker ## Blocker
Block input in node zone Druid component for block input
It can be used for block input in special zone.
Example:
![](media/blocker_scheme.png)
Blue zone is **button** with close_window callback
Yellow zone is blocker with window content
So you can do the safe zones, when you have the big buttons
## Back Handler ## Back Handler
Handle back button (Android, backspace) Component to handle back button
It works on Android back button and Backspace. Key triggers in `input.binding` should be setup
## Locale ## Locale
Text component with handle localization system Wrap on Druid text component to handle localization
## Timer ## Timer
Run timer on text node Run timer on text node

View File

@ -1,10 +1,12 @@
# Creating custom components # Creating custom components
## Overview ## Overview
Druid allows you to create your custom components from druid basic components or other custom components Druid allows you to create your custom components from druid basic components or other custom components
## Custom components ## Custom components
Basic custom component template looks like this: Basic custom component template looks like this:
```lua ```lua
local const = require("druid.const") local const = require("druid.const")
@ -102,4 +104,9 @@ function M.init(self, template_name, node_table)
local my_style = self:get_style() local my_style = self:get_style()
end end
``` ```
## Power of using templates
You can use one component, but creating and customizing templates for them. Templates only requires to match the component scheme.

BIN
media/blocker_scheme.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

BIN
media/text_anchor.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

BIN
media/text_autosize.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB