Merge branch 'develop'

This commit is contained in:
Insality 2020-05-09 16:10:39 +03:00
commit af6e52369d
76 changed files with 2814 additions and 1034 deletions

View File

@ -22,11 +22,12 @@ Or point to the ZIP file of a [specific release](https://github.com/Insality/dr
For **Druid** to work requires next input bindings:
- Mouse trigger - `Button 1` -> `touch` _For basic input components_
- Key trigger - `Backspace` -> `key_backspace` _For back_handler component, input component_
- Key trigger - `Back` -> `key_back` _For back_handler component, Android back button, input component_
- Mouse trigger - `Button 1` -> `touch` _For basic input components_
- Key trigger - `Backspace` -> `key_backspace` _For back_handler component, input component_
- Key trigger - `Back` -> `key_back` _For back_handler component, Android back button, input component_
- Key trigger - `Enter` -> `key_enter` _For input component, optional_
- Key trigger - `Esc` -> `key_esc` _For input component, optional_
- Touch triggers - `Touch multi` -> `multitouch` _For scroll component_
![](media/input_binding_2.png)
![](media/input_binding_1.png)
@ -61,7 +62,7 @@ druid.set_default_style(your_style)
-- Call this function on language changing in the game,
-- to retranslate all lang_text components:
druid.on_languge_change()
druid.on_language_change()
-- Call this function on layout changing in the game,
-- to reapply layouts
@ -109,6 +110,8 @@ druid.on_window_callback(event)
- **[Swipe](https://github.com/Insality/druid/blob/master/docs_md/01-components.md#swipe)** - System Druid component, handle swipe gestures on node
- **[Drag](https://github.com/Insality/druid/blob/master/docs_md/01-components.md#drag)** - System Druid component, handle drag input on node
Full info see on _[components.md](https://github.com/Insality/druid/blob/master/docs_md/01-components.md)_
@ -183,7 +186,7 @@ end
- *on_input* used for almost all basic druid components
- *update* used for progress bar, scroll and timer base components
- *on_message* used for specific druid events, like language change or layout change (TODO: in future)
- *on_message* used for specific druid events, like language change or layout change
- *final* used for custom components, what have to do several action before destroy
Recommended is fully integrate al druid lifecycles functions
@ -223,13 +226,11 @@ _Will fill later_
## License
Original created by [AGulev](https://github.com/AGulev)
- Original created by [AGulev](https://github.com/AGulev)
- Developed and supporting by [Insality](https://github.com/Insality)
- Assets from [Kenney](http://www.kenney.nl/)
Developed and supporting by [Insality](https://github.com/Insality)
Assets from [Kenney](http://www.kenney.nl/)
MIT License
**MIT** License
## Issues and suggestions

View File

@ -1 +1 @@
{"content":[{"name":"game.projectc","size":2725,"pieces":[{"name":"game.projectc0","offset":0}]},{"name":"game.arci","size":4928,"pieces":[{"name":"game.arci0","offset":0}]},{"name":"game.arcd","size":276790,"pieces":[{"name":"game.arcd0","offset":0}]},{"name":"game.dmanifest","size":10701,"pieces":[{"name":"game.dmanifest0","offset":0}]},{"name":"game.public.der","size":162,"pieces":[{"name":"game.public.der0","offset":0}]}]}
{"content":[{"name":"game.projectc","size":2838,"pieces":[{"name":"game.projectc0","offset":0}]},{"name":"game.arci","size":5008,"pieces":[{"name":"game.arci0","offset":0}]},{"name":"game.arcd","size":279217,"pieces":[{"name":"game.arcd0","offset":0}]},{"name":"game.dmanifest","size":10936,"pieces":[{"name":"game.dmanifest0","offset":0}]},{"name":"game.public.der","size":162,"pieces":[{"name":"game.public.der0","offset":0}]}]}

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1,6 +1,6 @@
[project]
title = druid
version = 0.2.0
version = 0.4.0
write_log = 0
compress_archive = 1
@ -14,7 +14,12 @@ update_frequency = 0
vsync = 1
display_profiles = /builtins/render/default.display_profilesc
dynamic_orientation = 0
clear_color = 0
[render]
clear_color_red = 0
clear_color_green = 0
clear_color_blue = 0
clear_color_alpha = 0
[physics]
type = 2D
@ -154,6 +159,9 @@ settings = /liveupdate.settings
max_count = 16
max_tile_count = 2048
[engine]
run_while_iconified = 0
[druid]
no_auto_input = 0

View File

@ -23,6 +23,7 @@ var Combine = {
_onAllTargetsBuilt:[], // signature: void
_onDownloadProgress: [], // signature: downloaded, total
_currentDownloadBytes: 0,
_totalDownloadBytes: 0,
_retry_time: 0, // pause before retry file loading after error
@ -91,6 +92,7 @@ var Combine = {
this._onAllTargetsBuilt = [];
this._onDownloadProgress = [];
this._currentDownloadBytes = 0;
this._totalDownloadBytes = 0;
},
@ -98,6 +100,7 @@ var Combine = {
var json = JSON.parse(xhr.responseText);
this._targets = json.content;
this._totalDownloadBytes = 0;
this._currentDownloadBytes = 0;
var targets = this._targets;
for(var i=0; i<targets.length; ++i) {
@ -129,38 +132,42 @@ var Combine = {
throw "Request out of order";
}
target.lastRequestedPiece = index;
target.progress = {};
var item = target.pieces[index];
target.lastRequestedPiece = index;
var total = 0;
var downloaded = 0;
var xhr = new XMLHttpRequest();
xhr.open('GET', this._archiveLocationFilter('/' + item.name), true);
var url = this._archiveLocationFilter('/' + item.name);
xhr.open('GET', url, true);
xhr.responseType = 'arraybuffer';
// called periodically with information about the transaction
xhr.onprogress = function(evt) {
target.progress[item.name] = {total: 0, downloaded: 0};
if (evt.total && evt.lengthComputable) {
target.progress[item.name].total = evt.total;
total = evt.total;
}
if (evt.loaded && evt.lengthComputable) {
target.progress[item.name].downloaded = evt.loaded;
var delta = evt.loaded - downloaded;
downloaded = evt.loaded;
Combine._currentDownloadBytes += delta;
Combine.updateProgress(target);
}
};
// called when the transaction completes successfully
xhr.onload = function(evt) {
item.data = new Uint8Array(xhr.response);
item.dataLength = item.data.length;
target.progress[item.name].total = item.dataLength;
target.progress[item.name].downloaded = item.dataLength;
total = item.dataLength;
downloaded = item.dataLength;
Combine.copyData(target, item);
Combine.onPieceLoaded(target, item);
Combine.updateProgress(target);
item.data = undefined;
};
// called when the transaction fails
xhr.onerror = function(evt) {
if (target.progress[item.name]) {
target.progress[item.name].downloaded = 0;
Combine.updateProgress(target);
}
downloaded = 0;
Combine.updateProgress(target);
attempt_count += 1;
if (attempt_count < Combine._max_retry_count) {
console.warn("Can't download file '" + item.name + "' . Next try in " + Combine._retry_time + " sec.");
@ -168,19 +175,15 @@ var Combine = {
Combine.requestPiece(target, index, attempt_count);
}, Combine._retry_time * 1000);
} else {
Combine.can_not_download_file(item.name);
Combine.can_not_download_file(item.name);
}
};
xhr.send(null);
},
updateProgress: function(target) {
var total_downloaded = 0;
for (var p in target.progress) {
total_downloaded += target.progress[p].downloaded;
}
for(i = 0; i<this._onDownloadProgress.length; ++i) {
this._onDownloadProgress[i](total_downloaded, this._totalDownloadBytes);
this._onDownloadProgress[i](this._currentDownloadBytes, this._totalDownloadBytes);
}
},
@ -697,5 +700,3 @@ window.onerror = function(err, url, line, column, errObj) {
if (text) Module.printErr('[post-exception status] ' + text);
};
};

Binary file not shown.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -7,7 +7,7 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>druid 0.2.0</title>
<title>druid 0.4.0</title>
<style type='text/css'>
/* Disable user selection to avoid strange bug in Chrome on Windows:
* Selecting a text outside the canvas, then clicking+draging would
@ -111,8 +111,7 @@
.canvas-app-canvas {
background-repeat:no-repeat;
background-position: center center;
background-size: 70%;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='300px' height='64px' viewBox='-2467.5 2469 300 64' style='enable-background:new -2467.5 2469 300 64;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2315244A;%7D .st1%7Bfill:url(%23SVGID_1_);%7D .st2%7Bfill:url(%23SVGID_2_);%7D%0A%3C/style%3E%3Ctitle%3Edefold-logo-html5-splash%3C/title%3E%3Cpolygon class='st0' points='-2177,2482.9 -2175.5,2482.9 -2175.5,2486.7 -2174.4,2486.7 -2174.4,2482.9 -2173.2,2482.9 -2173.2,2481.9 -2177,2481.9 '/%3E%3Cpolygon class='st0' points='-2169.8,2484.1 -2171,2482.1 -2172.1,2482.1 -2172.1,2486.7 -2171,2486.7 -2171,2483.5 -2169.7,2485.6 -2169.7,2485.6 -2168.5,2483.5 -2168.5,2486.7 -2167.5,2486.7 -2167.5,2482.1 -2168.6,2482.1 '/%3E%3Cpath class='st0' d='M-2376,2482h-13.8v38h13.6c6.6,0,12.2-1.9,16.1-5.5c3.8-3.5,5.8-8.5,5.7-13.7v-0.1 C-2354.5,2489.3-2362.9,2482-2376,2482z M-2364,2501.2c0,6.7-4.5,10.9-11.8,10.9h-4.7v-22h4.7c7.3,0,11.8,4.2,11.8,10.9 L-2364,2501.2z'/%3E%3Cpolygon class='st0' points='-2340.9,2505 -2325.1,2505 -2325.1,2497.4 -2340.9,2497.4 -2340.9,2489.6 -2322.4,2489.6 -2322.4,2481.9 -2350.1,2481.9 -2350.1,2520 -2322.2,2520 -2322.2,2512.4 -2340.9,2512.4 '/%3E%3Cpolygon class='st0' points='-2317.1,2481.9 -2317.1,2520 -2307.9,2520 -2307.9,2505.9 -2293,2505.9 -2293,2498.4 -2307.9,2498.4 -2307.9,2489.9 -2289.6,2489.9 -2289.6,2481.9 '/%3E%3Cpolygon class='st0' points='-2233,2482.1 -2242.2,2482.1 -2242.2,2520 -2216.3,2520 -2216.3,2512.2 -2233,2512.2 '/%3E%3Cpath class='st0' d='M-2197.1,2482h-13.7v38h13.5c6.7,0,12.2-1.9,16.1-5.5c3.8-3.5,5.8-8.5,5.7-13.7v-0.1 C-2175.5,2489.3-2184,2482-2197.1,2482z M-2185.1,2501.2c0,6.7-4.5,10.9-11.8,10.9h-4.7v-22h4.7c7.3,0,11.8,4.2,11.8,10.9V2501.2z' /%3E%3Cpath class='st0' d='M-2267.5,2481.7c-10.8,0-19.6,8.8-19.6,19.7c0,10.8,8.8,19.6,19.7,19.6c10.8,0,19.6-8.8,19.6-19.6l0,0 C-2247.8,2490.5-2256.6,2481.7-2267.5,2481.7C-2267.5,2481.7-2267.5,2481.7-2267.5,2481.7z M-2258,2507.9l-8.8,5.1 c-0.5,0.3-1.2,0.3-1.8,0l-8.8-5.1c-0.5-0.3-0.9-0.9-0.9-1.5v-10.2c0-0.6,0.3-1.2,0.9-1.5l8.8-5.1c0.5-0.3,1.2-0.3,1.8,0l8.8,5.1 c0.5,0.3,0.9,0.9,0.9,1.5v10.2C-2257.1,2507-2257.4,2507.6-2258,2507.9z'/%3E%3Cpath class='st0' d='M-2423.2,2494.6l-11.1,6.4l-11.1-6.4l11.1-6.4L-2423.2,2494.6z M-2412.1,2501v12.8l11.1-6.4L-2412.1,2501z M-2467.5,2507.4l11.1,6.4V2501L-2467.5,2507.4z M-2434.3,2526.6l11.1,6.4l11.1-6.4l-11.1-6.4l11.1-6.4l-11.1-6.4l-11.1,6.4 l-11.1-6.4l-11.1,6.4l11.1,6.4l-11.1,6.4l11.1,6.4L-2434.3,2526.6z'/%3E%3ClinearGradient id='SVGID_1_' gradientUnits='userSpaceOnUse' x1='-2451.2178' y1='2525.4604' x2='-2406.2178' y2='2499.6304' gradientTransform='matrix(1 0 0 -1 0 5004)'%3E%3Cstop offset='0' style='stop-color:%231C68EC'/%3E%3Cstop offset='1' style='stop-color:%2300E9DF'/%3E%3C/linearGradient%3E%3Cpath class='st1' d='M-2412.1,2513.8v12.8l-11.1-6.4L-2412.1,2513.8z M-2434.3,2513.8V2501l-11.1-6.4v12.8L-2434.3,2513.8z M-2445.4,2469v12.8l11.1-6.4L-2445.4,2469z M-2412.1,2488.2L-2412.1,2488.2 M-2423.2,2507.4l11.1,6.4V2501l11.1,6.4v-12.8 l-11.1-6.4v-12.8l0,0l-11.1-6.4v12.8l-11.1-6.4v12.8l11.1,6.4V2507.4z'/%3E%3ClinearGradient id='SVGID_2_' gradientUnits='userSpaceOnUse' x1='-2465.9385' y1='2521.2493' x2='-2423.5085' y2='2496.7893' gradientTransform='matrix(1 0 0 -1 0 5004)'%3E%3Cstop offset='0' style='stop-color:%23FF3C2A'/%3E%3Cstop offset='1' style='stop-color:%23FFD215'/%3E%3C/linearGradient%3E%3Cpath class='st2' d='M-2434.3,2513.8V2501l11.1-6.4v12.8L-2434.3,2513.8z M-2434.3,2475.4l11.1,6.4V2469L-2434.3,2475.4z M-2456.5,2488.2L-2456.5,2488.2 M-2445.4,2494.6l11.1-6.4v-12.8l-11.1,6.4V2469l-11.1,6.4l0,0v12.8l-11.1,6.4v12.8l11.1-6.4v12.8 l11.1-6.4V2494.6z M-2456.5,2513.8v12.8l11.1-6.4L-2456.5,2513.8z'/%3E%3C/svg%3E%0A");
background-image: url("druid_logo.png");
}
</style>
</head>

View File

@ -36,6 +36,7 @@
<li><a href="modules/druid.button.html">druid.button</a></li>
<li><a href="modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="modules/druid.drag.html">druid.drag</a></li>
<li><a href="modules/druid.grid.html">druid.grid</a></li>
<li><a href="modules/druid.hover.html">druid.hover</a></li>
<li><a href="modules/druid.input.html">druid.input</a></li>
@ -93,6 +94,10 @@
<td class="name" nowrap><a href="modules/druid.checkbox_group.html">druid.checkbox_group</a></td>
<td class="summary">Checkbox group module</td>
</tr>
<tr>
<td class="name" nowrap><a href="modules/druid.drag.html">druid.drag</a></td>
<td class="summary">Component to handle drag action on node.</td>
</tr>
<tr>
<td class="name" nowrap><a href="modules/druid.grid.html">druid.grid</a></td>
<td class="summary">Component to handle placing components by row and columns.</td>
@ -195,7 +200,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -43,6 +43,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -82,13 +83,9 @@
<h2><a href="#Functions">Functions</a></h2>
<table class="function_list">
<tr>
<td class="name" nowrap><a href="#get_style">get_style()</a></td>
<td class="summary">Get current component style table</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_style">set_style(style)</a></td>
<td class="summary">Set current component style table</td>
<td class="summary">Set current component style table.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#get_template">get_template()</a></td>
@ -135,11 +132,19 @@
<td class="summary">Return druid with context of calling component.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#setup_component">setup_component(table, table)</a></td>
<td class="name" nowrap><a href="#is_child_of">is_child_of()</a></td>
<td class="summary">Return true, if current component is child of another component</td>
</tr>
<tr>
<td class="name" nowrap><a href="#get_name">get_name()</a></td>
<td class="summary">Return component name</td>
</tr>
<tr>
<td class="name" nowrap><a href="#setup_component">setup_component(table, table, table)</a></td>
<td class="summary">Setup component context and his style table</td>
</tr>
<tr>
<td class="name" nowrap><a href="#Component.create">Component.create(name, interest)</a></td>
<td class="name" nowrap><a href="#Component.create">Component.create(name[, interest={}])</a></td>
<td class="summary">Create new component.</td>
</tr>
</table>
@ -151,32 +156,14 @@
<h2 class="section-header "><a name="Functions"></a>Functions</h2>
<dl class="function">
<dt>
<a name = "get_style"></a>
<strong>get_style()</strong>
</dt>
<dd>
Get current component style table
<h3>Returns:</h3>
<ol>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.6">table</a></span>
Component style table
</ol>
</dd>
<dt>
<a name = "set_style"></a>
<strong>set_style(style)</strong>
</dt>
<dd>
Set current component style table
Set current component style table.
Invoke <code>on_style_change</code> on component, if exist. Component should handle
their style changing and store all style params
<h3>Parameters:</h3>
@ -413,10 +400,50 @@
</dd>
<dt>
<a name = "is_child_of"></a>
<strong>is_child_of()</strong>
</dt>
<dd>
Return true, if current component is child of another component
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">bool</span></span>
True, if current component is child of another
</ol>
</dd>
<dt>
<a name = "get_name"></a>
<strong>get_name()</strong>
</dt>
<dd>
Return component name
<h3>Returns:</h3>
<ol>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.4">string</a></span>
The component name
</ol>
</dd>
<dt>
<a name = "setup_component"></a>
<strong>setup_component(table, table)</strong>
<strong>setup_component(table, table, table)</strong>
</dt>
<dd>
Setup component context and his style table
@ -432,6 +459,10 @@
<span class="types"><span class="type">style</span></span>
Druid style module
</li>
<li><span class="parameter">table</span>
<span class="types"><span class="type">style</span></span>
Druid style module
</li>
</ul>
<h3>Returns:</h3>
@ -447,7 +478,7 @@
</dd>
<dt>
<a name = "Component.create"></a>
<strong>Component.create(name, interest)</strong>
<strong>Component.create(name[, interest={}])</strong>
</dt>
<dd>
Create new component. It will inheritance from basic
@ -463,6 +494,7 @@
<li><span class="parameter">interest</span>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.6">table</a></span>
List of component's interest
(<em>default</em> {})
</li>
</ul>
@ -478,7 +510,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -217,7 +218,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -236,7 +237,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><strong>druid.button</strong></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -122,7 +123,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -381,11 +382,28 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
<ul>
<li><span class="parameter">LONGTAP_TIME</span>
<span class="types"><span class="type">number</span></span>
Minimum time to trigger on<em>hold</em>callback
(<em>default</em> 0.4)
</li>
<li><span class="parameter">AUTOHOLD_TRIGGER</span>
<span class="types"><span class="type">number</span></span>
Maximum hold time to trigger button release while holding
(<em>default</em> 0.8)
</li>
<li><span class="parameter">DOUBLETAP_TIME</span>
<span class="types"><span class="type">number</span></span>
Time between double taps
(<em>default</em> 0.4)
</li>
<li><span class="parameter">on_click</span>
<span class="types"><span class="type">function</span></span>
(self, node)
@ -398,6 +416,10 @@
<span class="types"><span class="type">function</span></span>
(self, node, hover_state)
</li>
<li><span class="parameter">on_mouse_hover</span>
<span class="types"><span class="type">function</span></span>
(self, node, hover_state)
</li>
<li><span class="parameter">on_set_enabled</span>
<span class="types"><span class="type">function</span></span>
(self, node, enabled_state)
@ -416,7 +438,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><strong>druid.checkbox</strong></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -110,7 +111,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -256,7 +257,9 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
@ -279,7 +282,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><strong>druid.checkbox_group</strong></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -241,7 +242,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -0,0 +1,289 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<head>
<title>Defold Druid UI Library</title>
<link rel="stylesheet" href="../ldoc_fixed.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="product">
<div id="product_logo"></div>
<div id="product_name"><big><b></b></big></div>
<div id="product_description"></div>
</div> <!-- id="product" -->
<div id="main">
<!-- Menu -->
<div id="navigation">
<br/>
<h1>Druid</h1>
<ul>
<li><a href="../index.html">Index</a></li>
</ul>
<h2>Contents</h2>
<ul>
<li><a href="#Functions">Functions</a></li>
<li><a href="#Tables">Tables</a></li>
</ul>
<h2>Modules</h2>
<ul class="nowrap">
<li><a href="../modules/druid.back_handler.html">druid.back_handler</a></li>
<li><a href="../modules/druid.blocker.html">druid.blocker</a></li>
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><strong>druid.drag</strong></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
<li><a href="../modules/druid.lang_text.html">druid.lang_text</a></li>
<li><a href="../modules/druid.progress.html">druid.progress</a></li>
<li><a href="../modules/druid.radio_group.html">druid.radio_group</a></li>
<li><a href="../modules/druid.scroll.html">druid.scroll</a></li>
<li><a href="../modules/druid.slider.html">druid.slider</a></li>
<li><a href="../modules/druid.swipe.html">druid.swipe</a></li>
<li><a href="../modules/druid.text.html">druid.text</a></li>
<li><a href="../modules/druid.timer.html">druid.timer</a></li>
<li><a href="../modules/component.html">component</a></li>
<li><a href="../modules/druid.html">druid</a></li>
<li><a href="../modules/druid_event.html">druid_event</a></li>
<li><a href="../modules/druid.helper.html">druid.helper</a></li>
<li><a href="../modules/druid_instance.html">druid_instance</a></li>
</ul>
<h2>Topics</h2>
<ul class="">
<li><a href="../topics/01-components.md.html">01-components</a></li>
<li><a href="../topics/02-creating_custom_components.md.html">Creating custom components</a></li>
<li><a href="../topics/03-styles.md.html">Styles</a></li>
<li><a href="../topics/04-druid_assets.md.html">Druid assets</a></li>
<li><a href="../topics/05-examples.md.html">Examples</a></li>
<li><a href="../topics/changelog.md.html">changelog</a></li>
<li><a href="../topics/README.md.html">README</a></li>
</ul>
</div>
<div id="content">
<h1>Module <code>druid.drag</code></h1>
<p>Component to handle drag action on node.</p>
<p> Drag have correct handling for multitouch and swap
touched while dragging. Drag will be processed even
the cursor is outside of node, if drag is already started</p>
<h2><a href="#Functions">Functions</a></h2>
<table class="function_list">
<tr>
<td class="name" nowrap><a href="#init">init(node, on_drag_callback)</a></td>
<td class="summary">Drag component constructor</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_click_zone">set_click_zone(zone)</a></td>
<td class="summary">Strict drag click area.</td>
</tr>
</table>
<h2><a href="#Tables">Tables</a></h2>
<table class="function_list">
<tr>
<td class="name" nowrap><a href="#Events">Events</a></td>
<td class="summary">Component events</td>
</tr>
<tr>
<td class="name" nowrap><a href="#Fields">Fields</a></td>
<td class="summary">Components fields</td>
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params.</td>
</tr>
</table>
<br/>
<br/>
<h2 class="section-header "><a name="Functions"></a>Functions</h2>
<dl class="function">
<dt>
<a name = "init"></a>
<strong>init(node, on_drag_callback)</strong>
</dt>
<dd>
Drag component constructor
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">node</span>
<span class="types"><span class="type">node</span></span>
GUI node to detect dragging
</li>
<li><span class="parameter">on_drag_callback</span>
<span class="types"><span class="type">function</span></span>
Callback for on<em>drag</em>event(self, dx, dy)
</li>
</ul>
</dd>
<dt>
<a name = "set_click_zone"></a>
<strong>set_click_zone(zone)</strong>
</dt>
<dd>
Strict drag click area. Useful for
restrict events outside stencil node
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">zone</span>
<span class="types"><span class="type">node</span></span>
Gui node
</li>
</ul>
</dd>
</dl>
<h2 class="section-header "><a name="Tables"></a>Tables</h2>
<dl class="function">
<dt>
<a name = "Events"></a>
<strong>Events</strong>
</dt>
<dd>
Component events
<h3>Fields:</h3>
<ul>
<li><span class="parameter">on_touch_start</span>
<span class="types"><span class="type">druid_event</span></span>
(self) Event on touch start
</li>
<li><span class="parameter">on_touch_end</span>
<span class="types"><span class="type">druid_event</span></span>
(self) Event on touch end
</li>
<li><span class="parameter">on_drag_start</span>
<span class="types"><span class="type">druid_event</span></span>
(self) Event on drag start
</li>
<li><span class="parameter">on_drag</span>
<span class="types"><span class="type">druid_event</span></span>
(self, dx, dy) Event on drag progress
</li>
<li><span class="parameter">on_drag_end</span>
<span class="types"><span class="type">druid_event</span></span>
(self) Event on drag end
</li>
</ul>
</dd>
<dt>
<a name = "Fields"></a>
<strong>Fields</strong>
</dt>
<dd>
Components fields
<h3>Fields:</h3>
<ul>
<li><span class="parameter">is_touch</span>
<span class="types"><span class="type">bool</span></span>
Is component now touching
</li>
<li><span class="parameter">is_drag</span>
<span class="types"><span class="type">bool</span></span>
Is component now dragging
</li>
<li><span class="parameter">can_x</span>
<span class="types"><span class="type">bool</span></span>
Is drag component process vertical dragging. Default - true
</li>
<li><span class="parameter">can_y</span>
<span class="types"><span class="type">bool</span></span>
Is drag component process horizontal. Default - true
</li>
<li><span class="parameter">x</span>
<span class="types"><span class="type">number</span></span>
Current touch x position
</li>
<li><span class="parameter">y</span>
<span class="types"><span class="type">number</span></span>
Current touch y position
</li>
<li><span class="parameter">touch_start_pos</span>
<span class="types"><span class="type">vector3</span></span>
Touch start position
</li>
</ul>
</dd>
<dt>
<a name = "Style"></a>
<strong>Style</strong>
</dt>
<dd>
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
<ul>
<li><span class="parameter">DRAG_DEADZONE</span>
<span class="types"><span class="type">number</span></span>
Distance in pixels to start dragging
(<em>default</em> 10)
</li>
</ul>
</dd>
</dl>
</div> <!-- id="content" -->
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>
</html>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><strong>druid.grid</strong></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -109,7 +110,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#clear">clear()</a></td>
<td class="summary">Clear all items from the grid</td>
<td class="summary">Clear grid nodes array.</td>
</tr>
</table>
<h2><a href="#Tables">Tables</a></h2>
@ -274,7 +275,8 @@
<strong>clear()</strong>
</dt>
<dd>
Clear all items from the grid
Clear grid nodes array. GUI nodes will be not deleted!
If you want to delete GUI nodes, use grid.nodes array before grid:clear
@ -372,7 +374,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -43,6 +43,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -100,6 +101,18 @@
<td class="name" nowrap><a href="#get_pivot_offset">get_pivot_offset(pivot)</a></td>
<td class="summary">Get node offset for given gui pivot</td>
</tr>
<tr>
<td class="name" nowrap><a href="#helper..is_mobile">helper..is_mobile()</a></td>
<td class="summary">Check if device is mobile (Android or iOS)</td>
</tr>
<tr>
<td class="name" nowrap><a href="#is_web">is_web()</a></td>
<td class="summary">Check if device is HTML5</td>
</tr>
<tr>
<td class="name" nowrap><a href="#get_border">get_border()</a></td>
<td class="summary">Distance from node to size border</td>
</tr>
</table>
<br/>
@ -230,6 +243,53 @@
</dd>
<dt>
<a name = "helper..is_mobile"></a>
<strong>helper..is_mobile()</strong>
</dt>
<dd>
Check if device is mobile (Android or iOS)
</dd>
<dt>
<a name = "is_web"></a>
<strong>is_web()</strong>
</dt>
<dd>
Check if device is HTML5
</dd>
<dt>
<a name = "get_border"></a>
<strong>get_border()</strong>
</dt>
<dd>
Distance from node to size border
<h3>Returns:</h3>
<ol>
vector4 (left, top, right, down)
</ol>
</dd>
</dl>
@ -238,7 +298,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><strong>druid.hover</strong></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -94,6 +95,10 @@
<td class="summary">Set hover state</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_mouse_hover">set_mouse_hover(state)</a></td>
<td class="summary">Set mouse hover state</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_click_zone">set_click_zone(zone)</a></td>
<td class="summary">Strict hover click area.</td>
</tr>
@ -158,6 +163,27 @@
</dd>
<dt>
<a name = "set_mouse_hover"></a>
<strong>set_mouse_hover(state)</strong>
</dt>
<dd>
Set mouse hover state
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">state</span>
<span class="types"><span class="type">bool</span></span>
The mouse hover state
</li>
</ul>
</dd>
<dt>
<a name = "set_click_zone"></a>
@ -197,7 +223,11 @@
<ul>
<li><span class="parameter">on_hover</span>
<span class="types"><span class="type">druid_event</span></span>
On hover callback
On hover callback (Touch pressed)
</li>
<li><span class="parameter">on_mouse_hover</span>
<span class="types"><span class="type">druid_event</span></span>
On mouse hover callback (Touch over without action_id)
</li>
</ul>
@ -213,7 +243,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -43,6 +43,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -114,7 +115,9 @@
</tr>
<tr>
<td class="name" nowrap><a href="#set_text_function">set_text_function(callback)</a></td>
<td class="summary">Set text function.</td>
<td class="summary">Set text function
Druid locale component will call this function
to get translated text.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_sound_function">set_sound_function(callback)</a></td>
@ -226,9 +229,9 @@
<strong>set_text_function(callback)</strong>
</dt>
<dd>
Set text function.
Set text function
Druid locale component will call this function
to get translated text. After set<em>text</em>funtion
to get translated text. After set<em>text</em>funtion
all existing locale component will be updated
@ -326,7 +329,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><strong>druid.input</strong></li>
@ -96,11 +97,11 @@
<td class="summary">Return current input field text</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_max_length">set_max_length(max_length, Self)</a></td>
<td class="name" nowrap><a href="#set_max_length">set_max_length(max_length)</a></td>
<td class="summary">Set maximum length for input field.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_allowerd_characters">set_allowerd_characters(characters, Self)</a></td>
<td class="name" nowrap><a href="#set_allowerd_characters">set_allowerd_characters(characters)</a></td>
<td class="summary">Set allowed charaters for input field.</td>
</tr>
<tr>
@ -120,7 +121,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -174,7 +175,7 @@
</dd>
<dt>
<a name = "set_max_length"></a>
<strong>set_max_length(max_length, Self)</strong>
<strong>set_max_length(max_length)</strong>
</dt>
<dd>
Set maximum length for input field.
@ -187,12 +188,14 @@
<span class="types"><span class="type">number</span></span>
Maximum length for input text field
</li>
<li><span class="parameter">Self</span>
<span class="types"><span class="type">druid.input</span></span>
instance to make chain calls
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.input</span></span>
Self instance to make chain calls
</ol>
@ -200,7 +203,7 @@
</dd>
<dt>
<a name = "set_allowerd_characters"></a>
<strong>set_allowerd_characters(characters, Self)</strong>
<strong>set_allowerd_characters(characters)</strong>
</dt>
<dd>
Set allowed charaters for input field.
@ -214,12 +217,14 @@
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.4">string</a></span>
Regulax exp. for validate user input
</li>
<li><span class="parameter">Self</span>
<span class="types"><span class="type">druid.input</span></span>
instance to make chain calls
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.input</span></span>
Self instance to make chain calls
</ol>
@ -336,7 +341,9 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
@ -344,14 +351,12 @@
<li><span class="parameter">IS_LONGTAP_ERASE</span>
<span class="types"><span class="type">bool</span></span>
Is long tap will erase current input data
</li>
<li><span class="parameter">BUTTON_SELECT_INCREASE</span>
<span class="types"><span class="type">number</span></span>
Button scale multiplier on selecting input field
(<em>default</em> false)
</li>
<li><span class="parameter">MASK_DEFAULT_CHAR</span>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.4">string</a></span>
Default character mask for password input
(<em>default</em> *)
</li>
<li><span class="parameter">on_select</span>
<span class="types"><span class="type">function</span></span>
@ -365,7 +370,7 @@
<span class="types"><span class="type">function</span></span>
(self, button_node) Callback on wrong user input
</li>
<li><span class="parameter">button</span>
<li><span class="parameter">button_style</span>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.6">table</a></span>
Custom button style for input node
</li>
@ -383,7 +388,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -242,7 +243,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -124,7 +125,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -354,7 +355,9 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
@ -362,10 +365,12 @@
<li><span class="parameter">SPEED</span>
<span class="types"><span class="type">number</span></span>
Progress bas fill rate. More -> faster
(<em>default</em> 5)
</li>
<li><span class="parameter">MIN_DELTA</span>
<span class="types"><span class="type">number</span></span>
Minimum step to fill progress bar
(<em>default</em> 0.005)
</li>
</ul>
@ -381,7 +386,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -241,7 +242,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -89,40 +90,48 @@
<h2><a href="#Functions">Functions</a></h2>
<table class="function_list">
<tr>
<td class="name" nowrap><a href="#init">init(scroll_parent, input_zone)</a></td>
<td class="summary">Component init function</td>
<td class="name" nowrap><a href="#init">init(view_node, content_node)</a></td>
<td class="summary">Scroll constructor.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#scroll_to">scroll_to(vector3[, is_instant])</a></td>
<td class="summary">Start scroll to target point</td>
<td class="summary">Start scroll to target point.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#scroll_to_index">scroll_to_index(index[, skip_cb])</a></td>
<td class="summary">Scroll to item in scroll by point index.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#scroll_to_percent">scroll_to_percent(vector3[, is_instant])</a></td>
<td class="summary">Start scroll to target scroll percent</td>
</tr>
<tr>
<td class="name" nowrap><a href="#init">init(index[, skip_cb])</a></td>
<td class="summary">Scroll to item in scroll by point index</td>
<td class="name" nowrap><a href="#get_percent">get_percent()</a></td>
<td class="summary">Return current scroll progress status.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_points">set_points(points)</a></td>
<td class="summary">Set points of interest.</td>
<td class="name" nowrap><a href="#set_size">set_size(size)</a></td>
<td class="summary">Set scroll content size.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_inert">set_inert(state)</a></td>
<td class="summary">Enable or disable scroll inert.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#on_point_move">on_point_move(callback)</a></td>
<td class="summary">Set the callback on scrolling to point (if exist)</td>
<td class="name" nowrap><a href="#is_inert">is_inert()</a></td>
<td class="summary">Return if scroll have inertion.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_border">set_border(border)</a></td>
<td class="summary">Set the scroll possibly area</td>
<td class="name" nowrap><a href="#set_extra_strech_size">set_extra_strech_size([stretch_size=0])</a></td>
<td class="summary">Set extra size for scroll stretching.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#get_scroll_percent">get_scroll_percent()</a></td>
<td class="summary">Return current scroll progress</td>
<td class="name" nowrap><a href="#get_scroll_size">get_scroll_size()</a></td>
<td class="summary">Return vector of scroll size with width and height.</td>
</tr>
<tr>
<td class="name" nowrap><a href="#set_points">set_points(points)</a></td>
<td class="summary">Set points of interest.</td>
</tr>
</table>
<h2><a href="#Tables">Tables</a></h2>
@ -137,7 +146,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -150,21 +159,21 @@
<dl class="function">
<dt>
<a name = "init"></a>
<strong>init(scroll_parent, input_zone)</strong>
<strong>init(view_node, content_node)</strong>
</dt>
<dd>
Component init function
Scroll constructor.
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">scroll_parent</span>
<li><span class="parameter">view_node</span>
<span class="types"><span class="type">node</span></span>
Gui node where placed scroll content. This node will change position
GUI view scroll node
</li>
<li><span class="parameter">input_zone</span>
<li><span class="parameter">content_node</span>
<span class="types"><span class="type">node</span></span>
Gui node where input is catched
GUI content scroll node
</li>
</ul>
@ -178,18 +187,18 @@
<strong>scroll_to(vector3[, is_instant])</strong>
</dt>
<dd>
Start scroll to target point
Start scroll to target point.
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">vector3</span>
<span class="types"><span class="type">point</span></span>
target point
Target point
</li>
<li><span class="parameter">is_instant</span>
<span class="types"><span class="type">bool</span></span>
instant scroll flag
Instant scroll flag
(<em>optional</em>)
</li>
</ul>
@ -203,6 +212,32 @@
<li><pre class="example">scroll:scroll_to(vmath.vector3(<span class="number">0</span>), <span class="keyword">true</span>)</pre></li>
</ul>
</dd>
<dt>
<a name = "scroll_to_index"></a>
<strong>scroll_to_index(index[, skip_cb])</strong>
</dt>
<dd>
Scroll to item in scroll by point index.
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">index</span>
<span class="types"><span class="type">number</span></span>
Point index
</li>
<li><span class="parameter">skip_cb</span>
<span class="types"><span class="type">bool</span></span>
If true, skip the point callback
(<em>optional</em>)
</li>
</ul>
</dd>
<dt>
<a name = "scroll_to_percent"></a>
@ -235,48 +270,49 @@
</dd>
<dt>
<a name = "init"></a>
<strong>init(index[, skip_cb])</strong>
<a name = "get_percent"></a>
<strong>get_percent()</strong>
</dt>
<dd>
Scroll to item in scroll by point index
Return current scroll progress status.
Values will be in [0..1] interval
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">index</span>
<span class="types"><span class="type">number</span></span>
Point index
</li>
<li><span class="parameter">skip_cb</span>
<span class="types"><span class="type">bool</span></span>
If true, skip the point callback
(<em>optional</em>)
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">vector3</span></span>
New vector with scroll progress values
</ol>
</dd>
<dt>
<a name = "set_points"></a>
<strong>set_points(points)</strong>
<a name = "set_size"></a>
<strong>set_size(size)</strong>
</dt>
<dd>
Set points of interest.
Scroll will always centered on closer points
Set scroll content size.
It will change content gui node size
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">points</span>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.6">table</a></span>
Array of vector3 points
<li><span class="parameter">size</span>
<span class="types"><span class="type">vector3</span></span>
The new size for content node
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.scroll</span></span>
Self instance
</ol>
@ -300,59 +336,72 @@
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.scroll</span></span>
Self instance
</ol>
</dd>
<dt>
<a name = "on_point_move"></a>
<strong>on_point_move(callback)</strong>
<a name = "is_inert"></a>
<strong>is_inert()</strong>
</dt>
<dd>
Set the callback on scrolling to point (if exist)
Return if scroll have inertion.
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">bool</span></span>
If scroll have inertion
</ol>
</dd>
<dt>
<a name = "set_extra_strech_size"></a>
<strong>set_extra_strech_size([stretch_size=0])</strong>
</dt>
<dd>
Set extra size for scroll stretching.
Set 0 to disable stretching effect
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">callback</span>
<span class="types"><span class="type">function</span></span>
Callback on scroll to point of interest
<li><span class="parameter">stretch_size</span>
<span class="types"><span class="type">number</span></span>
Size in pixels of additional scroll area
(<em>default</em> 0)
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.scroll</span></span>
Self instance
</ol>
</dd>
<dt>
<a name = "set_border"></a>
<strong>set_border(border)</strong>
<a name = "get_scroll_size"></a>
<strong>get_scroll_size()</strong>
</dt>
<dd>
Set the scroll possibly area
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">border</span>
<span class="types"><span class="type">vector3</span></span>
Size of scrolling area
</li>
</ul>
</dd>
<dt>
<a name = "get_scroll_percent"></a>
<strong>get_scroll_percent()</strong>
</dt>
<dd>
Return current scroll progress
Return vector of scroll size with width and height.
@ -360,7 +409,35 @@
<ol>
<span class="types"><span class="type">vector3</span></span>
Scroll progress
Available scroll size
</ol>
</dd>
<dt>
<a name = "set_points"></a>
<strong>set_points(points)</strong>
</dt>
<dd>
Set points of interest.
Scroll will always centered on closer points
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">points</span>
<span class="types"><a class="type" href="https://www.lua.org/manual/5.3/manual.html#6.6">table</a></span>
Array of vector3 points
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">druid.scroll</span></span>
Self instance
</ol>
@ -410,42 +487,51 @@
<h3>Fields:</h3>
<ul>
<li><span class="parameter">node</span>
<li><span class="parameter">view_node</span>
<span class="types"><span class="type">node</span></span>
Scroll parent node
Scroll view node
</li>
<li><span class="parameter">input_zone</span>
<li><span class="parameter">content_node</span>
<span class="types"><span class="type">node</span></span>
Scroll input node
</li>
<li><span class="parameter">zone_size</span>
<span class="types"><span class="type">vector3</span></span>
Current scroll content size
</li>
<li><span class="parameter">soft_size</span>
<span class="types"><span class="type">number</span></span>
Soft zone size from style table
</li>
<li><span class="parameter">center_offset</span>
<span class="types"><span class="type">vector3</span></span>
Distance from node to node's center
Scroll content node
</li>
<li><span class="parameter">is_inert</span>
<span class="types"><span class="type">bool</span></span>
Flag, if scroll now moving by inertion
</li>
<li><span class="parameter">inert</span>
<li><span class="parameter">inertion</span>
<span class="types"><span class="type">vector3</span></span>
Current inert speed
</li>
<li><span class="parameter">pos</span>
<li><span class="parameter">position</span>
<span class="types"><span class="type">vector3</span></span>
Current scroll posisition
</li>
<li><span class="parameter">target</span>
<li><span class="parameter">target_position</span>
<span class="types"><span class="type">vector3</span></span>
Current scroll target position
</li>
<li><span class="parameter">available_pos</span>
<span class="types"><span class="type">vector4</span></span>
Available position for content node: (min<em>x, max</em>y, max<em>x, min</em>y)
</li>
<li><span class="parameter">available_size</span>
<span class="types"><span class="type">vector3</span></span>
Size of available positions: (width, height, 0)
</li>
<li><span class="parameter">drag</span>
<span class="types"><span class="type">druid.drag</span></span>
Drag component
</li>
<li><span class="parameter">Current</span>
<span class="types"><span class="type">selected</span></span>
index of points of interests
(<em>optional</em>)
</li>
<li><span class="parameter">is_animate</span>
<span class="types"><span class="type">bool</span></span>
Flag, if scroll now animating by gui.animate
</li>
</ul>
@ -458,42 +544,57 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
<ul>
<li><span class="parameter">FRICT_HOLD</span>
<span class="types"><span class="type">number</span></span>
Multiplier for inertion, while touching
</li>
<li><span class="parameter">FRICT</span>
<span class="types"><span class="type">number</span></span>
Multiplier for free inertion
(<em>default</em> 0)
</li>
<li><span class="parameter">FRICT_HOLD</span>
<span class="types"><span class="type">number</span></span>
Multiplier for inertion, while touching
(<em>default</em> 0)
</li>
<li><span class="parameter">INERT_THRESHOLD</span>
<span class="types"><span class="type">number</span></span>
Scroll speed to stop inertion
(<em>default</em> 3)
</li>
<li><span class="parameter">INERT_SPEED</span>
<span class="types"><span class="type">number</span></span>
Multiplier for inertion speed
(<em>default</em> 30)
</li>
<li><span class="parameter">DEADZONE</span>
<li><span class="parameter">POINTS_DEADZONE</span>
<span class="types"><span class="type">number</span></span>
Deadzone for start scrol in pixels
</li>
<li><span class="parameter">SOFT_ZONE_SIZE</span>
<span class="types"><span class="type">number</span></span>
Size of outside zone in pixels (for scroll back moving)
Speed to check points of interests in no_inertion mode
(<em>default</em> 20)
</li>
<li><span class="parameter">BACK_SPEED</span>
<span class="types"><span class="type">number</span></span>
Scroll back returning lerp speed
(<em>default</em> 0.35)
</li>
<li><span class="parameter">ANIM_SPEED</span>
<span class="types"><span class="type">number</span></span>
Scroll gui.animation speed for scroll_to function
(<em>default</em> 0.2)
</li>
<li><span class="parameter">EXTRA_STRECH_SIZE</span>
<span class="types"><span class="type">number</span></span>
extra size in pixels outside of scroll (stretch effect)
(<em>default</em> 0)
</li>
<li><span class="parameter">SMALL_CONTENT_SCROLL</span>
<span class="types"><span class="type">bool</span></span>
If true, content node with size less than view node size can be scrolled
(<em>default</em> false)
</li>
</ul>
@ -509,7 +610,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -280,7 +281,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -105,7 +106,7 @@
</tr>
<tr>
<td class="name" nowrap><a href="#Style">Style</a></td>
<td class="summary">Component style params</td>
<td class="summary">Component style params.</td>
</tr>
</table>
@ -219,7 +220,9 @@
<strong>Style</strong>
</dt>
<dd>
Component style params
Component style params.
You can override this component styles params in druid styles table
or create your own style
<h3>Fields:</h3>
@ -227,14 +230,17 @@
<li><span class="parameter">SWIPE_TIME</span>
<span class="types"><span class="type">number</span></span>
Maximum time for swipe trigger
(<em>default</em> 0.4)
</li>
<li><span class="parameter">SWIPE_THRESHOLD</span>
<span class="types"><span class="type">number</span></span>
Minimum distance for swipe trigger
(<em>default</em> 50)
</li>
<li><span class="parameter">SWIPE_TRIGGER_ON_MOVE</span>
<span class="types"><span class="type">bool</span></span>
If true, trigger on swipe moving, not only release action
(<em>default</em> false)
</li>
</ul>
@ -250,7 +256,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -309,7 +310,7 @@
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">boolean</span></span>
<span class="types"><span class="type">bool</span></span>
Is text node with line break
</ol>
@ -406,7 +407,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -44,6 +44,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -295,7 +296,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -43,6 +43,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -241,7 +242,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -43,6 +43,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -96,6 +97,7 @@
<li><a href="../modules/druid.checkbox_group.html#">druid.checkbox_group</a></li>
<li><a href="../modules/druid.radio_group.html#">druid.radio_group</a></li>
<li><a href="../modules/druid.swipe.html#">druid.swipe</a></li>
<li><a href="../modules/druid.drag.html#">druid.drag</a></li>
</ul>
@ -209,6 +211,10 @@
<td class="name" nowrap><a href="#druid:new_swipe">druid:new_swipe(...)</a></td>
<td class="summary">Create swipe basic component</td>
</tr>
<tr>
<td class="name" nowrap><a href="#druid:new_drag">druid:new_drag(...)</a></td>
<td class="summary">Create drag basic component</td>
</tr>
</table>
<br/>
@ -872,6 +878,33 @@
</dd>
<dt>
<a name = "druid:new_drag"></a>
<strong>druid:new_drag(...)</strong>
</dt>
<dd>
Create drag basic component
<h3>Parameters:</h3>
<ul>
<li><span class="parameter">...</span>
<span class="types"><span class="type">args</span></span>
drag init args
</li>
</ul>
<h3>Returns:</h3>
<ol>
<span class="types"><span class="type">Componetn</span></span>
drag component
</ol>
</dd>
</dl>
@ -880,7 +913,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -48,6 +48,7 @@
<li><a href="#Grid">Grid </a></li>
<li><a href="#Hover">Hover </a></li>
<li><a href="#Swipe">Swipe </a></li>
<li><a href="#Drag">Drag </a></li>
</ul>
@ -68,6 +69,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -157,7 +159,7 @@ Where node name is name of node from GUI scene. You can use <code>node_name</cod
<p><a name="Blocker"></a></p>
<h2>Blocker</h2>
<p><a href="https://insality.github.io/druid/modules/druid.button.html">Blocker API here</a></p>
<p><a href="https://insality.github.io/druid/modules/druid.blocker.html">Blocker API here</a></p>
<h3>Overview</h3>
<p>Druid component for block input. Use it to block input in special zone.</p>
@ -210,32 +212,35 @@ Where node name is name of node from GUI scene. You can use <code>node_name</cod
<p>Basic Druid scroll component. Handle all scrolling stuff in druid GUI</p>
<h3>Setup</h3>
<p>Create scroll component with druid: <code>scroll = druid:new_scroll(scroll_parent, scroll_input)</code>.</p>
<p>Create scroll component with druid: <code>scroll = druid:new_scroll(view_node, content_node)</code>.</p>
<p><em>Scroll parent</em> - is dynamic part. This node will change position by scroll system</p>
<p><em>View</em>node_ - is static part. It capturing user input and recognize scrolling touches</p>
<p><em>Scroll input</em> - is static part. It capturing user input and recognize scrolling touches</p>
<p><em>Content</em>node_ - is dynamic part. This node will change position by scroll system</p>
<p>Initial scroll size will be equal to <em>scroll parent</em> node size. The initial view box will be equal to <em>scroll input</em> node size</p>
<p>Initial scroll size will be equal to <em>content</em>node_ node size. The initial view box will be equal to <em>view</em>node_ node size</p>
<p>Usually, Place static input zone part, and as children add scroll parent part:
<p>Usually, Place <em>view</em>node_ and as children add <em>content</em>node_:
<img src="../media/scroll_scheme.png" alt=""/>
<img src="../media/scroll_outline.png" alt=""/></p>
<p>*Here scroll<em>content</em>zone below input zone, in game content zone be able to scroll left until end*</p>
<p>*Here content<em>node below view</em>node, in game content_node be able to scroll left until end*</p>
<h3>Notes</h3>
<p>- Scroll by default style have inertion and "back moving". It can be adjust via scroll <a href="https://insality.github.io/druid/modules/druid.scroll.html#Style">style settings</a>
<p>- Scroll by default style have inertion and extra size for strecthing effect. It can be adjust via scroll <a href="https://insality.github.io/druid/modules/druid.scroll.html#Style">style settings</a>
- You can setup "points of interest". Scroll always will be centered on closes point of interest. It is able to create slider without inertion and points of interest on each scroll element.
- Scroll have next events:</p>
<pre>
- *on_scroll* On scroll move callback
- *on_scroll_to* On scroll_to <span class="keyword">function</span> callback
- *on_point_scroll* On scroll_to_index <span class="keyword">function</span> callback
- *on_scroll* (self, position) On scroll move callback
- *on_scroll_to* (self, position, is_instant) On scroll_to <span class="keyword">function</span> callback
- *on_point_scroll* (self, item_index, position) On scroll_to_index <span class="keyword">function</span> callback
</pre>
<p>- You can adjust scroll content size by <code>scroll:set_border(node_size)</code>. It will setup new size to content node.</p>
<p>- You can adjust scroll content size by <code>scroll:set_size(node_size)</code>. It will setup new size to <em>content node</em>
- You can enabled or disable inertion mode via <code>scroll:set_intert(state)</code>
- You can adjust extra stretch size via <code>scroll:set_extra_stretch_size</code>
- Multitouch is required for scroll. Scroll is correctly handling touch_id swap while dragging scroll</p>
<p><a name="Progress"></a></p>
@ -360,7 +365,7 @@ Key is value from druid const: const.SIDE.X (or just "x") or const.SIDE.Y (or ju
<p>Component for manage node positions. Very simple implementation for nodes with equal size</p>
<h3>Setup</h3>
<p>Create grid component with druid: <code>grid = druid:new_grid(parent_node, prefab_node, max_in_row_elements)</code></p>
<p>Create component with druid: <code>grid = druid:new_grid(parent_node, prefab_node, max_in_row_elements)</code></p>
<h3>Notes</h3>
<p>- Grid on <em>adding elements</em> will setup parent to <em>parent</em>node_
@ -380,6 +385,8 @@ Key is value from druid const: const.SIDE.X (or just "x") or const.SIDE.Y (or ju
<p>Create hover component with druid: <code>hover = druid:new_hover(node, callback)</code></p>
<h3>Notes</h3>
<p>- By default, hover handles <em>hover event</em> with pressed touch action_id. So it's mean, what mouse or touch have to be pressed
- On desktop platforms there is <em>on</em>mouse<em>hover</em> event. It's event on mouse hover without any action id</p>
<p><a name="Swipe"></a></p>
@ -390,7 +397,7 @@ Key is value from druid const: const.SIDE.X (or just "x") or const.SIDE.Y (or ju
<p>System Druid component, handle swipe actions on node</p>
<h3>Setup</h3>
<p>Create hover component with druid: <code>hover = druid:new_swipe(node, swipe_callback)</code></p>
<p>Create swipe component with druid: <code>hover = druid:new_swipe(node, swipe_callback)</code></p>
<h3>Notes</h3>
<p>- Swipe callback have next params: (self, swipe_side, distance, time)</p>
@ -403,16 +410,60 @@ Key is value from druid const: const.SIDE.X (or just "x") or const.SIDE.Y (or ju
</pre>
<p>- Swipe trigger only, if all input actions was on swipe node. If action will be outside of node, swipe status will be reseted
- In swipe style table you can adjust minimal distance and maximum time to trigger swipe
- In swipe style table you can adjust minimal distance and maximum time to trigg- Hover state trigger only with touch on mobile devices or button mouse holding. Just mouse over swipe
- In swipe style table you can toggle type of swipe triggering. if SWIPE<em>TRIGGER</em>ON_MOVE setup to true - swipe will trigger as swipe can be triggered. If setup to false - swipe will trigger only on released action
- If you have stencil on swipe node and you don't want trigger it outside of stencil node, you can use <a href="../modules/druid.swipe.html#set_click_zone">swipe:set_click_zone</a> to restrict swipe zone</p>
- If you have stencil on swipe node and you don't want trigger it outside of stencil node, you can use <a href="../modules/druid.swipe.html#set_click_zone">swipe:set_click_zone</a> to restrict swipe zonethout buttons is now not allowed.</p>
<p><a name="Drag"></a></p>
<h2>Drag</h2>
<p><a href="https://insality.github.io/druid/modules/druid.drag.html">Drag API here</a></p>
<h3>Overview</h3>
<p>System Druid component, handle drag actions on node</p>
<h3>Setup</h3>
<p>Create drag component with druid: <code>hover = druid:new_drag(node, drag_callback)</code></p>
<h3>Notes</h3>
<p>- Drag callback have next params: (self, swipe_side, distance, time)</p>
<pre>
- **self**: Druid self context
- **dx**: *number* - delta x position
- **dy**: *number* - delta y position
</pre>
<p>- In styles, you can point the drag start deadzone. Default value is 10 pixels
- Drag correctly process multitouch. You can switch touch_id, while dragging on node with correct <em>dx</em> and <em>dy</em> values (made for correct scrolling)
- You can restrict horizontal or vertical dragging by setting <code>drag.can_x</code> or <code>drag.can_y</code> to <em>false</em> value
- You can get info about current drag state:</p>
<pre>
- _is_touch_ - Is currently node touching
- _is_drag_ - Is currently node is dragging
- _x_ <span class="keyword">and</span> _y_ - Current touch position
- _touch_start_pos_ - Touch stat positions
</pre>
<p>- Drag have next events:</p>
<pre>
- _on_touch_start_ (self) - Event on touch start
- _on_touch_end_ (self) - Event on touch <span class="keyword">end</span>
- _on_drag_start_ (self) - Event on drag start
- _on_drag_ (self, dx, dy) - Event on drag process
- _on_drag_end_ (self) - Event on drag <span class="keyword">end</span>
</pre>
<p>- Drag node zone can be restricted via <code>drag:set_click_zone(node)</code></p>
</div> <!-- id="content" -->
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -56,6 +56,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -112,6 +113,10 @@
</span><span class="keyword">function</span> M.on_input(self, action_id, action)
<span class="keyword">end</span>
<span class="comment">-- Call on component creation and on component:set_style() function
</span><span class="keyword">function</span> M.on_style_change(self, style)
<span class="keyword">end</span>
<span class="comment">-- Call only if exist interest: const.ON_MESSAGE
</span><span class="keyword">function</span> M.on_message(self, message_id, message, sender)
<span class="keyword">end</span>
@ -225,10 +230,6 @@ There is next interests in druid:
<span class="comment">-- Button self on callback is self of _this_ component
</span> <span class="keyword">local</span> button = druid:new_button(...)
<span class="comment">-- helper can return you the component style for current component
</span> <span class="comment">-- It return by component name from
</span> <span class="keyword">local</span> my_style = self:get_style()
<span class="keyword">end</span>
</pre>
@ -244,7 +245,7 @@ There is next interests in druid:
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -34,6 +34,7 @@
<ul>
<li><a href="#Overview">Overview </a></li>
<li><a href="#Usage">Usage </a></li>
<li><a href="#Create_your_own_styles">Create your own styles </a></li>
</ul>
@ -54,6 +55,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -89,7 +91,8 @@
<p><a name="Usage"></a></p>
<h2>Usage</h2>
<p>Setup default druid style for all druid instances via <a href="../modules/druid.html#set_default_style">druid.set_default_style</a></p>
<p>Setup default druid style for all druid instances via <a href="../modules/druid.html#set_default_style">druid.set_default_style</a>
You can pass <em>nil</em> or <em>empty</em>table_ to use default values for all components (no styles)</p>
<pre>
<span class="keyword">local</span> druid = <span class="global">require</span>(<span class="string">"druid.druid"</span>)
@ -130,11 +133,29 @@
<p><a name="Create_your_own_styles"></a></p>
<h2>Create your own styles</h2>
<p>The most components have their styles. You can explore it on <a href="https://insality.github.io/druid/">Druid API</a> in table style section (<a href="https://insality.github.io/druid/modules/druid.button.html#Style">button example</a>). Or you can see, what fields component uses in code in function <code>on_style_change</code></p>
<p>To create you style, create lua module, what return &lt;<em>component</em>name_, <em>component</em>style_> table</p>
<p>Example: <a href="https://github.com/Insality/druid/blob/develop/druid/styles/default/style.lua">default druid style</a></p>
<p>Override all fields you want and set your style with one of next ways:</p>
<ul>
<li>Set your style as global via <a href="../modules/druid.html#set_default_style">druid.set_default_style</a></li>
<li>Set style for concrete druid instance via <code>druid = druid.new(self, style)</code></li>
<li>Set style for concrete instance via <code>component:set_style(style)</code></li>
</ul>
</div> <!-- id="content" -->
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -53,6 +53,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -91,7 +92,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -53,6 +53,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -89,7 +90,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -63,6 +63,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -115,6 +116,7 @@
<li>Key trigger - <code>Back</code> -> <code>key_back</code> <em>For back</em>handler component, Android back button, input component_</li>
<li>Key trigger - <code>Enter</code> -> <code>key_enter</code> <em>For input component, optional</em></li>
<li>Key trigger - <code>Esc</code> -> <code>key_esc</code> <em>For input component, optional</em></li>
<li>Touch triggers - <code>Touch multi</code> -> <code>multitouch</code> <em>For scroll component</em></li>
</ul>
<p><img src="media/input_binding_2.png" alt=""/>
@ -151,7 +153,7 @@
<span class="comment">-- Call this function on language changing in the game,
</span><span class="comment">-- to retranslate all lang_text components:
</span>druid.on_languge_change()
</span>druid.on_language_change()
<span class="comment">-- Call this function on layout changing in the game,
</span><span class="comment">-- to reapply layouts
@ -186,6 +188,7 @@
<li><p><strong><a href="https://github.com/Insality/druid/blob/master/docs_md/01-components.md#grid">Grid</a></strong> - Component for manage node positions </p></li>
<li><p><strong><a href="https://github.com/Insality/druid/blob/master/docs_md/01-components.md#hover">Hover</a></strong> - System Druid component, handle hover node state</p></li>
<li><p><strong><a href="https://github.com/Insality/druid/blob/master/docs_md/01-components.md#swipe">Swipe</a></strong> - System Druid component, handle swipe gestures on node</p></li>
<li><p><strong><a href="https://github.com/Insality/druid/blob/master/docs_md/01-components.md#drag">Drag</a></strong> - System Druid component, handle drag input on node </p></li>
</ul>
<p>Full info see on <em><a href="https://github.com/Insality/druid/blob/master/docs_md/01-components.md">components.md</a></em></p>
@ -270,7 +273,7 @@
<ul>
<li>*on_input* used for almost all basic druid components</li>
<li><em>update</em> used for progress bar, scroll and timer base components</li>
<li>*on_message* used for specific druid events, like language change or layout change (TODO: in future)</li>
<li>*on_message* used for specific druid events, like language change or layout change</li>
<li><em>final</em> used for custom components, what have to do several action before destroy</li>
</ul>
@ -318,13 +321,13 @@ https://insality.github.io/druid/</p>
<p><a name="License"></a></p>
<h2>License</h2>
<p>Original created by <a href="https://github.com/AGulev">AGulev</a></p>
<ul>
<li>Original created by <a href="https://github.com/AGulev">AGulev</a></li>
<li>Developed and supporting by <a href="https://github.com/Insality">Insality</a></li>
<li>Assets from <a href="http://www.kenney.nl/">Kenney</a></li>
</ul>
<p>Developed and supporting by <a href="https://github.com/Insality">Insality</a></p>
<p>Assets from <a href="http://www.kenney.nl/">Kenney</a></p>
<p>MIT License</p>
<p><strong>MIT</strong> License</p>
<p><a name="Issues_and_suggestions"></a></p>
@ -336,7 +339,7 @@ https://insality.github.io/druid/</p>
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -49,6 +49,7 @@
<li><a href="../modules/druid.button.html">druid.button</a></li>
<li><a href="../modules/druid.checkbox.html">druid.checkbox</a></li>
<li><a href="../modules/druid.checkbox_group.html">druid.checkbox_group</a></li>
<li><a href="../modules/druid.drag.html">druid.drag</a></li>
<li><a href="../modules/druid.grid.html">druid.grid</a></li>
<li><a href="../modules/druid.hover.html">druid.hover</a></li>
<li><a href="../modules/druid.input.html">druid.input</a></li>
@ -75,7 +76,7 @@
<p>Druid 0.3.0:</p>
<ul>
<li><p><code>Druid:final</code> now is important function for correct working</p></li>
<li><p><code>Druid:final()</code> now is important function for correct working</p></li>
<li><p>Add <em>swipe</em> basic component</p>
<pre>
@ -94,14 +95,10 @@
- You can setup max length of the text
- You can setup allowed characters. On add <span class="keyword">not</span> allowed characters <span class="backtick"><code>on_input_wrong</code></span> will be called. By default it cause simple shake animation
- The keyboard <span class="keyword">for</span> input will <span class="keyword">not</span> show on mobile HTML5. So input field <span class="keyword">in</span> mobile HTML5 is <span class="keyword">not</span> working now
- To make work different keyboard <span class="global">type</span>, make sure value <span class="keyword">in</span> game.project Android:InputMethod set to HidderInputField (https://defold.com/manuals/project-settings/#input-method)
- To make work different keyboard <span class="global">type</span>, make sure value <span class="keyword">in</span> game.project Android:InputMethod set to HiddenInputField (https://defold.com/manuals/project-settings/#input-method)
</pre>
</li>
<li><p>Add button on<em>click</em>outside event. You can subscribe on this event in button. Was needed for Input component (click outside to deselect input field).</p></li>
<li><p>Add start_pos to button component</p></li>
<li><p>Changed input binding settings. Add backspace, enter, text and marked_text. Backspace now is different from android back button.</p></li>
<li><p>Renamed on<em>change</em>language -> on<em>language</em>change component interest</p></li>
<li><p>Add basic component two functions: <code>increase_input_priority</code> and <code>reset_input_priority</code>. It used to process component input first in current input stack (there is two input stacks: INPUT and INPUT_HIGH). Example: on selecting input field, it increase input self priority until it be unselected</p></li>
<li><p>Add two functions to basic component: <code>increase_input_priority</code> and <code>reset_input_priority</code>. It used to process component input first in current input stack (there is two input stacks now: INPUT and INPUT_HIGH). Example: on selecting input field, it increase input self priority until it be unselected</p></li>
<li><p>Add two new component interests: <code>on_focus_gain</code> and <code>on_focus_lost</code></p></li>
<li><p>Add global druid events:</p>
@ -111,13 +108,84 @@
- on_layout_change: call <span class="backtick"><code>druid.on_layout_change()</code></span> (#<span class="number">37</span>) <span class="keyword">for</span> update all gui layouts (unimplemented now)
</pre>
</li>
<li><p>Add several examples to druid-assets respository</p></li>
<li><p>Add button <code>on_click_outside</code> event. You can subscribe on this event in button. Was needed for Input component (click outside to deselect input field)</p></li>
<li><p>Add <em>start</em>pos_ field to button component</p></li>
<li><p>Changed input binding settings. Add esc, enter, text and marked_text. Backspace now is different from android back button event. Check the README setup section</p></li>
<li><p>Renamed <em>on</em>change<em>language</em> -> <em>on</em>language<em>change</em> component interest</p></li>
<li><p>Add several examples to druid-assets respository (see live example here): https://insality.github.io/druid-assets/)</p></li>
<li><p>Known issues:</p>
<pre>
- Adjusting text size by height works wrong. Adjusting single line texting works fine
- Space is <span class="keyword">not</span> working <span class="keyword">in</span> HTML5
</pre>
<p>Druid 0.4.0:</p></li>
<li><p>Add <em>Drag</em> basic component</p>
<pre>
- Drag component allow you detect dragging on GUI node
- Drag will be processed even the cursor is outside of node, <span class="keyword">if</span> drag is already started
- Drag provides correct handle of several touches. Drag can switch between them (no more scroll gliches with position)
- Drag have <span class="global">next</span> events:
- on_touch_start (self)
- on_touch_end (self)
- on_drag_start (self)
- on_drag (self, dx, dy)
- on_drag_end (self)
- You can restriction side of draggin by changing _drag.can_x_ <span class="keyword">and</span> _drag.can_y_ fields
- You can setup drag deadzone to detect, when dragging is started (by default <span class="number">10</span> pixels)
</pre>
</li>
<li><p>Druid <em>Scroll</em> component fully reworked. Input logic moved to <em>Drag</em> component</p>
<pre>
- Update scroll documentation
- Change constructor order params
- Change _scroll:set_border_ to _scroll:set_size_
- Scroll now contains from view <span class="keyword">and</span> content node
- _View node_ - static node, which size determine the <span class="string">"camera"</span> zone
- _Content node_ - dynamic node, moving by _Scroll_ component
- Scroll will be disabled only <span class="keyword">if</span> content size equals to view size (by width <span class="keyword">or</span> height separatly)
- You can adjust start scroll size via _.gui_ scene. Just setup correct node size
- Different anchoring is supported (<span class="keyword">for</span> easier layouting)
- Function _scroll_to_ now accept position relative to _content node_. It's more easier <span class="keyword">for</span> handling. _Example:_ <span class="keyword">if</span> you have children node of _content_node_, you can pass this node position to scroll to this.
- **Resolve #<span class="number">52</span>**: _Content node size_ now can be less than _view node size_. In this case, content will be scrolled only inside _view size_ (can be disabled via style field: _SMALL_CONTENT_SCROLL_)
- **Fix #<span class="number">50</span>**: If style:SOFT_ZONE_SIZE equals to [<span class="number">0.</span>.<span class="number">1</span>], scroll can be disappeared
</pre>
</li>
<li><p>Druid <em>Grid</em> Update</p>
<pre>
- Anchor by default equals to node pivot (so, more component settings <span class="keyword">in</span> _.gui_ settings) (#<span class="number">51</span>)
- Function <span class="backtick"><a href="../modules/druid.grid.html#clear">grid:clear</a></span> now don't delete any GUI nodes. Druid will <span class="keyword">not</span> care about <span class="backtick"><code>gui.delete_node</code></span> logic anymore (#<span class="number">56</span>)
</pre>
</li>
<li><p>Druid <em>Hover</em> component now have two <em>hover</em> events (#49):</p>
<pre>
- _on_hover_ is usual hover event. Trigger only <span class="keyword">if</span> touch <span class="keyword">or</span> mouse action_id pressed on node
- _on_mouse_hover_ action on node without action_id (desktop mouse over). Works only on desktop platform
</pre>
</li>
<li><p>Styles update:</p>
<pre>
- Styles <span class="global">table</span> now can be empty, every component have their default style values
- Remove <span class="backtick"><code>component:get_style</code></span> <span class="keyword">function</span>. Now style can be only set
- To get style values <span class="keyword">in</span> component, add <span class="backtick"><code>component:on_style_change</code></span> <span class="keyword">function</span>. It's invoked on <span class="backtick"><a href="../modules/component.html#set_style">component:set_style</a></span> <span class="keyword">function</span>
- You can look up default values inside <span class="backtick"><code>component:on_style_change</code></span> <span class="keyword">function</span> <span class="keyword">or</span> style component API on Druid API
</pre>
</li>
<li><p>Druid update:</p>
<pre>
- Now <span class="keyword">function</span> <span class="backtick"><code>druid:remove</code></span> remove instance <span class="keyword">and</span> all instance children components. No more manual deleting child components (#<span class="number">41</span>)
</pre>
</li>
<li><p><strong>Fix:</strong> Blocker component bug (blocker had very high priority, so it's block even button components, created after bloker)</p></li>
<li><p><strong>Fix #58:</strong> Bug, when druid instance should be always named <a href="../modules/druid.html#">druid</a> (ex: <code>self.druid = druid.new(self)</code>)</p></li>
<li><p><strong>Fix #53:</strong> Bug with final <em>Druid instance</em> without any components</p></li>
</ul>
@ -125,7 +193,7 @@
</div> <!-- id="main" -->
<div id="about">
<i>generated by <a href="http://github.com/stevedonovan/LDoc">LDoc 1.4.6</a></i>
<i style="float:right;">Last updated 2020-04-18 14:39:17 </i>
<i style="float:right;">Last updated 2020-05-09 16:07:15 </i>
</div> <!-- id="about" -->
</div> <!-- id="container" -->
</body>

View File

@ -51,7 +51,7 @@ Create text node with druid: `text = druid:new_text(node_name, [initial_value],
## Blocker
[Blocker API here](https://insality.github.io/druid/modules/druid.button.html)
[Blocker API here](https://insality.github.io/druid/modules/druid.blocker.html)
### Overview
Druid component for block input. Use it to block input in special zone.
@ -101,28 +101,31 @@ Create lang text component with druid `text = druid:new_lang_text(node_name, loc
Basic Druid scroll component. Handle all scrolling stuff in druid GUI
### Setup
Create scroll component with druid: `scroll = druid:new_scroll(scroll_parent, scroll_input)`.
Create scroll component with druid: `scroll = druid:new_scroll(view_node, content_node)`.
_Scroll parent_ - is dynamic part. This node will change position by scroll system
_View_node_ - is static part. It capturing user input and recognize scrolling touches
_Scroll input_ - is static part. It capturing user input and recognize scrolling touches
_Content_node_ - is dynamic part. This node will change position by scroll system
Initial scroll size will be equal to _scroll parent_ node size. The initial view box will be equal to _scroll input_ node size
Initial scroll size will be equal to _content_node_ node size. The initial view box will be equal to _view_node_ node size
Usually, Place static input zone part, and as children add scroll parent part:
Usually, Place _view_node_ and as children add _content_node_:
![](../media/scroll_scheme.png)
![](../media/scroll_outline.png)
*Here scroll_content_zone below input zone, in game content zone be able to scroll left until end*
*Here content_node below view_node, in game content_node be able to scroll left until end*
### Notes
- Scroll by default style have inertion and "back moving". It can be adjust via scroll [style settings](https://insality.github.io/druid/modules/druid.scroll.html#Style)
- Scroll by default style have inertion and extra size for strecthing effect. It can be adjust via scroll [style settings](https://insality.github.io/druid/modules/druid.scroll.html#Style)
- You can setup "points of interest". Scroll always will be centered on closes point of interest. It is able to create slider without inertion and points of interest on each scroll element.
- Scroll have next events:
- *on_scroll* On scroll move callback
- *on_scroll_to* On scroll_to function callback
- *on_point_scroll* On scroll_to_index function callback
- You can adjust scroll content size by `scroll:set_border(node_size)`. It will setup new size to content node.
- *on_scroll* (self, position) On scroll move callback
- *on_scroll_to* (self, position, is_instant) On scroll_to function callback
- *on_point_scroll* (self, item_index, position) On scroll_to_index function callback
- You can adjust scroll content size by `scroll:set_size(node_size)`. It will setup new size to _content node_
- You can enabled or disable inertion mode via `scroll:set_intert(state)`
- You can adjust extra stretch size via `scroll:set_extra_stretch_size`
- Multitouch is required for scroll. Scroll is correctly handling touch_id swap while dragging scroll
## Progress
@ -239,7 +242,7 @@ Create timer component with druid: `timer = druid:new_timer(text_node, from_seco
Component for manage node positions. Very simple implementation for nodes with equal size
### Setup
Create grid component with druid: `grid = druid:new_grid(parent_node, prefab_node, max_in_row_elements)`
Create component with druid: `grid = druid:new_grid(parent_node, prefab_node, max_in_row_elements)`
### Notes
- Grid on _adding elements_ will setup parent to _parent_node_
@ -258,6 +261,8 @@ System Druid component, handle hover node state.
Create hover component with druid: `hover = druid:new_hover(node, callback)`
### Notes
- By default, hover handles _hover event_ with pressed touch action_id. So it's mean, what mouse or touch have to be pressed
- On desktop platforms there is _on_mouse_hover_ event. It's event on mouse hover without any action id
## Swipe
@ -267,7 +272,7 @@ Create hover component with druid: `hover = druid:new_hover(node, callback)`
System Druid component, handle swipe actions on node
### Setup
Create hover component with druid: `hover = druid:new_swipe(node, swipe_callback)`
Create swipe component with druid: `hover = druid:new_swipe(node, swipe_callback)`
### Notes
- Swipe callback have next params: (self, swipe_side, distance, time)
@ -276,6 +281,37 @@ Create hover component with druid: `hover = druid:new_swipe(node, swipe_callback
- **distance**: *number* - in pixels, distance of swipe
- **time**: *number* - in seconds, time of swiping
- Swipe trigger only, if all input actions was on swipe node. If action will be outside of node, swipe status will be reseted
- In swipe style table you can adjust minimal distance and maximum time to trigger swipe
- In swipe style table you can adjust minimal distance and maximum time to trigg- Hover state trigger only with touch on mobile devices or button mouse holding. Just mouse over swipe
- In swipe style table you can toggle type of swipe triggering. if SWIPE_TRIGGER_ON_MOVE setup to true - swipe will trigger as swipe can be triggered. If setup to false - swipe will trigger only on released action
- If you have stencil on swipe node and you don't want trigger it outside of stencil node, you can use `swipe:set_click_zone` to restrict swipe zone
- If you have stencil on swipe node and you don't want trigger it outside of stencil node, you can use `swipe:set_click_zone` to restrict swipe zonethout buttons is now not allowed.
## Drag
[Drag API here](https://insality.github.io/druid/modules/druid.drag.html)
### Overview
System Druid component, handle drag actions on node
### Setup
Create drag component with druid: `hover = druid:new_drag(node, drag_callback)`
### Notes
- Drag callback have next params: (self, swipe_side, distance, time)
- **self**: Druid self context
- **dx**: *number* - delta x position
- **dy**: *number* - delta y position
- In styles, you can point the drag start deadzone. Default value is 10 pixels
- Drag correctly process multitouch. You can switch touch_id, while dragging on node with correct _dx_ and _dy_ values (made for correct scrolling)
- You can restrict horizontal or vertical dragging by setting `drag.can_x` or `drag.can_y` to _false_ value
- You can get info about current drag state:
- _is_touch_ - Is currently node touching
- _is_drag_ - Is currently node is dragging
- _x_ and _y_ - Current touch position
- _touch_start_pos_ - Touch stat positions
- Drag have next events:
- _on_touch_start_ (self) - Event on touch start
- _on_touch_end_ (self) - Event on touch end
- _on_drag_start_ (self) - Event on drag start
- _on_drag_ (self, dx, dy) - Event on drag process
- _on_drag_end_ (self) - Event on drag end
- Drag node zone can be restricted via `drag:set_click_zone(node)`

View File

@ -28,6 +28,10 @@ end
function M.on_input(self, action_id, action)
end
-- Call on component creation and on component:set_style() function
function M.on_style_change(self, style)
end
-- Call only if exist interest: const.ON_MESSAGE
function M.on_message(self, message_id, message, sender)
end
@ -138,10 +142,6 @@ function M.init(self, template_name, node_table)
-- 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
```

View File

@ -9,6 +9,7 @@ In component API documentation, you can find the style API for this component. O
## Usage
Setup default druid style for all druid instances via `druid.set_default_style`
You can pass _nil_ or _empty_table_ to use default values for all components (no styles)
```lua
local druid = require("druid.druid")
local my_style = require("my.amazing.style")
@ -41,3 +42,18 @@ local function init(self)
self.button:set_style(my_style)
end
```
## Create your own styles
The most components have their styles. You can explore it on [Druid API](https://insality.github.io/druid/) in table style section ([button example](https://insality.github.io/druid/modules/druid.button.html#Style)). Or you can see, what fields component uses in code in function `on_style_change`
To create you style, create lua module, what return <_component_name_, _component_style_> table
Example: [default druid style](https://github.com/Insality/druid/blob/develop/druid/styles/default/style.lua)
Override all fields you want and set your style with one of next ways:
- Set your style as global via `druid.set_default_style`
- Set style for concrete druid instance via `druid = druid.new(self, style)`
- Set style for concrete instance via `component:set_style(style)`

View File

@ -1,6 +1,6 @@
Druid 0.3.0:
- `Druid:final` now is important function for correct working
- `Druid:final()` now is important function for correct working
- Add _swipe_ basic component
- Swipe component handle simple swipe gestures on node. It has single callback with direction on swipe. You can adjust a several parameters of swipe in druid style.
@ -15,16 +15,9 @@ Druid 0.3.0:
- You can setup max length of the text
- You can setup allowed characters. On add not allowed characters `on_input_wrong` will be called. By default it cause simple shake animation
- The keyboard for input will not show on mobile HTML5. So input field in mobile HTML5 is not working now
- To make work different keyboard type, make sure value in game.project Android:InputMethod set to HidderInputField (https://defold.com/manuals/project-settings/#input-method)
- To make work different keyboard type, make sure value in game.project Android:InputMethod set to HiddenInputField (https://defold.com/manuals/project-settings/#input-method)
- Add button on_click_outside event. You can subscribe on this event in button. Was needed for Input component (click outside to deselect input field).
- Add start_pos to button component
- Changed input binding settings. Add backspace, enter, text and marked_text. Backspace now is different from android back button.
- Renamed on_change_language -> on_language_change component interest
- Add basic component two functions: `increase_input_priority` and `reset_input_priority`. It used to process component input first in current input stack (there is two input stacks: INPUT and INPUT_HIGH). Example: on selecting input field, it increase input self priority until it be unselected
- Add two functions to basic component: `increase_input_priority` and `reset_input_priority`. It used to process component input first in current input stack (there is two input stacks now: INPUT and INPUT_HIGH). Example: on selecting input field, it increase input self priority until it be unselected
- Add two new component interests: `on_focus_gain` and `on_focus_lost`
@ -33,8 +26,68 @@ Druid 0.3.0:
- on_language_change: call `druid.on_language_change()` (#38) for update all druid instances lang components
- on_layout_change: call `druid.on_layout_change()` (#37) for update all gui layouts (unimplemented now)
- Add several examples to druid-assets respository
- Add button `on_click_outside` event. You can subscribe on this event in button. Was needed for Input component (click outside to deselect input field)
- Add _start_pos_ field to button component
- Changed input binding settings. Add esc, enter, text and marked_text. Backspace now is different from android back button event. Check the README setup section
- Renamed _on_change_language_ -> _on_language_change_ component interest
- Add several examples to druid-assets respository (see live example here): https://insality.github.io/druid-assets/)
- Known issues:
- Adjusting text size by height works wrong. Adjusting single line texting works fine
- Space is not working in HTML5
Druid 0.4.0:
- Add _Drag_ basic component
- Drag component allow you detect dragging on GUI node
- Drag will be processed even the cursor is outside of node, if drag is already started
- Drag provides correct handle of several touches. Drag can switch between them (no more scroll gliches with position)
- Drag have next events:
- on_touch_start (self)
- on_touch_end (self)
- on_drag_start (self)
- on_drag (self, dx, dy)
- on_drag_end (self)
- You can restriction side of draggin by changing _drag.can_x_ and _drag.can_y_ fields
- You can setup drag deadzone to detect, when dragging is started (by default 10 pixels)
- Druid _Scroll_ component fully reworked. Input logic moved to _Drag_ component
- Update scroll documentation
- Change constructor order params
- Change _scroll:set_border_ to _scroll:set_size_
- Scroll now contains from view and content node
- _View node_ - static node, which size determine the "camera" zone
- _Content node_ - dynamic node, moving by _Scroll_ component
- Scroll will be disabled only if content size equals to view size (by width or height separatly)
- You can adjust start scroll size via _.gui_ scene. Just setup correct node size
- Different anchoring is supported (for easier layouting)
- Function _scroll_to_ now accept position relative to _content node_. It's more easier for handling. _Example:_ if you have children node of _content_node_, you can pass this node position to scroll to this.
- **Resolve #52**: _Content node size_ now can be less than _view node size_. In this case, content will be scrolled only inside _view size_ (can be disabled via style field: _SMALL_CONTENT_SCROLL_)
- **Fix #50**: If style:SOFT_ZONE_SIZE equals to [0..1], scroll can be disappeared
- Druid _Grid_ Update
- Anchor by default equals to node pivot (so, more component settings in _.gui_ settings) (#51)
- Function `grid:clear` now don't delete any GUI nodes. Druid will not care about `gui.delete_node` logic anymore (#56)
- Druid _Hover_ component now have two _hover_ events (#49):
- _on_hover_ is usual hover event. Trigger only if touch or mouse action_id pressed on node
- _on_mouse_hover_ action on node without action_id (desktop mouse over). Works only on desktop platform
- Styles update:
- Styles table now can be empty, every component have their default style values
- Remove `component:get_style` function. Now style can be only set
- To get style values in component, add `component:on_style_change` function. It's invoked on `component:set_style` function
- You can look up default values inside `component:on_style_change` function or style component API on Druid API
- Druid update:
- Now function `druid:remove` remove instance and all instance children components. No more manual deleting child components (#41)
- **Fix:** Blocker component bug (blocker had very high priority, so it's block even button components, created after bloker)
- **Fix #58:** Bug, when druid instance should be always named `druid` (ex: `self.druid = druid.new(self)`)
- **Fix #53:** Bug with final _Druid instance_ without any components

View File

@ -14,7 +14,7 @@ local Event = require("druid.event")
local const = require("druid.const")
local component = require("druid.component")
local M = component.create("blocker", { const.ON_INPUT_HIGH })
local M = component.create("blocker", { const.ON_INPUT })
--- Component init function
@ -29,7 +29,7 @@ end
function M.on_input(self, action_id, action)
if action_id ~= const.ACTION_TOUCH then
if action_id ~= const.ACTION_TOUCH and action_id ~= const.ACTION_MULTITOUCH then
return false
end

View File

@ -21,13 +21,6 @@
-- @tfield druid.hover hover Druid hover logic component
-- @tfield[opt] node click_zone Restriction zone
--- Component style params
-- @table Style
-- @tfield function on_click (self, node)
-- @tfield function on_click_disabled (self, node)
-- @tfield function on_hover (self, node, hover_state)
-- @tfield function on_set_enabled (self, node, enabled_state)
local Event = require("druid.event")
local const = require("druid.const")
local helper = require("druid.helper")
@ -50,18 +43,18 @@ end
local function on_button_hover(self, hover_state)
if not self._style.on_hover then
return
end
self.style.on_hover(self, self.anim_node, hover_state)
end
self._style.on_hover(self, self.anim_node, hover_state)
local function on_button_mouse_hover(self, hover_state)
self.style.on_mouse_hover(self, self.anim_node, hover_state)
end
local function on_button_click(self)
if self._style.on_click then
self._style.on_click(self, self.anim_node)
end
self.style.on_click(self, self.anim_node)
self.click_in_row = 1
self.on_click:trigger(self:get_context(), self.params, self)
end
@ -73,18 +66,16 @@ local function on_button_repeated_click(self)
self.is_repeated_started = true
end
if self._style.on_click then
self._style.on_click(self, self.anim_node)
end
self.style.on_click(self, self.anim_node)
self.click_in_row = self.click_in_row + 1
self.on_repeated_click:trigger(self:get_context(), self.params, self, self.click_in_row)
end
local function on_button_long_click(self)
if self._style.on_click then
self._style.on_click(self, self.anim_node)
end
self.style.on_click(self, self.anim_node)
self.click_in_row = 1
local time = socket.gettime() - self.last_pressed_time
self.on_long_click:trigger(self:get_context(), self.params, self, time)
@ -92,9 +83,8 @@ end
local function on_button_double_click(self)
if self._style.on_click then
self._style.on_click(self, self.anim_node)
end
self.style.on_click(self, self.anim_node)
self.click_in_row = self.click_in_row + 1
self.on_double_click:trigger(self:get_context(), self.params, self, self.click_in_row)
end
@ -115,10 +105,10 @@ local function on_button_release(self)
self.can_action = false
local time = socket.gettime()
local is_long_click = (time - self.last_pressed_time) > self._style.LONGTAP_TIME
local is_long_click = (time - self.last_pressed_time) > self.style.LONGTAP_TIME
is_long_click = is_long_click and self.on_long_click:is_exist()
local is_double_click = (time - self.last_released_time) < self._style.DOUBLETAP_TIME
local is_double_click = (time - self.last_released_time) < self.style.DOUBLETAP_TIME
is_double_click = is_double_click and self.on_double_click:is_exist()
if is_long_click then
@ -133,14 +123,38 @@ local function on_button_release(self)
end
return true
else
if self._style.on_click_disabled then
self._style.on_click_disabled(self, self.anim_node)
end
self.style.on_click_disabled(self, self.anim_node)
return false
end
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=0.4] number LONGTAP_TIME Minimum time to trigger on_hold_callback
-- @tfield[opt=0.8] number AUTOHOLD_TRIGGER Maximum hold time to trigger button release while holding
-- @tfield[opt=0.4] number DOUBLETAP_TIME Time between double taps
-- @tfield function on_click (self, node)
-- @tfield function on_click_disabled (self, node)
-- @tfield function on_hover (self, node, hover_state)
-- @tfield function on_mouse_hover (self, node, hover_state)
-- @tfield function on_set_enabled (self, node, enabled_state)
function M.on_style_change(self, style)
self.style = {}
self.style.LONGTAP_TIME = style.LONGTAP_TIME or 0.4
self.style.AUTOHOLD_TRIGGER = style.AUTOHOLD_TRIGGER or 0.8
self.style.DOUBLETAP_TIME = style.DOUBLETAP_TIME or 0.4
self.style.on_click = style.on_click or function(_, node) end
self.style.on_click_disabled = style.on_click_disabled or function(_, node) end
self.style.on_mouse_hover = style.on_mouse_hover or function(_, node, state) end
self.style.on_hover = style.on_hover or function(_, node, state) end
self.style.on_set_enabled = style.on_set_enabled or function(_, node, state) end
end
--- Component init function
-- @function button:init
-- @tparam node node Gui node
@ -156,6 +170,7 @@ function M.init(self, node, callback, params, anim_node)
self.start_pos = gui.get_position(self.anim_node)
self.params = params
self.hover = self.druid:new_hover(node, on_button_hover)
self.hover.on_mouse_hover:subscribe(on_button_mouse_hover)
self.click_zone = nil
self.is_repeated_started = false
self.last_pressed_time = 0
@ -227,12 +242,12 @@ function M.on_input(self, action_id, action)
if not self.disabled and self.can_action and self.on_long_click:is_exist() then
local press_time = socket.gettime() - self.last_pressed_time
if self._style.AUTOHOLD_TRIGGER and self._style.AUTOHOLD_TRIGGER <= press_time then
if self.style.AUTOHOLD_TRIGGER <= press_time then
on_button_release(self)
return true
end
if press_time >= self._style.LONGTAP_TIME then
if press_time >= self.style.LONGTAP_TIME then
on_button_hold(self, press_time)
return true
end
@ -252,9 +267,7 @@ end
-- @tparam bool state Enabled state
function M.set_enabled(self, state)
self.disabled = not state
if self._style.on_set_enabled then
self._style.on_set_enabled(self, self.node, state)
end
self.style.on_set_enabled(self, self.node, state)
end

View File

@ -11,10 +11,6 @@
-- @tfield[opt=node] node click_node Button trigger node
-- @tfield druid.button button Button component from click_node
--- Component style params
-- @table Style
-- @tfield function on_change_state (self, node, state)
local Event = require("druid.event")
local component = require("druid.component")
@ -26,13 +22,26 @@ local function on_click(self)
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield function on_change_state (self, node, state)
function M.on_style_change(self, style)
self.style = {}
self.style.on_change_state = style.on_change_state or function(_, node, state)
gui.set_enabled(node, state)
end
end
--- Component init function
-- @function checkbox:init
-- @tparam node node Gui node
-- @tparam function callback Checkbox callback
-- @tparam[opt=node] node click node Trigger node, by default equals to node
function M.init(self, node, callback, click_node)
self.style = self:get_style()
self.druid = self:get_druid()
self.node = self:get_node(node)
self.click_node = self:get_node(click_node)
@ -54,9 +63,7 @@ function M.set_state(self, state, is_silent)
end
self.state = state
if self.style.on_change_state then
self.style.on_change_state(self, self.node, state)
end
self.style.on_change_state(self, self.node, state)
if not is_silent then
self.on_change_state:trigger(self:get_context(), state)

251
druid/base/drag.lua Normal file
View File

@ -0,0 +1,251 @@
--- Component to handle drag action on node.
-- Drag have correct handling for multitouch and swap
-- touched while dragging. Drag will be processed even
-- the cursor is outside of node, if drag is already started
-- @module druid.drag
--- Component events
-- @table Events
-- @tfield druid_event on_touch_start (self) Event on touch start
-- @tfield druid_event on_touch_end (self) Event on touch end
-- @tfield druid_event on_drag_start (self) Event on drag start
-- @tfield druid_event on_drag (self, dx, dy) Event on drag progress
-- @tfield druid_event on_drag_end (self) Event on drag end
--- Components fields
-- @table Fields
-- @tfield bool is_touch Is component now touching
-- @tfield bool is_drag Is component now dragging
-- @tfield bool can_x Is drag component process vertical dragging. Default - true
-- @tfield bool can_y Is drag component process horizontal. Default - true
-- @tfield number x Current touch x position
-- @tfield number y Current touch y position
-- @tfield vector3 touch_start_pos Touch start position
local Event = require("druid.event")
local const = require("druid.const")
local helper = require("druid.helper")
local component = require("druid.component")
local M = component.create("drag", { const.ON_INPUT_HIGH })
local function start_touch(self, touch)
self.is_touch = true
self.is_drag = false
self.touch_start_pos.x = touch.x
self.touch_start_pos.y = touch.y
self.x = touch.x
self.y = touch.y
self.on_touch_start:trigger(self:get_context())
end
local function end_touch(self)
if self.is_drag then
self.on_drag_end:trigger(self:get_context())
end
self.is_drag = false
self.is_touch = false
self.on_touch_end:trigger(self:get_context())
self:reset_input_priority()
self.touch_id = 0
end
local function process_touch(self, touch)
if not self.can_x then
self.touch_start_pos.x = touch.x
end
if not self.can_y then
self.touch_start_pos.y = touch.y
end
local distance = helper.distance(touch.x, touch.y, self.touch_start_pos.x, self.touch_start_pos.y)
if not self.is_drag and distance >= self.style.DRAG_DEADZONE then
self.is_drag = true
self.on_drag_start:trigger(self:get_context())
self:increase_input_priority()
end
end
--- Return current touch action from action input data
-- If touch_id stored - return exact this touch action
local function find_touch(action_id, action, touch_id)
local act = helper.is_mobile() and const.ACTION_MULTITOUCH or const.ACTION_TOUCH
if action_id ~= act then
return
end
if action.touch then
local touch = action.touch
for i = 1, #touch do
if touch[i].id == touch_id then
return touch[i]
end
end
return touch[1]
else
return action
end
end
--- Process on touch release. We should to find, if any other
-- touches exists to switch to another touch.
local function on_touch_release(self, action_id, action)
if #action.touch >= 2 then
-- Find next unpressed touch
local next_touch
for i = 1, #action.touch do
if not action.touch[i].released then
next_touch = action.touch[i]
break
end
end
if next_touch then
self.x = next_touch.x
self.y = next_touch.y
self.touch_id = next_touch.id
else
end_touch(self)
end
elseif #action.touch == 1 then
end_touch(self)
end
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=10] number DRAG_DEADZONE Distance in pixels to start dragging
function M.on_style_change(self, style)
self.style = {}
self.style.DRAG_DEADZONE = style.DRAG_DEADZONE or 10
end
--- Drag component constructor
-- @tparam node node GUI node to detect dragging
-- @tparam function on_drag_callback Callback for on_drag_event(self, dx, dy)
-- @function drag:init
function M.init(self, node, on_drag_callback)
self.node = self:get_node(node)
self.dx = 0
self.dy = 0
self.touch_id = 0
self.x = 0
self.y = 0
self.is_touch = false
self.is_drag = false
self.touch_start_pos = vmath.vector3(0)
self.can_x = true
self.can_y = true
self.click_zone = nil
self.on_touch_start = Event()
self.on_touch_end = Event()
self.on_drag_start = Event()
self.on_drag = Event(on_drag_callback)
self.on_drag_end = Event()
end
function M.on_input_interrupt(self)
if self.is_drag or self.is_touch then
end_touch(self)
end
end
function M.on_input(self, action_id, action)
if action_id ~= const.ACTION_TOUCH and action_id ~= const.ACTION_MULTITOUCH then
return
end
if not helper.is_enabled(self.node) then
return false
end
local is_pick = gui.pick_node(self.node, action.x, action.y)
if self.click_zone then
is_pick = is_pick and gui.pick_node(self.click_zone, action.x, action.y)
end
if not is_pick and not self.is_drag then
end_touch(self)
return false
end
local touch = find_touch(action_id, action, self.touch_id)
if not touch then
return false
end
if touch.id then
self.touch_id = touch.id
end
self.dx = 0
self.dy = 0
if touch.pressed and not self.is_touch then
start_touch(self, touch)
end
if touch.released and self.is_touch then
if action.touch then
-- Mobile
on_touch_release(self, action_id, action)
else
-- PC
end_touch(self)
end
end
if self.is_touch then
process_touch(self, touch)
end
local touch_modified = find_touch(action_id, action, self.touch_id)
if touch_modified and self.is_drag then
self.dx = touch_modified.x - self.x
self.dy = touch_modified.y - self.y
end
if touch_modified then
self.x = touch_modified.x
self.y = touch_modified.y
end
if self.is_drag then
self.on_drag:trigger(self:get_context(), self.dx, self.dy)
end
return self.is_drag
end
--- Strict drag click area. Useful for
-- restrict events outside stencil node
-- @function drag:set_click_zone
-- @tparam node zone Gui node
function M.set_click_zone(self, zone)
self.click_zone = self:get_node(zone)
end
return M

View File

@ -20,6 +20,7 @@
-- @tfield vector3 border_offer The border offset for correct anchor calculations
local Event = require("druid.event")
local helper = require("druid.helper")
local component = require("druid.component")
local M = component.create("grid")
@ -35,7 +36,10 @@ function M.init(self, parent, element, in_row)
self.nodes = {}
self.offset = vmath.vector3(0)
self.anchor = vmath.vector3(0.5, 0, 0)
local pivot = helper.get_pivot_offset(gui.get_pivot(self.parent))
self.anchor = vmath.vector3(0.5 + pivot.x, 0.5 - pivot.y, 0)
self.in_row = in_row or 1
self.node_size = gui.get_size(self:get_node(element))
self.border = vmath.vector4(0)
@ -153,12 +157,15 @@ function M.get_all_pos(self)
end
--- Clear all items from the grid
--- Clear grid nodes array. GUI nodes will be not deleted!
-- If you want to delete GUI nodes, use grid.nodes array before grid:clear
-- @function grid:clear
function M.clear(self)
for i = 1, #self.nodes do
gui.delete_node(self.nodes[i])
end
self.border.x = 0
self.border.y = 0
self.border.w = 0
self.border.z = 0
self.nodes = {}
end

View File

@ -3,7 +3,8 @@
--- Component events
-- @table Events
-- @tfield druid_event on_hover On hover callback
-- @tfield druid_event on_hover On hover callback (Touch pressed)
-- @tfield druid_event on_mouse_hover On mouse hover callback (Touch over without action_id)
local Event = require("druid.event")
local const = require("druid.const")
@ -18,20 +19,24 @@ local M = component.create("hover", { const.ON_INPUT })
-- @tparam node node Gui node
-- @tparam function on_hover_callback Hover callback
function M.init(self, node, on_hover_callback)
self.style = self:get_style()
self.node = self:get_node(node)
self._is_hovered = false
self.on_hover = Event(on_hover_callback)
self.on_mouse_hover = Event()
end
function M.on_input(self, action_id, action)
if action_id ~= const.ACTION_TOUCH then
if action_id ~= const.ACTION_TOUCH and action_id ~= nil then
return
end
if not action_id and helper.is_mobile() then
return false
end
if not helper.is_enabled(self.node) then
return false
end
@ -41,15 +46,17 @@ function M.on_input(self, action_id, action)
is_pick = is_pick and gui.pick_node(self.click_zone, action.x, action.y)
end
local hover_function = action_id and M.set_hover or M.set_mouse_hover
if not is_pick then
M.set_hover(self, false)
hover_function(self, false)
return false
end
if action.released then
M.set_hover(self, false)
hover_function(self, false)
else
M.set_hover(self, true)
hover_function(self, true)
end
end
@ -69,6 +76,16 @@ function M.set_hover(self, state)
end
end
--- Set mouse hover state
-- @function hover:set_mouse_hover
-- @tparam bool state The mouse hover state
function M.set_mouse_hover(self, state)
if self._is_mouse_hovered ~= state then
self._is_mouse_hovered = state
self.on_mouse_hover:trigger(self:get_context(), state)
end
end
--- Strict hover click area. Useful for
-- no click events outside stencil node

View File

@ -22,16 +22,6 @@
-- @tfield[opt] string allowerd_characters Pattern matching for user input
-- @tfield number keyboard_type Gui keyboard type for input field
--- Component style params
-- @table Style
-- @tfield bool IS_LONGTAP_ERASE Is long tap will erase current input data
-- @tfield number BUTTON_SELECT_INCREASE Button scale multiplier on selecting input field
-- @tfield string MASK_DEFAULT_CHAR Default character mask for password input
-- @tfield function on_select (self, button_node) Callback on input field selecting
-- @tfield function on_unselect (self, button_node) Callback on input field unselecting
-- @tfield function on_input_wrong (self, button_node) Callback on wrong user input
-- @tfield table button Custom button style for input node
local Event = require("druid.event")
local const = require("druid.const")
local component = require("druid.component")
@ -67,9 +57,7 @@ local function select(self)
gui.show_keyboard(self.keyboard_type, false)
self.on_input_select:trigger(self:get_context())
if self.style.on_select then
self.style.on_select(self, self.button.node)
end
self.style.on_select(self, self.button.node)
end
end
@ -85,9 +73,7 @@ local function unselect(self)
gui.hide_keyboard()
self.on_input_unselect:trigger(self:get_context())
if self.style.on_unselect then
self.style.on_unselect(self, self.button.node)
end
self.style.on_unselect(self, self.button.node)
end
end
@ -101,9 +87,36 @@ local function clear_and_select(self)
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=false] bool IS_LONGTAP_ERASE Is long tap will erase current input data
-- @tfield[opt=*] string MASK_DEFAULT_CHAR Default character mask for password input
-- @tfield function on_select (self, button_node) Callback on input field selecting
-- @tfield function on_unselect (self, button_node) Callback on input field unselecting
-- @tfield function on_input_wrong (self, button_node) Callback on wrong user input
-- @tfield table button_style Custom button style for input node
function M.on_style_change(self, style)
self.style = {}
self.style.IS_LONGTAP_ERASE = style.IS_LONGTAP_ERASE or false
self.style.MASK_DEFAULT_CHAR = style.MASK_DEFAULT_CHAR or "*"
self.style.on_select = style.on_select or function(_, button_node) end
self.style.on_unselect = style.on_unselect or function(_, button_node) end
self.style.on_input_wrong = style.on_input_wrong or function(_, button_node) end
self.style.button_style = style.button_style or {
LONGTAP_TIME = 0.4,
AUTOHOLD_TRIGGER = 0.8,
DOUBLETAP_TIME = 0.4
}
end
function M.init(self, click_node, text_node, keyboard_type)
self.druid = self:get_druid(self)
self.style = self:get_style(self)
self.text = self.druid:new_text(text_node)
self.selected = false
@ -123,7 +136,7 @@ function M.init(self, click_node, text_node, keyboard_type)
self.keyboard_type = keyboard_type or gui.KEYBOARD_TYPE_DEFAULT
self.button = self.druid:new_button(click_node, select)
self.button:set_style(self.style)
self.button:set_style(self.button_style)
self.button.on_click_outside:subscribe(unselect)
self.button.on_long_click:subscribe(clear_and_select)
@ -158,9 +171,7 @@ function M.on_input(self, action_id, action)
end
else
self.on_input_wrong:trigger(self:get_context(), action.text)
if self.style.on_input_wrong then
self.style.on_input_wrong(self, self.button.node)
end
self.style.on_input_wrong(self, self.button.node)
end
self.marked_value = ""
end
@ -271,7 +282,7 @@ end
-- Pass nil to make input field unliminted (by default)
-- @function input:set_max_length
-- @tparam number max_length Maximum length for input text field
-- @tparam druid.input Self instance to make chain calls
-- @treturn druid.input Self instance to make chain calls
function M.set_max_length(self, max_length)
self.max_length = max_length
return self
@ -283,7 +294,7 @@ end
-- ex: [%a%d] for alpha and numeric
-- @function input:set_allowerd_characters
-- @tparam string characters Regulax exp. for validate user input
-- @tparam druid.input Self instance to make chain calls
-- @treturn druid.input Self instance to make chain calls
function M.set_allowed_characters(self, characters)
self.allowed_characters = characters
return self

View File

@ -15,11 +15,6 @@
-- @tfield number max_size Maximum size of progress bar
-- @tfield vector4 slice Progress bar slice9 settings
--- Component style params
-- @table Style
-- @tfield number SPEED Progress bas fill rate. More -> faster
-- @tfield number MIN_DELTA Minimum step to fill progress bar
local Event = require("druid.event")
local const = require("druid.const")
local helper = require("druid.helper")
@ -70,6 +65,19 @@ local function set_bar_to(self, set_to, is_silent)
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=5] number SPEED Progress bas fill rate. More -> faster
-- @tfield[opt=0.005] number MIN_DELTA Minimum step to fill progress bar
function M.on_style_change(self, style)
self.style = {}
self.style.SPEED = style.SPEED or 5
self.style.MIN_DELTA = style.MIN_DELTA or 0.005
end
--- Component init function
-- @function progress:init
-- @tparam string|node node Progress bar fill node or node name
@ -81,7 +89,6 @@ function M.init(self, node, key, init_value)
self.prop = hash("scale."..key)
self.key = key
self.style = self:get_style()
self.node = self:get_node(node)
self.scale = gui.get_scale(self.node)
self.size = gui.get_size(self.node)

View File

@ -15,133 +15,142 @@
--- Component fields
-- @table Fields
-- @tfield node node Scroll parent node
-- @tfield node input_zone Scroll input node
-- @tfield vector3 zone_size Current scroll content size
-- @tfield number soft_size Soft zone size from style table
-- @tfield vector3 center_offset Distance from node to node's center
-- @tfield node view_node Scroll view node
-- @tfield node content_node Scroll content node
-- @tfield bool is_inert Flag, if scroll now moving by inertion
-- @tfield vector3 inert Current inert speed
-- @tfield vector3 pos Current scroll posisition
-- @tfield vector3 target Current scroll target position
--- Component style params
-- @table Style
-- @tfield number FRICT_HOLD Multiplier for inertion, while touching
-- @tfield number FRICT Multiplier for free inertion
-- @tfield number INERT_THRESHOLD Scroll speed to stop inertion
-- @tfield number INERT_SPEED Multiplier for inertion speed
-- @tfield number DEADZONE Deadzone for start scrol in pixels
-- @tfield number SOFT_ZONE_SIZE Size of outside zone in pixels (for scroll back moving)
-- @tfield number BACK_SPEED Scroll back returning lerp speed
-- @tfield number ANIM_SPEED Scroll gui.animation speed for scroll_to function
-- @tfield vector3 inertion Current inert speed
-- @tfield vector3 position Current scroll posisition
-- @tfield vector3 target_position Current scroll target position
-- @tfield vector4 available_pos Available position for content node: (min_x, max_y, max_x, min_y)
-- @tfield vector3 available_size Size of available positions: (width, height, 0)
-- @tfield druid.drag drag Drag component
-- @tfield[opt] selected Current index of points of interests
-- @tfield bool is_animate Flag, if scroll now animating by gui.animate
local Event = require("druid.event")
local helper = require("druid.helper")
local const = require("druid.const")
local helper = require("druid.helper")
local component = require("druid.component")
local M = component.create("scroll", { const.ON_UPDATE, const.ON_INPUT_HIGH })
local M = component.create("scroll", { const.ON_UPDATE })
-- Global on all scrolls
-- TODO: remove it
M.current_scroll = nil
local function get_border(node)
local pivot = gui.get_pivot(node)
local pivot_offset = helper.get_pivot_offset(pivot)
local size = vmath.mul_per_elem(gui.get_size(node), gui.get_scale(node))
return vmath.vector4(
-size.x*(0.5 + pivot_offset.x),
size.y*(0.5 + pivot_offset.y),
size.x*(0.5 - pivot_offset.x),
-size.y*(0.5 - pivot_offset.y)
)
local function inverse_lerp(min, max, current)
return helper.clamp((current - min) / (max - min), 0, 1)
end
local function update_border(self)
local input_border = get_border(self.input_zone)
local content_border = get_border(self.node)
--- Update vector with next conditions:
-- Field x have to <= field z
-- Field y have to <= field w
local function get_border_vector(vector)
if vector.x > vector.z then
vector.x, vector.z = vector.z, vector.x
end
if vector.y > vector.w then
vector.y, vector.w = vector.w, vector.y
end
-- border.x - min content.x node pos
-- border.y - min content.y node pos
-- border.z - max content.x node pos
-- border.w - max content.y node pos
self.border = vmath.vector4(
input_border.x - content_border.x,
-input_border.w + content_border.w,
input_border.z - content_border.z,
-input_border.y + content_border.y
)
self.can_x = (self.border.x ~= self.border.z)
self.can_y = (self.border.y ~= self.border.w)
return vector
end
--- Return size from scroll border vector4
local function get_size_vector(vector)
return vmath.vector3(vector.z - vector.x, vector.w - vector.y, 0)
end
local function set_pos(self, pos)
if self.pos.x ~= pos.x or self.pos.y ~= pos.y then
self.pos.x = pos.x
self.pos.y = pos.y
gui.set_position(self.node, self.pos)
self.on_scroll:trigger(self:get_context(), self.pos)
local function on_scroll_drag(self, dx, dy)
local t = self.target_position
local b = self.available_pos
local eb = self.available_pos_extra
-- Handle soft zones
-- Percent - multiplier for delta. Less if outside of scroll zone
local x_perc = 1
local y_perc = 1
-- Right border (minimum x)
if t.x < b.x and dx < 0 then
x_perc = inverse_lerp(eb.x, b.x, t.x)
end
-- Left border (maximum x)
if t.x > b.z and dx > 0 then
x_perc = inverse_lerp(eb.z, b.z, t.x)
end
-- Disable x scroll
if not self.drag.can_x then
x_perc = 0
end
-- Top border (minimum y)
if t.y < b.y and dy < 0 then
y_perc = inverse_lerp(eb.y, b.y, t.y)
end
-- Bot border (maximum y)
if t.y > b.w and dy > 0 then
y_perc = inverse_lerp(eb.w, b.w, t.y)
end
-- Disable y scroll
if not self.drag.can_y then
y_perc = 0
end
t.x = t.x + dx * x_perc
t.y = t.y + dy * y_perc
end
local function check_soft_zone(self)
local target = self.target_position
local border = self.available_pos
local speed = self.style.BACK_SPEED
-- Right border (minimum x)
if target.x < border.x then
target.x = helper.step(target.x, border.x, math.abs(target.x - border.x) * speed)
end
-- Left border (maximum x)
if target.x > border.z then
target.x = helper.step(target.x, border.z, math.abs(target.x - border.z) * speed)
end
-- Top border (maximum y)
if target.y < border.y then
target.y = helper.step(target.y, border.y, math.abs(target.y - border.y) * speed)
end
-- Bot border (minimum y)
if target.y > border.w then
target.y = helper.step(target.y, border.w, math.abs(target.y - border.w) * speed)
end
end
--- Return scroll, if it outside of scroll area
-- Using the lerp with BACK_SPEED koef
local function check_soft_target(self)
local t = self.target
local b = self.border
if t.y < b.y then
t.y = helper.step(t.y, b.y, math.abs(t.y - b.y) * self.style.BACK_SPEED)
end
if t.x > b.x then
t.x = helper.step(t.x, b.x, math.abs(t.x - b.x) * self.style.BACK_SPEED)
end
if t.y > b.w then
t.y = helper.step(t.y, b.w, math.abs(t.y - b.w) * self.style.BACK_SPEED)
end
if t.x < b.z then
t.x = helper.step(t.x, b.z, math.abs(t.x - b.z) * self.style.BACK_SPEED)
--- Cancel animation on other animation or input touch
local function cancel_animate(self)
if self.is_animate then
self.target_position = gui.get_position(self.content_node)
self.position.x = self.target_position.x
self.position.y = self.target_position.y
gui.cancel_animation(self.content_node, gui.PROP_POSITION)
self.is_animate = false
end
end
--- Free inert update function
local function update_hand_scroll(self, dt)
local inert = self.inert
local delta_x = self.target.x - self.pos.x
local delta_y = self.target.y - self.pos.y
if helper.sign(delta_x) ~= helper.sign(inert.x) then
inert.x = 0
local function set_scroll_position(self, position)
local available_extra = self.available_pos_extra
position.x = helper.clamp(position.x, available_extra.x, available_extra.z)
position.y = helper.clamp(position.y, available_extra.w, available_extra.y)
if self.position.x ~= position.x or self.position.y ~= position.y then
self.position.x = position.x
self.position.y = position.y
gui.set_position(self.content_node, position)
self.on_scroll:trigger(self:get_context(), self.position)
end
if helper.sign(delta_y) ~= helper.sign(inert.y) then
inert.y = 0
end
inert.x = inert.x + delta_x
inert.y = inert.y + delta_y
inert.x = math.abs(inert.x) * helper.sign(delta_x)
inert.y = math.abs(inert.y) * helper.sign(delta_y)
inert.x = inert.x * self.style.FRICT_HOLD
inert.y = inert.y * self.style.FRICT_HOLD
set_pos(self, self.target)
end
local function get_zone_center(self)
return self.pos + self.center_offset
end
@ -154,13 +163,13 @@ local function check_points(self)
return
end
local inert = self.inert
if not self.is_inert then
if math.abs(inert.x) > self.style.DEADZONE then
local inert = self.inertion
if not self._is_inert then
if math.abs(inert.x) > self.style.POINTS_DEADZONE then
self:scroll_to_index(self.selected - helper.sign(inert.x))
return
end
if math.abs(inert.y) > self.style.DEADZONE then
if math.abs(inert.y) > self.style.POINTS_DEADZONE then
self:scroll_to_index(self.selected + helper.sign(inert.y))
return
end
@ -168,20 +177,22 @@ local function check_points(self)
-- Find closest point and point by scroll direction
-- Scroll to one of them (by scroll direction in priority)
local temp_dist = math.huge
local temp_dist_on_inert = math.huge
local index = false
local index_on_inert = false
local pos = get_zone_center(self)
local pos = self.position
for i = 1, #self.points do
local p = self.points[i]
local dist = helper.distance(pos.x, pos.y, p.x, p.y)
local dist = helper.distance(pos.x, pos.y, -p.x, -p.y)
local on_inert = true
-- If inert ~= 0, scroll only by move direction
if inert.x ~= 0 and helper.sign(inert.x) ~= helper.sign(p.x - pos.x) then
if inert.x ~= 0 and helper.sign(inert.x) ~= helper.sign(-p.x - pos.x) then
on_inert = false
end
if inert.y ~= 0 and helper.sign(inert.y) ~= helper.sign(p.y - pos.y) then
if inert.y ~= 0 and helper.sign(inert.y) ~= helper.sign(-p.y - pos.y) then
on_inert = false
end
@ -200,221 +211,204 @@ end
local function check_threshold(self)
local inert = self.inert
if not self.is_inert or vmath.length(inert) < self.style.INERT_THRESHOLD then
local is_stopped = false
if self.inertion.x ~= 0 and math.abs(self.inertion.x) < self.style.INERT_THRESHOLD then
is_stopped = true
self.inertion.x = 0
end
if self.inertion.y ~= 0 and math.abs(self.inertion.y) < self.style.INERT_THRESHOLD then
is_stopped = true
self.inertion.y = 0
end
if is_stopped or not self._is_inert then
check_points(self)
inert.x = 0
inert.y = 0
end
end
local function update_free_inert(self, dt)
local inert = self.inert
if inert.x ~= 0 or inert.y ~= 0 then
self.target.x = self.pos.x + (inert.x * dt * self.style.INERT_SPEED)
self.target.y = self.pos.y + (inert.y * dt * self.style.INERT_SPEED)
local function update_free_scroll(self, dt)
local target = self.target_position
inert.x = inert.x * self.style.FRICT
inert.y = inert.y * self.style.FRICT
if self._is_inert and (self.inertion.x ~= 0 or self.inertion.y ~= 0) then
-- Inertion apply
target.x = self.position.x + self.inertion.x * self.style.INERT_SPEED * dt
target.y = self.position.y + self.inertion.y * self.style.INERT_SPEED * dt
-- Stop, when low inert speed and go to points
check_threshold(self)
end
check_soft_target(self)
set_pos(self, self.target)
end
-- Inertion friction
self.inertion = self.inertion * self.style.FRICT
--- Cancel animation on other animation or input touch
local function cancel_animate(self)
if self.animate then
self.target = gui.get_position(self.node)
self.pos.x = self.target.x
self.pos.y = self.target.y
gui.cancel_animation(self.node, gui.PROP_POSITION)
self.animate = false
check_soft_zone(self)
if self.position.x ~= target.x or self.position.y ~= target.y then
set_scroll_position(self, target)
end
end
local function add_delta(self, dx, dy)
local t = self.target
local b = self.border
local soft = self.soft_size
local function update_hand_scroll(self, dt)
local dx = self.target_position.x - self.position.x
local dy = self.target_position.y - self.position.y
-- TODO: Can we calc it more easier?
-- A lot of calculations for every side of border
self.inertion.x = (self.inertion.x + dx) * self.style.FRICT_HOLD
self.inertion.y = (self.inertion.y + dy) * self.style.FRICT_HOLD
-- Handle soft zones
-- Percent - multiplier for delta. Less if outside of scroll zone
local x_perc = 1
local y_perc = 1
if t.x > b.x and dx < 0 then
x_perc = (soft - (b.x - t.x)) / soft
end
if t.x < b.z and dx > 0 then
x_perc = (soft - (t.x - b.z)) / soft
end
-- If disabled scroll by x
if not self.can_x then
x_perc = 0
end
if t.y < b.y and dy < 0 then
y_perc = (soft - (b.y - t.y)) / soft
end
if t.y > b.w and dy > 0 then
y_perc = (soft - (t.y - b.w)) / soft
end
-- If disabled scroll by y
if not self.can_y then
y_perc = 0
end
-- Reset inert if outside of scroll zone
if x_perc ~= 1 then
self.inert.x = 0
end
if y_perc ~= 1 then
self.inert.y = 0
end
t.x = t.x + dx * x_perc
t.y = t.y + dy * y_perc
set_scroll_position(self, self.target_position)
end
--- Component init function
local function on_touch_start(self)
self.inertion.x = 0
self.inertion.y = 0
self.target_position.x = self.position.x
self.target_position.y = self.position.y
end
local function on_touch_end(self)
check_threshold(self)
end
local function update_size(self)
local view_border = helper.get_border(self.view_node)
local view_size = vmath.mul_per_elem(gui.get_size(self.view_node), gui.get_scale(self.view_node))
local content_border = helper.get_border(self.content_node)
local content_size = vmath.mul_per_elem(gui.get_size(self.content_node), gui.get_scale(self.content_node))
self.available_pos = get_border_vector(view_border - content_border)
self.available_size = get_size_vector(self.available_pos)
self.drag.can_x = self.available_size.x > 0
self.drag.can_y = self.available_size.y > 0
-- Extra content size calculation
-- We add extra size only if scroll is available
-- Even the content zone size less than view zone size
local content_border_extra = helper.get_border(self.content_node)
local stretch_size = self.style.EXTRA_STRECH_SIZE
if self.drag.can_x then
local sign = content_size.x > view_size.x and 1 or -1
content_border_extra.x = content_border_extra.x - stretch_size * sign
content_border_extra.z = content_border_extra.z + stretch_size * sign
end
if self.drag.can_y then
local sign = content_size.y > view_size.y and 1 or -1
content_border_extra.y = content_border_extra.y + stretch_size * sign
content_border_extra.w = content_border_extra.w - stretch_size * sign
end
if not self.style.SMALL_CONTENT_SCROLL then
self.drag.can_x = content_size.x > view_size.x
self.drag.can_y = content_size.y > view_size.y
end
self.available_pos_extra = get_border_vector(view_border - content_border_extra)
self.available_size_extra = get_size_vector(self.available_pos_extra)
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=0] number FRICT Multiplier for free inertion
-- @tfield[opt=0] number FRICT_HOLD Multiplier for inertion, while touching
-- @tfield[opt=3] number INERT_THRESHOLD Scroll speed to stop inertion
-- @tfield[opt=30] number INERT_SPEED Multiplier for inertion speed
-- @tfield[opt=20] number POINTS_DEADZONE Speed to check points of interests in no_inertion mode
-- @tfield[opt=0.35] number BACK_SPEED Scroll back returning lerp speed
-- @tfield[opt=0.2] number ANIM_SPEED Scroll gui.animation speed for scroll_to function
-- @tfield[opt=0] number EXTRA_STRECH_SIZE extra size in pixels outside of scroll (stretch effect)
-- @tfield[opt=false] bool SMALL_CONTENT_SCROLL If true, content node with size less than view node size can be scrolled
function M.on_style_change(self, style)
self.style = {}
self.style.EXTRA_STRECH_SIZE = style.EXTRA_STRECH_SIZE or 0
self.style.ANIM_SPEED = style.ANIM_SPEED or 0.2
self.style.BACK_SPEED = style.BACK_SPEED or 0.35
self.style.FRICT = style.FRICT or 0
self.style.FRICT_HOLD = style.FRICT_HOLD or 0
self.style.INERT_THRESHOLD = style.INERT_THRESHOLD or 3
self.style.INERT_SPEED = style.INERT_SPEED or 30
self.style.POINTS_DEADZONE = style.POINTS_DEADZONE or 20
self.style.SMALL_CONTENT_SCROLL = style.SMALL_CONTENT_SCROLL or false
self._is_inert = not (self.style.FRICT == 0 or
self.style.FRICT_HOLD == 0 or
self.style.INERT_SPEED == 0)
end
--- Scroll constructor.
-- @function scroll:init
-- @tparam node scroll_parent Gui node where placed scroll content. This node will change position
-- @tparam node input_zone Gui node where input is catched
function M.init(self, scroll_parent, input_zone)
self.style = self:get_style()
self.node = self:get_node(scroll_parent)
self.input_zone = self:get_node(input_zone)
-- @tparam node view_node GUI view scroll node
-- @tparam node content_node GUI content scroll node
function M.init(self, view_node, content_node)
self.druid = self:get_druid()
self.zone_size = gui.get_size(self.input_zone)
self.soft_size = self.style.SOFT_ZONE_SIZE
self.view_node = self:get_node(view_node)
self.content_node = self:get_node(content_node)
-- Distance from node to node's center
local offset = helper.get_pivot_offset(gui.get_pivot(self.input_zone))
self.center_offset = vmath.vector3(self.zone_size)
self.center_offset.x = self.center_offset.x * offset.x
self.center_offset.y = self.center_offset.y * offset.y
self.position = gui.get_position(self.content_node)
self.target_position = vmath.vector3(self.position)
self.inertion = vmath.vector3(0)
self.is_inert = true
self.inert = vmath.vector3(0)
self.pos = gui.get_position(self.node)
self.target = vmath.vector3(self.pos)
self.input = {
touch = false,
start_x = 0,
start_y = 0,
side = false,
}
update_border(self)
self.drag = self.druid:new_drag(view_node, on_scroll_drag)
self.drag.on_touch_start:subscribe(on_touch_start)
self.drag.on_touch_end:subscribe(on_touch_end)
self.on_scroll = Event()
self.on_scroll_to = Event()
self.on_point_scroll = Event()
self.selected = nil
self.is_animate = false
update_size(self)
end
function M.update(self, dt)
if self.input.touch then
if M.current_scroll == self then
update_hand_scroll(self, dt)
end
if self.drag.is_drag then
update_hand_scroll(self, dt)
else
update_free_inert(self, dt)
update_free_scroll(self, dt)
end
end
function M.on_input(self, action_id, action)
if action_id ~= const.ACTION_TOUCH then
return false
end
local inp = self.input
local inert = self.inert
local result = false
if gui.pick_node(self.input_zone, action.x, action.y) then
if action.pressed then
inp.touch = true
inp.start_x = action.x
inp.start_y = action.y
inert.x = 0
inert.y = 0
self.target.x = self.pos.x
self.target.y = self.pos.y
else
local dist = helper.distance(action.x, action.y, inp.start_x, inp.start_y)
if not M.current_scroll and dist >= self.style.DEADZONE then
local dx = math.abs(inp.start_x - action.x)
local dy = math.abs(inp.start_y - action.y)
inp.side = (dx > dy) and const.SIDE.X or const.SIDE.Y
-- Check scroll side if we can scroll
if (self.can_x and inp.side == const.SIDE.X or
self.can_y and inp.side == const.SIDE.Y) then
M.current_scroll = self
end
end
end
end
if inp.touch and not action.pressed then
if M.current_scroll == self then
add_delta(self, action.dx, action.dy)
result = true
end
end
if action.released then
inp.touch = false
inp.side = false
if M.current_scroll == self then
M.current_scroll = nil
result = true
end
check_threshold(self)
end
return result
end
--- Start scroll to target point
--- Start scroll to target point.
-- @function scroll:scroll_to
-- @tparam point vector3 target point
-- @tparam[opt] bool is_instant instant scroll flag
-- @tparam point vector3 Target point
-- @tparam[opt] bool is_instant Instant scroll flag
-- @usage scroll:scroll_to(vmath.vector3(0, 50, 0))
-- @usage scroll:scroll_to(vmath.vector3(0), true)
function M.scroll_to(self, point, is_instant)
local b = self.border
local target = vmath.vector3(point)
target.x = helper.clamp(point.x - self.center_offset.x, b.x, b.z)
target.y = helper.clamp(point.y - self.center_offset.y, b.y, b.w)
local b = self.available_pos
local target = vmath.vector3(-point.x, -point.y, 0)
target.x = helper.clamp(target.x, b.x, b.z)
target.y = helper.clamp(target.y, b.y, b.w)
cancel_animate(self)
self.animate = not is_instant
self.is_animate = not is_instant
if is_instant then
self.target = target
set_pos(self, target)
self.target_position = target
set_scroll_position(self, target)
else
gui.animate(self.node, gui.PROP_POSITION, target, gui.EASING_OUTSINE, self.style.ANIM_SPEED, 0, function()
self.animate = false
self.target = target
set_pos(self, target)
gui.animate(self.content_node, gui.PROP_POSITION, target, gui.EASING_OUTSINE, self.style.ANIM_SPEED, 0, function()
self.is_animate = false
self.target_position = target
set_scroll_position(self, target)
end)
end
@ -422,36 +416,15 @@ function M.scroll_to(self, point, is_instant)
end
--- Start scroll to target scroll percent
-- @function scroll:scroll_to_percent
-- @tparam point vector3 target percent
-- @tparam[opt] bool is_instant instant scroll flag
-- @usage scroll:scroll_to_percent(vmath.vector3(0.5, 0, 0))
function M.scroll_to_percent(self, percent, is_instant)
local border = self.border
local size_x = math.abs(border.z - border.x)
if size_x == 0 then
size_x = 1
end
local size_y = math.abs(border.w - border.y)
if size_y == 0 then
size_y = 1
end
local pos = vmath.vector3(
-size_x * percent.x + border.x,
-size_y * percent.y + border.y,
0)
M.scroll_to(self, pos, is_instant)
end
--- Scroll to item in scroll by point index
-- @function scroll:init
--- Scroll to item in scroll by point index.
-- @function scroll:scroll_to_index
-- @tparam number index Point index
-- @tparam[opt] bool skip_cb If true, skip the point callback
function M.scroll_to_index(self, index, skip_cb)
if not self.points then
return
end
index = helper.clamp(index, 1, #self.points)
if self.selected ~= index then
@ -466,21 +439,46 @@ function M.scroll_to_index(self, index, skip_cb)
end
--- Set points of interest.
-- Scroll will always centered on closer points
-- @function scroll:set_points
-- @tparam table points Array of vector3 points
function M.set_points(self, points)
self.points = points
-- cause of parent move in other side by y
for i = 1, #self.points do
self.points[i].y = -self.points[i].y
end
--- Start scroll to target scroll percent
-- @function scroll:scroll_to_percent
-- @tparam point vector3 target percent
-- @tparam[opt] bool is_instant instant scroll flag
-- @usage scroll:scroll_to_percent(vmath.vector3(0.5, 0, 0))
function M.scroll_to_percent(self, percent, is_instant)
local border = self.available_pos
table.sort(self.points, function(a, b)
return a.x > b.x or a.y < b.y
end)
check_threshold(self)
local pos = vmath.vector3(
-helper.lerp(border.x, border.z, 1 - percent.x),
-helper.lerp(border.w, border.y, 1 - percent.y),
0
)
M.scroll_to(self, pos, is_instant)
end
--- Return current scroll progress status.
-- Values will be in [0..1] interval
-- @function scroll:get_percent
-- @treturn vector3 New vector with scroll progress values
function M.get_percent(self)
local x_perc = 1 - inverse_lerp(self.available_pos.x, self.available_pos.z, self.position.x)
local y_perc = inverse_lerp(self.available_pos.w, self.available_pos.y, self.position.y)
return vmath.vector3(x_perc, y_perc, 0)
end
--- Set scroll content size.
-- It will change content gui node size
-- @function scroll:set_size
-- @tparam vector3 size The new size for content node
-- @treturn druid.scroll Self instance
function M.set_size(self, size)
gui.set_size(self.content_node, size)
update_size(self)
return self
end
@ -489,49 +487,57 @@ end
-- If no points, just simple drag without inertion
-- @function scroll:set_inert
-- @tparam bool state Inert scroll state
-- @treturn druid.scroll Self instance
function M.set_inert(self, state)
self.is_inert = state
self._is_inert = state
return self
end
--- Set the callback on scrolling to point (if exist)
-- @function scroll:on_point_move
-- @tparam function callback Callback on scroll to point of interest
function M.on_point_move(self, callback)
self.on_point_scroll:subscribe(callback)
--- Return if scroll have inertion.
-- @function scroll:is_inert
-- @treturn bool If scroll have inertion
function M.is_inert(self)
return self._is_inert
end
--- Set the scroll possibly area
-- @function scroll:set_border
-- @tparam vector3 border Size of scrolling area
function M.set_border(self, content_size)
gui.set_size(self.node, content_size)
update_border(self)
--- Set extra size for scroll stretching.
-- Set 0 to disable stretching effect
-- @function scroll:set_extra_strech_size
-- @tparam[opt=0] number stretch_size Size in pixels of additional scroll area
-- @treturn druid.scroll Self instance
function M.set_extra_strech_size(self, stretch_size)
self.style.EXTRA_STRECH_SIZE = stretch_size or 0
update_size(self)
return self
end
--- Return current scroll progress
-- @function scroll:get_scroll_percent
-- @treturn vector3 Scroll progress
function M.get_scroll_percent(self)
local border = self.border
local size_x = math.abs(border.z - border.x)
if size_x == 0 then
size_x = 1
end
--- Return vector of scroll size with width and height.
-- @function scroll:get_scroll_size
-- @treturn vector3 Available scroll size
function M.get_scroll_size(self)
return self.available_size
end
local size_y = math.abs(border.w - border.y)
if size_y == 0 then
size_y = 1
end
local pos = self.pos
return vmath.vector3(
(border.x - pos.x) / size_x,
(border.y - pos.y) / size_y,
0
)
--- Set points of interest.
-- Scroll will always centered on closer points
-- @function scroll:set_points
-- @tparam table points Array of vector3 points
-- @treturn druid.scroll Self instance
function M.set_points(self, points)
self.points = points
table.sort(self.points, function(a, b)
return a.x > b.x or a.y < b.y
end)
check_threshold(self)
return self
end

View File

@ -12,12 +12,6 @@
-- @table Events
-- @tfield druid_event on_swipe Trigger on swipe event
--- Component style params
-- @table Style
-- @tfield number SWIPE_TIME Maximum time for swipe trigger
-- @tfield number SWIPE_THRESHOLD Minimum distance for swipe trigger
-- @tfield bool SWIPE_TRIGGER_ON_MOVE If true, trigger on swipe moving, not only release action
local Event = require("druid.event")
local const = require("druid.const")
local helper = require("druid.helper")
@ -48,6 +42,7 @@ local function check_swipe(self, action)
if is_swipe then
local is_x_swipe = math.abs(dx) >= math.abs(dy)
local swipe_side = false
if is_x_swipe and dx > 0 then
swipe_side = const.SWIPE.RIGHT
end
@ -67,12 +62,26 @@ local function check_swipe(self, action)
end
--- Component style params.
-- You can override this component styles params in druid styles table
-- or create your own style
-- @table Style
-- @tfield[opt=0.4] number SWIPE_TIME Maximum time for swipe trigger
-- @tfield[opt=50] number SWIPE_THRESHOLD Minimum distance for swipe trigger
-- @tfield[opt=false] bool SWIPE_TRIGGER_ON_MOVE If true, trigger on swipe moving, not only release action
function M.on_style_change(self, style)
self.style = {}
self.style.SWIPE_TIME = style.SWIPE_TIME or 0.4
self.style.SWIPE_THRESHOLD = style.SWIPE_THRESHOLD or 50
self.style.SWIPE_TRIGGER_ON_MOVE = style.SWIPE_TRIGGER_ON_MOVE or false
end
--- Component init function
-- @function swipe:init
-- @tparam node node Gui node
-- @tparam function on_swipe_callback Swipe callback for on_swipe_end event
function M.init(self, node, on_swipe_callback)
self.style = self:get_style()
self._trigger_on_move = self.style.SWIPE_TRIGGER_ON_MOVE
self.node = self:get_node(node)

View File

@ -196,7 +196,7 @@ end
--- Return true, if text with line break
-- @function text:is_multiline
-- @treturn boolean Is text node with line break
-- @treturn bool Is text node with line break
function M.is_multiline(self)
return gui.get_line_break(self.node)
end

View File

@ -9,24 +9,18 @@ local class = require("druid.system.middleclass")
local Component = class("druid.component")
--- Get current component style table
-- @function component:get_style
-- @treturn table Component style table
function Component.get_style(self)
if not self._meta.style then
return const.EMPTY_TABLE
end
return self._meta.style[self._component.name] or const.EMPTY_TABLE
end
--- Set current component style table
--- Set current component style table.
-- Invoke `on_style_change` on component, if exist. Component should handle
-- their style changing and store all style params
-- @function component:set_style
-- @tparam table style Druid style module
function Component.set_style(self, druid_style)
self._meta.style = druid_style
self._style = self:get_style()
self._meta.style = druid_style or const.EMPTY_TABLE
local component_style = self._meta.style[self._component.name] or const.EMPTY_TABLE
if self.on_style_change then
self:on_style_change(component_style)
end
end
@ -92,6 +86,7 @@ function Component.increase_input_priority(self)
self._meta.increased_input_priority = true
end
--- Reset input priority in current input stack
-- @function component:reset_input_priority
function Component.reset_input_priority(self)
@ -133,21 +128,39 @@ end
-- @treturn Druid Druid instance with component context
function Component.get_druid(self)
local context = { _context = self }
return setmetatable(context, { __index = self:get_context().druid })
return setmetatable(context, { __index = self._meta.druid })
end
--- Return true, if current component is child of another component
-- @function component:is_child_of
-- @treturn bool True, if current component is child of another
function Component.is_child_of(self, component)
return self:get_context() == component
end
--- Return component name
-- @function component:get_name
-- @treturn string The component name
function Component.get_name(self)
return self._component.name
end
--- Setup component context and his style table
-- @function component:setup_component
-- @tparam druid_instance table The parent druid instance
-- @tparam context table Druid context. Usually it is self of script
-- @tparam style table Druid style module
-- @treturn Component Component itself
function Component.setup_component(self, context, style)
function Component.setup_component(self, druid_instance, context, style)
self._meta = {
template = nil,
context = nil,
nodes = nil,
style = nil,
druid = druid_instance,
increased_input_priority = false
}
@ -162,9 +175,11 @@ end
-- by `Component.static.create`
-- @function component:initialize
-- @tparam string name Component name
-- @tparam table interest List of component's interest
-- @tparam[opt={}] table interest List of component's interest
-- @local
function Component.initialize(self, name, interest)
interest = interest or {}
self._component = {
name = name,
interest = interest
@ -176,7 +191,7 @@ end
-- druid component.
-- @function Component.create
-- @tparam string name Component name
-- @tparam table interest List of component's interest
-- @tparam[opt={}] table interest List of component's interest
function Component.static.create(name, interest)
-- Yea, inheritance here
local new_class = class(name, Component)

View File

@ -14,6 +14,7 @@ M.ACTION_ESC = hash("key_esc")
M.ACTION_TOUCH = hash("touch")
M.ACTION_SCROLL_UP = hash("scroll_up")
M.ACTION_MULTITOUCH = hash("multitouch")
M.ACTION_SCROLL_DOWN = hash("scroll_down")
@ -36,6 +37,19 @@ M.ON_LAYOUT_CHANGE = hash("on_layout_change")
M.ON_LANGUAGE_CHANGE = hash("on_language_change")
M.ALL_INTERESTS = {
M.ALL,
M.ON_INPUT,
M.ON_UPDATE,
M.ON_MESSAGE,
M.ON_FOCUS_LOST,
M.ON_INPUT_HIGH,
M.ON_FOCUS_GAINED,
M.ON_LAYOUT_CHANGE,
M.ON_LANGUAGE_CHANGE,
}
M.PIVOTS = {
[gui.PIVOT_CENTER] = vmath.vector3(0),
[gui.PIVOT_N] = vmath.vector3(0, 0.5, 0),
@ -63,11 +77,22 @@ M.UI_INPUT = {
}
M.OS = {
ANDROID = "Android",
IOS = "iPhone OS",
MAC = "Darwin",
LINUX = "Linux",
WINDOWS = "Windows",
BROWSER = "HTML5",
}
M.SIDE = {
X = "x",
Y = "y"
}
M.SWIPE = {
UP = "up",
DOWN = "down",

View File

@ -69,15 +69,15 @@ end
-- @function druid.set_default_style
-- @tparam table style Druid style module
function M.set_default_style(style)
settings.default_style = style
settings.default_style = style or {}
end
--- Set text function.
--- Set text function
-- Druid locale component will call this function
-- to get translated text. After set_text_funtion
-- all existing locale component will be updated
-- @function druid.set_text_function(callback)
-- @function druid.set_text_function
-- @tparam function callback Get localized text function
function M.set_text_function(callback)
settings.get_text = callback or const.EMPTY_FUNCTION

View File

@ -126,6 +126,11 @@ function M.round(num, numDecimalPlaces)
end
function M.lerp(a, b, t)
return a + (b - a) * t
end
--- Check if node is enabled in gui hierarchy.
-- Return false, if node or any his parent is disabled
-- @function helper.is_enabled
@ -152,4 +157,35 @@ function M.get_pivot_offset(pivot)
end
--- Check if device is mobile (Android or iOS)
-- @function helper..is_mobile
function M.is_mobile()
local system_name = sys.get_sys_info().system_name
return system_name == const.OS.IOS or system_name == const.OS.ANDROID
end
--- Check if device is HTML5
-- @function helper.is_web
function M.is_web()
local system_name = sys.get_sys_info().system_name
return system_name == const.OS.BROWSER
end
--- Distance from node to size border
-- @function helper.get_border
-- @return vector4 (left, top, right, down)
function M.get_border(node)
local pivot = gui.get_pivot(node)
local pivot_offset = M.get_pivot_offset(pivot)
local size = vmath.mul_per_elem(gui.get_size(node), gui.get_scale(node))
return vmath.vector4(
-size.x*(0.5 + pivot_offset.x),
size.y*(0.5 - pivot_offset.y),
size.x*(0.5 - pivot_offset.x),
-size.y*(0.5 + pivot_offset.y)
)
end
return M

View File

@ -6,6 +6,7 @@ local M = {}
M["button"] = {
HOVER_SCALE = vmath.vector3(0.02, 0.02, 1),
HOVER_MOUSE_SCALE = vmath.vector3(0.01, 0.01, 1),
HOVER_TIME = 0.04,
SCALE_CHANGE = vmath.vector3(0.035, 0.035, 1),
BTN_SOUND = "click",
@ -23,6 +24,13 @@ M["button"] = {
anims.hover_scale(self, target_scale, M.button.HOVER_TIME)
end,
on_mouse_hover = function(self, node, state)
local scale_to = self.start_scale + M.button.HOVER_MOUSE_SCALE
local target_scale = state and scale_to or self.start_scale
anims.hover_scale(self, target_scale, M.button.HOVER_TIME)
end,
on_click = function(self, node)
local scale_to = self.start_scale + M.button.SCALE_CHANGE
anims.tap_scale_animation(self, node, scale_to)
@ -43,16 +51,24 @@ M["button"] = {
}
M["drag"] = {
DRAG_DEADZONE = 10, -- Size in pixels of drag deadzone
}
M["scroll"] = {
FRICT_HOLD = 0.8, -- mult. for inert, while touching
ANIM_SPEED = 0.2, -- gui.animation speed to point
BACK_SPEED = 0.35, -- Lerp speed of return to soft position
FRICT = 0.93, -- mult for free inert
INERT_THRESHOLD = 2, -- speed to stop inertion
INERT_SPEED = 25, -- koef. of inert speed
DEADZONE = 6, -- in px
SOFT_ZONE_SIZE = 160, -- size of outside zone (back move)
SCROLL_WHEEL_SPEED = 10,
BACK_SPEED = 0.2, -- lerp speed
ANIM_SPEED = 0.3, -- gui.animation speed to point
FRICT_HOLD = 0.79, -- mult. for inert, while touching
INERT_THRESHOLD = 2.5, -- speed to stop inertion
INERT_SPEED = 30, -- koef. of inert speed
EXTRA_STRECH_SIZE = 100, -- extra size in pixels outside of scroll (stretch effect)
POINTS_DEADZONE = 20, -- Speed to check points of interests in no_inertion mode
SCROLL_WHEEL_SPEED = 20,
SMALL_CONTENT_SCROLL = true, -- If true, content node with size less than view node size can be scrolled
}
@ -62,11 +78,6 @@ M["progress"] = {
}
M["progress_rich"] = {
DELAY = 1, -- delay in seconds before main fill
}
M["checkbox"] = {
on_change_state = function(self, node, state)
local target = state and 1 or 0
@ -107,10 +118,6 @@ M["input"] = {
end,
button = {
BTN_SOUND = "click",
BTN_SOUND_DISABLED = "click",
DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
ENABLED_COLOR = vmath.vector4(1),
LONGTAP_TIME = 0.4,
AUTOHOLD_TRIGGER = 0.8,
DOUBLETAP_TIME = 0.4,

View File

@ -1,51 +1 @@
local M = {}
M["button"] = {
BTN_SOUND = "click",
BTN_SOUND_DISABLED = "click",
DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
ENABLED_COLOR = vmath.vector4(1),
LONGTAP_TIME = 0.4,
DOUBLETAP_TIME = 0.4,
}
M["scroll"] = {
FRICT_HOLD = 0, -- mult. for inert, while touching
FRICT = 0, -- mult for free inert
INERT_THRESHOLD = 2, -- speed to stop inertion
INERT_SPEED = 0, -- koef. of inert speed
DEADZONE = 6, -- in px
SOFT_ZONE_SIZE = 20, -- size of outside zone (back move)
BACK_SPEED = 0, -- lerp speed
ANIM_SPEED = 0, -- gui.animation speed to point
}
M["progress"] = {
SPEED = 5, -- progress bar fill rate, more faster
MIN_DELTA = 1
}
M["progress_rich"] = {
DELAY = 0, -- delay in seconds before main fill
}
M["checkbox"] = {
on_change_state = function(self, node, state)
gui.set_enabled(node, state)
end
}
M["swipe"] = {
SWIPE_THRESHOLD = 50,
SWIPE_TIME = 0.4,
SWIPE_TRIGGER_ON_MOVE = false
}
return M
return {}

View File

@ -2,58 +2,23 @@ local M = {}
M["button"] = {
BTN_SOUND = "click",
BTN_SOUND_DISABLED = "click",
DISABLED_COLOR = vmath.vector4(0, 0, 0, 1),
ENABLED_COLOR = vmath.vector4(1),
LONGTAP_TIME = 0.4,
DOUBLETAP_TIME = 0.4,
HOVER_IMAGE = "button_yellow",
HOVER_MOUSE_IMAGE = "button_yellow",
DEFAULT_IMAGE = "button_blue",
CLICK_IMAGE = "button_red",
HOVER_IMAGE = "button_red",
on_hover = function(self, node, state)
local anim = state and M.button.HOVER_IMAGE or M.button.DEFAULT_IMAGE
gui.play_flipbook(node, anim)
end,
on_mouse_hover = function(self, node, state)
local anim = state and M.button.HOVER_MOUSE_IMAGE or M.button.DEFAULT_IMAGE
gui.play_flipbook(node, anim)
end
}
M["scroll"] = {
FRICT_HOLD = 0, -- mult. for inert, while touching
FRICT = 0, -- mult for free inert
INERT_THRESHOLD = 2, -- speed to stop inertion
INERT_SPEED = 0, -- koef. of inert speed
DEADZONE = 6, -- in px
SOFT_ZONE_SIZE = 20, -- size of outside zone (back move)
BACK_SPEED = 0, -- lerp speed
ANIM_SPEED = 0, -- gui.animation speed to point
}
M["progress"] = {
SPEED = 5, -- progress bar fill rate, more faster
MIN_DELTA = 1
}
M["progress_rich"] = {
DELAY = 0, -- delay in seconds before main fill
}
M["checkbox"] = {
on_change_state = function(self, node, state)
gui.set_enabled(node, state)
end
}
M["swipe"] = {
SWIPE_THRESHOLD = 50,
SWIPE_TIME = 0.4,
SWIPE_TRIGGER_ON_MOVE = false
}
return M

View File

@ -16,6 +16,7 @@
-- @see druid.checkbox_group
-- @see druid.radio_group
-- @see druid.swipe
-- @see druid.drag
local const = require("druid.const")
local druid_input = require("druid.helper.druid_input")
@ -38,6 +39,7 @@ local checkbox_group = require("druid.base.checkbox_group")
local radio_group = require("druid.base.radio_group")
local input = require("druid.base.input")
local swipe = require("druid.base.swipe")
local drag = require("druid.base.drag")
-- local infinity_scroll = require("druid.base.infinity_scroll")
-- @classmod Druid
@ -59,23 +61,17 @@ end
-- Create the component itself
local function create(self, instance_class)
local instance = instance_class()
instance:setup_component(self._context, self._style)
instance:setup_component(self, self._context, self._style)
self.components[const.ALL] = self.components[const.ALL] or {}
table.insert(self.components[const.ALL], instance)
local register_to = instance:get_interests()
if register_to then
for i = 1, #register_to do
local interest = register_to[i]
if not self.components[interest] then
self.components[interest] = {}
end
table.insert(self.components[interest], instance)
for i = 1, #register_to do
local interest = register_to[i]
table.insert(self.components[interest], instance)
if const.UI_INPUT[interest] then
input_init(self)
end
if const.UI_INPUT[interest] then
input_init(self)
end
end
@ -84,7 +80,7 @@ end
local function process_input(action_id, action, components, is_input_consumed)
if not components then
if #components == 0 then
return is_input_consumed
end
@ -128,7 +124,11 @@ function Druid.initialize(self, context, style)
self._style = style or settings.default_style
self._deleted = false
self.url = msg.url()
self.components = {}
for i = 1, #const.ALL_INTERESTS do
self.components[const.ALL_INTERESTS[i]] = {}
end
end
@ -170,6 +170,14 @@ end
function Druid.remove(self, component)
local all_components = self.components[const.ALL]
-- Recursive remove all children of component
for i = 1, #all_components do
local inst = all_components[i]
if inst:is_child_of(component) then
self:remove(inst)
end
end
for i = #all_components, 1, -1 do
if all_components[i] == component then
if component.on_remove then
@ -180,14 +188,12 @@ function Druid.remove(self, component)
end
local interests = component:get_interests()
if interests then
for i = 1, #interests do
local interest = interests[i]
local components = self.components[interest]
for j = #components, 1, -1 do
if components[j] == component then
table.remove(components, j)
end
for i = 1, #interests do
local interest = interests[i]
local components = self.components[interest]
for j = #components, 1, -1 do
if components[j] == component then
table.remove(components, j)
end
end
end
@ -199,10 +205,8 @@ end
-- @tparam number dt Delta time
function Druid.update(self, dt)
local components = self.components[const.ON_UPDATE]
if components then
for i = 1, #components do
components[i]:update(dt)
end
for i = 1, #components do
components[i]:update(dt)
end
end
@ -231,6 +235,7 @@ end
-- @tparam hash sender Sender from on_message
function Druid.on_message(self, message_id, message, sender)
local specific_ui_message = const.SPECIFIC_UI_MESSAGES[message_id]
if specific_ui_message then
local components = self.components[message_id]
if components then
@ -241,10 +246,8 @@ function Druid.on_message(self, message_id, message, sender)
end
else
local components = self.components[const.ON_MESSAGE]
if components then
for i = 1, #components do
components[i]:on_message(message_id, message, sender)
end
for i = 1, #components do
components[i]:on_message(message_id, message, sender)
end
end
end
@ -255,10 +258,8 @@ end
-- @function druid:on_focus_lost
function Druid.on_focus_lost(self)
local components = self.components[const.ON_FOCUS_LOST]
if components then
for i = 1, #components do
components[i]:on_focus_lost()
end
for i = 1, #components do
components[i]:on_focus_lost()
end
end
@ -268,10 +269,8 @@ end
-- @function druid:on_focus_gained
function Druid.on_focus_gained(self)
local components = self.components[const.ON_FOCUS_GAINED]
if components then
for i = 1, #components do
components[i]:on_focus_gained()
end
for i = 1, #components do
components[i]:on_focus_gained()
end
end
@ -281,10 +280,8 @@ end
-- @function druid:on_layout_change
function Druid.on_layout_change(self)
local components = self.components[const.ON_LAYOUT_CHANGE]
if components then
for i = 1, #components do
components[i]:on_layout_change()
end
for i = 1, #components do
components[i]:on_layout_change()
end
end
@ -295,10 +292,8 @@ end
-- @function druid.on_language_change
function Druid.on_language_change(self)
local components = self.components[const.ON_LANGUAGE_CHANGE]
if components then
for i = 1, #components do
components[i]:on_language_change()
end
for i = 1, #components do
components[i]:on_language_change()
end
end
@ -447,4 +442,13 @@ function Druid.new_swipe(self, ...)
end
--- Create drag basic component
-- @function druid:new_drag
-- @tparam args ... drag init args
-- @treturn Componetn drag component
function Druid.new_drag(self, ...)
return Druid.create(self, drag, ...)
end
return Druid

View File

@ -198,7 +198,7 @@ nodes {
}
size {
x: 600.0
y: 1250.0
y: 1500.0
z: 0.0
w: 1.0
}
@ -5334,7 +5334,7 @@ nodes {
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_STENCIL
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
@ -5362,7 +5362,7 @@ nodes {
}
size {
x: 600.0
y: 1900.0
y: 2100.0
z: 0.0
w: 1.0
}
@ -5389,7 +5389,7 @@ nodes {
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_mode: CLIPPING_MODE_STENCIL
clipping_visible: true
clipping_inverted: false
alpha: 1.0
@ -5925,7 +5925,7 @@ nodes {
}
nodes {
position {
x: -300.0
x: -287.0
y: 0.0
z: 0.0
w: 1.0
@ -6789,6 +6789,572 @@ nodes {
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 0.0
y: -1300.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 600.0
y: 300.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: "kenney/empty"
id: "scroll_with_points"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_page_content"
layer: "image"
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_STENCIL
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: -300.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 2400.0
y: 300.0
z: 0.0
w: 1.0
}
color {
x: 0.9019608
y: 0.5019608
z: 0.3019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "scroll_with_points_content"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_W
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_with_points"
layer: "image"
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 300.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 500.0
y: 250.0
z: 0.0
w: 1.0
}
color {
x: 0.9019608
y: 0.7019608
z: 0.9019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "intereset_point_1"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_with_points_content"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 900.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 500.0
y: 250.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 0.7019608
z: 0.7019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "intereset_point_2"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_with_points_content"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 1500.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 500.0
y: 250.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 0.9019608
z: 0.7019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "intereset_point_3"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_with_points_content"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 2100.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 500.0
y: 250.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 0.6
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "intereset_point_4"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_with_points_content"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 0.0
y: -1750.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 550.0
y: 500.0
z: 0.0
w: 1.0
}
color {
x: 0.5019608
y: 0.2
z: 0.3019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "scroll_smaller_view"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_page_content"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 1.0
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: -197.0
y: 223.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 200.0
y: 100.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "View"
font: "game"
id: "scroll_smaller_view_hint"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
outline {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
shadow {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
adjust_mode: ADJUST_MODE_FIT
line_break: false
parent: "scroll_smaller_view"
layer: ""
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.0
template_node_child: false
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 200.0
y: 200.0
z: 0.0
w: 1.0
}
color {
x: 0.4
y: 0.3019608
z: 0.7019608
w: 1.0
}
type: TYPE_BOX
blend_mode: BLEND_MODE_ALPHA
texture: ""
id: "scroll_smaller_content"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
adjust_mode: ADJUST_MODE_FIT
parent: "scroll_smaller_view"
layer: ""
inherit_alpha: true
slice9 {
x: 0.0
y: 0.0
z: 0.0
w: 0.0
}
clipping_mode: CLIPPING_MODE_NONE
clipping_visible: true
clipping_inverted: false
alpha: 0.5
template_node_child: false
size_mode: SIZE_MODE_MANUAL
}
nodes {
position {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
rotation {
x: 0.0
y: 0.0
z: 0.0
w: 1.0
}
scale {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
size {
x: 200.0
y: 100.0
z: 0.0
w: 1.0
}
color {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
type: TYPE_TEXT
blend_mode: BLEND_MODE_ALPHA
text: "Content"
font: "game"
id: "scroll_smaller_content_hint"
xanchor: XANCHOR_NONE
yanchor: YANCHOR_NONE
pivot: PIVOT_CENTER
outline {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
shadow {
x: 1.0
y: 1.0
z: 1.0
w: 1.0
}
adjust_mode: ADJUST_MODE_FIT
line_break: false
parent: "scroll_smaller_content"
layer: ""
inherit_alpha: true
alpha: 1.0
outline_alpha: 0.0
shadow_alpha: 0.0
template_node_child: false
text_leading: 1.0
text_tracking: 0.0
}
nodes {
position {
x: 2400.0

View File

@ -3,12 +3,12 @@ local druid = require("druid.druid")
local empty_style = require("druid.styles.empty.style")
local default_style = require("druid.styles.default.style")
local main_page = require("example.page.main")
local text_page = require("example.page.texts")
local button_page = require("example.page.button")
local scroll_page = require("example.page.scroll")
local slider_page = require("example.page.slider")
local input_page = require("example.page.input")
local main_page = require("example.page.main_page")
local text_page = require("example.page.texts_page")
local button_page = require("example.page.button_page")
local scroll_page = require("example.page.scroll_page")
local slider_page = require("example.page.slider_page")
local input_page = require("example.page.input_page")
local pages = {
"main_page",
@ -21,12 +21,8 @@ local pages = {
local function on_control_button(self, delta)
self.page = self.page + delta
if self.page < 1 then
self.page = #pages
end
if self.page > #pages then
self.page = 1
end
self.page = math.max(1, self.page)
self.page = math.min(self.page, #pages)
self.header:translate(pages[self.page])
local node = gui.get_node("C_Anchor")
@ -35,6 +31,7 @@ end
local function init_top_panel(self)
self.druid:new_blocker("panel_top")
self.druid:new_button("button_left/button", on_control_button, -1)
self.druid:new_button("button_right/button", on_control_button, 1)
self.header = self.druid:new_lang_text("text_header", "main_page")
@ -64,8 +61,8 @@ function init(self)
window.set_listener(on_window_callback)
init_top_panel(self)
init_swipe_control(self)
self.page = 1
main_page.setup_page(self)
text_page.setup_page(self)
@ -74,6 +71,8 @@ function init(self)
slider_page.setup_page(self)
input_page.setup_page(self)
init_top_panel(self)
-- Refresh state
on_control_button(self, 0)
end

View File

@ -97,7 +97,7 @@ end
local function setup_scroll(self)
self.scroll = self.druid:new_scroll("scroll_content", "main_page")
self.druid:new_scroll("main_page", "scroll_content")
end

View File

@ -1,55 +0,0 @@
local M = {}
local function init_grid(self)
local prefab = gui.get_node("grid_prefab")
local grid_scroll = self.druid:new_scroll("grid_content", "scroll_with_grid_size")
local grid = self.druid:new_grid("grid_content", "grid_prefab", 20)
grid:set_anchor(vmath.vector3(0, 0.5, 0))
for i = 1, 40 do
local clone_prefab = gui.clone_tree(prefab)
grid:add(clone_prefab["grid_prefab"])
gui.set_text(clone_prefab["grid_prefab_text"], "Node " .. i)
local button = self.druid:new_button(clone_prefab["grid_button"], function()
local position = gui.get_position(clone_prefab["grid_prefab"])
position.x = -position.x
grid_scroll:scroll_to(position)
end)
button:set_click_zone(gui.get_node("scroll_with_grid_size"))
end
gui.set_enabled(prefab, false)
grid_scroll:set_border(grid:get_size())
local scroll_slider = self.druid:new_slider("grid_scroll_pin", vmath.vector3(300, 0, 0), function(_, value)
grid_scroll:scroll_to_percent(vmath.vector3(value, 0, 0), true)
end)
grid_scroll.on_scroll:subscribe(function(_, point)
scroll_slider:set(grid_scroll:get_scroll_percent().x, true)
end)
end
function M.setup_page(self)
self.druid:new_scroll("scroll_page_content", "scroll_page")
self.druid:new_scroll("simple_scroll_content", "simple_scroll_input")
-- scroll contain scrolls:
-- parent first
self.druid:new_scroll("children_scroll_content", "children_scroll")
-- chilren next
self.druid:new_scroll("children_scroll_content_1", "children_scroll_1")
self.druid:new_scroll("children_scroll_content_2", "children_scroll_2")
self.druid:new_scroll("children_scroll_content_3", "children_scroll_3")
init_grid(self)
end
return M

View File

@ -0,0 +1,71 @@
local M = {}
local function init_scroll_with_grid(self)
local prefab = gui.get_node("grid_prefab")
local grid_scroll = self.druid:new_scroll("scroll_with_grid_size", "grid_content")
local grid = self.druid:new_grid("grid_content", "grid_prefab", 20)
for i = 1, 40 do
local clone_prefab = gui.clone_tree(prefab)
grid:add(clone_prefab["grid_prefab"])
gui.set_text(clone_prefab["grid_prefab_text"], "Node " .. i)
local button = self.druid:new_button(clone_prefab["grid_button"], function()
local position = gui.get_position(clone_prefab["grid_prefab"])
grid_scroll:scroll_to(position)
end)
button:set_click_zone(gui.get_node("scroll_with_grid_size"))
end
gui.set_enabled(prefab, false)
grid_scroll:set_size(grid:get_size())
local scroll_slider = self.druid:new_slider("grid_scroll_pin", vmath.vector3(287, 0, 0), function(_, value)
grid_scroll:scroll_to_percent(vmath.vector3(value, 0, 0), true)
end)
grid_scroll.on_scroll:subscribe(function(_, point)
scroll_slider:set(grid_scroll:get_percent().x, true)
end)
end
function M.setup_page(self)
-- Usual scroll for whole page
self.druid:new_scroll("scroll_page", "scroll_page_content")
-- Simple scroll with no adjust
self.druid:new_scroll("simple_scroll_input", "simple_scroll_content")
-- Scroll with grid example
init_scroll_with_grid(self)
-- Scroll contain children scrolls:
-- Parent scroll
self.druid:new_scroll("children_scroll", "children_scroll_content")
-- Childre scrolls
self.druid:new_scroll("children_scroll_1", "children_scroll_content_1")
self.druid:new_scroll("children_scroll_2", "children_scroll_content_2")
self.druid:new_scroll("children_scroll_3", "children_scroll_content_3")
-- Content with less size than view
self.druid:new_scroll("scroll_smaller_view", "scroll_smaller_content")
:set_extra_strech_size(0)
:set_inert(false)
-- Scroll with points of interests
self.druid:new_scroll("scroll_with_points", "scroll_with_points_content")
:set_points({
vmath.vector3(300, 0, 0),
vmath.vector3(900, 0, 0),
vmath.vector3(1500, 0, 0),
vmath.vector3(2100, 0, 0),
})
end
return M

View File

@ -10,7 +10,7 @@ height = 900
[project]
title = druid
version = 0.3.0
version = 0.4.0
[library]
include_dirs = druid

View File

@ -18,10 +18,6 @@ key_trigger {
input: KEY_ESC
action: "key_esc"
}
mouse_trigger {
input: MOUSE_BUTTON_1
action: "touch"
}
mouse_trigger {
input: MOUSE_WHEEL_UP
action: "scroll_up"
@ -30,6 +26,14 @@ mouse_trigger {
input: MOUSE_WHEEL_DOWN
action: "scroll_down"
}
mouse_trigger {
input: MOUSE_BUTTON_1
action: "touch"
}
touch_trigger {
input: TOUCH_MULTI
action: "multitouch"
}
text_trigger {
input: TEXT
action: "text"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 24 KiB