Update README and add topics

This commit is contained in:
Insality
2020-03-21 22:54:18 +03:00
parent b7e58950aa
commit c0320d9f1b
36 changed files with 1671 additions and 174 deletions

40
docs_md/components.md Normal file
View File

@@ -0,0 +1,40 @@
# Druid components
## Button
Basic game button
## Text
Wrap on text node with text size adjusting
## Blocker
Block input in node zone
## Back Handler
Handle back button (Android, backspace)
## Locale
Text component with handle localization system
## Timer
Run timer on text node
## Progress
Basic progress bar
## Scroll
Basic scroll component
## Grid
Component for manage node positions
## Slider
Basic slider component
## Checkbox
Basic checkbox component
## Checkbox group
Several checkboxes in one group
## Radio group
Several checkboxes in one group with single choice

View File

@@ -0,0 +1,105 @@
# Creating custom components
## Overview
Druid allows you to create your custom components from druid basic components or other custom components
## Custom components
Basic custom component template looks like this:
```lua
local const = require("druid.const")
local component = require("druid.component")
local M = component.create("your_component")
-- Component constructor
function M.init(self, ...)
end
-- Call only if exist interest: const.ON_UPDATE
function M.update(self, dt)
end
-- Call only if exist interest: const.ON_INPUT or const.ON_INPUT_HIGH
function M.on_input(self, action_id, action)
end
-- Call only if exist interest: const.ON_MESSAGE
function M.on_message(self, message_id, message, sender)
end
-- Call only if component with ON_CHANGE_LANGUAGE interest
function M.on_change_language(self)
end
-- Call only if component with ON_LAYOUT_CHANGE interest
function M.on_layout_change(self)
end
return M
```
Add your custom component to druid via `druid.register`
```lua
local druid = require("druid.druid")
local my_component = require("my.amazing.component")
local function init(self)
druid.register("my_component", my_component)
end
```
### Interest
Interest - is a way to indicate what events your component will respond to.
There is next interests in druid:
- **ON_MESSAGE** - component will receive messages from on_message
- **ON_UPDATE** - component will be updated from update
- **ON_INPUT_HIGH** - component will receive input from on_input, before other components with ON_INPUT
- **ON_INPUT** - component will receive input from on_input, after other components with ON_INPUT_HIGH
- **ON_CHANGE_LANGUAGE** - will call _on_change_language_ function on language change trigger
- **ON_LAYOUT_CHANGED** will call _on_layout_change_ function on layout change trigger
## Best practice on custom components
On each component recomended describe component scheme in next way:
```lua
-- Component module
local component = require("druid.component")
local M = component.create("your_component")
local SCHEME = {
ROOT = "/root",
ITEM = "/item",
TITLE = "/title"
}
function M.init(self, template_name, node_table)
-- If component use template, setup it:
self:set_template(template_name)
-- If component was cloned with gui.clone_tree, pass his nodes
self:set_nodes(node_table)
-- helper can get node from gui/template/table
local root = self:get_node(SCHEME.ROOT)
-- This component can spawn another druid components:
local druid = self:get_druid()
-- Button self on callback is self of _this_ component
local button = druid:new_button(...)
-- helper can return you the component style for current component
-- It return by component name from
local my_style = self:get_style()
end
```

8
docs_md/druid_assets.md Normal file
View File

@@ -0,0 +1,8 @@
# Druid assets
## Overview
I've created [druid-assets repository](https://github.com/Insality/druid-assets) to make a _marketplace_ with custom styles and components.
Any of druid users can push their own components and styles to share it with the other users
Also, this marketplace is great example to how you can create your custom components

6
docs_md/examples.md Normal file
View File

@@ -0,0 +1,6 @@
# Examples
## Overview
See the [example folder](https://github.com/Insality/druid/tree/develop/example/kenney) for examples of how to use Druid
Try the HTML5 version of the example app

47
docs_md/styles.md Normal file
View File

@@ -0,0 +1,47 @@
# Styles
## Overview
Styles - set of functions and parameters for components to customize their behavior.
Styles is a table, where key is name of component, and value is style table for this component.
In component API documentation, you can find the style API for this component. Or just lookup for existing styles and modify them.
## Usage
Setup default druid style for all druid instances via `druid.set_default_style`
```lua
local druid = require("druid.druid")
local my_style = require("my.amazing.style")
local function init(self)
druid.set_default_style(my_style)
end
```
Setup custom style to specific druid instance:
```lua
local druid = require("druid.druid")
local my_style = require("my.amazing.style")
local function init(self)
-- This druid instance will be use my_style as default
self.druid = druid.new(self, my_style)
end
```
Change component style with _set_style_ function
```lua
local druid = require("druid.druid")
local my_style = require("my.amazing.style")
local function init(self)
self.druid = druid.new(self)
self.button = self.druid:new_button(self, "node")
-- Setup custom style for specific component
self.button:set_style(my_style)
end
```
## Create custom components
Styles is just lua table, so it can be described in just one single file
__TODO__