ewol/ewol_tutorial_complex_xml_gui.html
2016-10-23 21:18:24 +02:00

189 lines
16 KiB
HTML

<!-- HTML header for doxygen 1.8.8-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- For Mobile Devices -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/xhtml;charset=UTF-8"/>
<meta name="generator" content="Doxygen 1.8.12"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<title>Ewol: Ewol Widget in OpenGl: EWOL: Comple XML GUI</title>
<!--<link href="tabs.css" rel="stylesheet" type="text/css"/>-->
<script type="text/javascript" src="dynsections.js"></script>
<link href="search/search.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="search/searchdata.js"></script>
<script type="text/javascript" src="search/search.js"></script>
<link href="doxygen.css" rel="stylesheet" type="text/css" />
<link href="customdoxygen.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="doxy-boot.js"></script>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand">Ewol: Ewol Widget in OpenGl 0.10.0</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="index.html">Main&nbsp;Page</a></li>
<li><a href="pages.html">Related&nbsp;Pages</a></li>
<li><a href="namespaces.html">Namespaces</a></li>
<li><a href="annotated.html">Classes</a></li>
<li><a href="files.html">Files</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
Link-libs<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="http://HeeroYui.github.io/lutin">lutin</a></li>
<li><a href="http://atria-soft.github.io/ewol">ewol</a></li>
<li><a href="http://atria-soft.github.io/etk">etk</a></li>
<li><a href="http://atria-soft.github.io/ejson">ejson</a></li>
<li><a href="http://atria-soft.github.io/exml">exml</a></li>
<li><a href="http://atria-soft.github.io/esvg">esvg</a></li>
<li><a href="http://atria-soft.github.io/egami">egami</a></li>
<li><a href="http://atria-soft.github.io/gale">gale</a></li>
<li><a href="http://atria-soft.github.io/ege">ege</a></li>
<li><a href="http://atria-soft.github.io/elog">elog</a></li>
<li><a href="http://atria-soft.github.io/ememory">ememory</a></li>
<li><a href="http://atria-soft.github.io/enet">enet</a></li>
<li><a href="http://atria-soft.github.io/eproperty">eproperty</a></li>
<li><a href="http://atria-soft.github.io/esignal">esignal</a></li>
<li><a href="http://atria-soft.github.io/zeus">zeus</a></li>
<li><a href="http://atria-soft.github.io/audio-ess">audio-ess</a></li>
<li><a href="http://musicdsp.github.io/audio">audio</a></li>
<li><a href="http://musicdsp.github.io/audio-drain">audio-drain</a></li>
<li><a href="http://musicdsp.github.io/audio-orchestra">audio-orchestra</a></li>
<li><a href="http://musicdsp.github.io/audio-river">audio-river</a></li>
</ul>
</li>
</ul>
<div id="search-box" class="input-group">
<div class="input-group-btn">
<button aria-expanded="false" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-search"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">All</a></li>
<li><a href="#">Classes</a></li>
<li><a href="#">Namespaces</a></li>
<li><a href="#">Files</a></li>
<li><a href="#">Functions</a></li>
<li><a href="#">Variables</a></li>
<li><a href="#">Typedefs</a></li>
<li><a href="#">Enumerations</a></li>
<li><a href="#">Enumerator</a></li>
<li><a href="#">Friends</a></li>
<li><a href="#">Macros</a></li>
<li><a href="#">Pages</a></li>
</ul>
</div>
<button id="search-close" type="button" class="close" aria-label="Close">
<span aria-hidden="true"></span>
</button>
<input id="search-field" class="form-control" accesskey="S" onkeydown="searchBox.OnSearchFieldChange(event);" placeholder="Search ..." type="text">
</div>
</div><!--/.nav-collapse -->
</div>
</nav>
<div id="top"><!-- do not remove this div, it is closed by doxygen! -->
<div class="content" id="content">
<div class="container">
<div class="row">
<div class="col-sm-12 panel panel-default" style="padding-bottom: 15px;">
<div style="margin-bottom: 15px;">
<!-- end header part -->
<!-- Generated by Doxygen 1.8.12 -->
<script type="text/javascript">
var searchBox = new SearchBox("searchBox", "search",false,'Search');
</script>
<script type="text/javascript" src="menudata.js"></script>
<script type="text/javascript" src="menu.js"></script>
<script type="text/javascript">
$(function() {
initMenu('',true,false,'search.php','Search');
$(document).ready(function() { init_search(); });
});
</script>
<div id="main-nav"></div>
<!-- window showing the filter options -->
<div id="MSearchSelectWindow"
onmouseover="return searchBox.OnSearchSelectShow()"
onmouseout="return searchBox.OnSearchSelectHide()"
onkeydown="return searchBox.OnSearchSelectKey(event)">
</div>
<!-- iframe showing the search results (closed by default) -->
<div id="MSearchResultsWindow">
<iframe src="javascript:void(0)" frameborder="0"
name="MSearchResults" id="MSearchResults">
</iframe>
</div>
</div><!-- top -->
<div class="header">
<div class="headertitle">
<div class="title">EWOL: Comple XML GUI </div> </div>
</div><!--header-->
<div class="contents">
<div class="toc"><h3>Table of Contents</h3>
<ul><li class="level1"><a href="#ewol_tutorial_complex_xml_gui_objectif">Objectifs: </a></li>
<li class="level1"><a href="#ewol_tutorial_complex_xml_gui_what">What is a Widget </a></li>
<li class="level1"><a href="#ewol_tutorial_complex_xml_gui_simple">Simple load &amp; configure of a widget: </a></li>
</ul>
</div>
<div class="textblock"><h1><a class="anchor" id="ewol_tutorial_complex_xml_gui_objectif"></a>
Objectifs: </h1>
<ul>
<li>What is a Widget</li>
<li>Simply create a complex Gui</li>
</ul>
<h1><a class="anchor" id="ewol_tutorial_complex_xml_gui_what"></a>
What is a Widget </h1>
<p>A widget is a simple entity of a graphical Object. It herited of every <a class="el" href="classewol_1_1_object.html" title="Basic message classes for ewol system this class mermit at every Object to communicate between them...">ewol::Object</a> class with many graphical interface to draw a complex gui.</p>
<p>We can consider some widget:</p><ul>
<li>ewol::Windows: Main gui interface to display the unique "windows".</li>
<li>Container Widget: Widget that manage some subWidget (generic)</li>
<li>Simple widget: all widget that display somthing.</li>
<li>Meta widget: Widget composed with some wodget.</li>
</ul>
<h1><a class="anchor" id="ewol_tutorial_complex_xml_gui_simple"></a>
Simple load &amp; configure of a widget: </h1>
<p>We have 4 way to create a widget:</p>
<h2>call create and configure </h2>
<p>First create the widget:</p>
<div class="fragment"><div class="line"><a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/ememory.tag:http://atria-soft.github.io/ememory/" href="http://atria-soft.github.io/ememory/classememory_1_1_shared_ptr.html">ewol::widget::ButtonShared</a> tmpWidget = ewol::widget::Button::create();</div><div class="line"><span class="keywordflow">if</span> (tmpWidget == <span class="keyword">nullptr</span>) {</div><div class="line"> APPL_CRITICAL(<span class="stringliteral">&quot;The widget can not be created&quot;</span>);</div><div class="line">}</div></div><!-- fragment --><p>Set some parameters:</p>
<div class="fragment"><div class="line">tmpWidget-&gt;<a class="code" href="classewol_1_1_object.html#a61eacd4d36c9cb0d108c2dbcddbdd4dc">propertyName</a>.<a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/eproperty.tag:http://atria-soft.github.io/eproperty/" href="http://atria-soft.github.io/eproperty/classeproperty_1_1_property_type.html#a29dd42486e15d92b9ea94d30e99854e1">set</a>(<span class="stringliteral">&quot;my name&quot;</span>);</div><div class="line">tmpWidget-&gt;<a class="code" href="classewol_1_1_widget.html#a3bc497e98895d8fcfcc130cd072853f0">propertyExpand</a>.set(<a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/etk.tag:http://atria-soft.github.io/etk/" href="http://atria-soft.github.io/etk/classetk_1_1_vector2_d.html">bvec2</a>(<span class="keyword">true</span>,<span class="keyword">false</span>));</div><div class="line">tmpWidget-&gt;<a class="code" href="classewol_1_1_widget.html#a02ec8d64c8f471f393a00e6b0da14c49">propertyFill</a>.set(<a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/etk.tag:http://atria-soft.github.io/etk/" href="http://atria-soft.github.io/etk/classetk_1_1_vector2_d.html">bvec2</a>(<span class="keyword">true</span>,<span class="keyword">true</span>));</div></div><!-- fragment --><p><b>Note:</b></p>
<div class="fragment"><div class="line">This is the faster way to configure your gui. and the check are done when you compile your code.</div></div><!-- fragment --><h2>Call create and direct configuration </h2>
<p>We can configure the wiget before the <a class="elRef" doxygen="/home/heero/dev/perso/out/doc/release/etk.tag:http://atria-soft.github.io/etk/" href="http://atria-soft.github.io/etk/namespaceetk.html#aa87d94d7a27bd41c9982fe0ba83d6f88">init()</a> is called. </p><div class="fragment"><div class="line"><a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/ememory.tag:http://atria-soft.github.io/ememory/" href="http://atria-soft.github.io/ememory/classememory_1_1_shared_ptr.html">ewol::widget::ButtonShared</a> tmpWidget = ewol::widget::Button::create(</div><div class="line"> <span class="stringliteral">&quot;name&quot;</span>, std::string(<span class="stringliteral">&quot;my name&quot;</span>),</div><div class="line"> <span class="stringliteral">&quot;expand&quot;</span>, <a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/etk.tag:http://atria-soft.github.io/etk/" href="http://atria-soft.github.io/etk/classetk_1_1_vector2_d.html">bvec2</a>(<span class="keyword">true</span>,<span class="keyword">false</span>),</div><div class="line"> <span class="stringliteral">&quot;fill&quot;</span>, <a class="codeRef" doxygen="/home/heero/dev/perso/out/doc/release/etk.tag:http://atria-soft.github.io/etk/" href="http://atria-soft.github.io/etk/classetk_1_1_vector2_d.html">bvec2</a>(<span class="keyword">true</span>,<span class="keyword">true</span>));</div><div class="line"><span class="keywordflow">if</span> (tmpWidget == <span class="keyword">nullptr</span>) {</div><div class="line"> APPL_CRITICAL(<span class="stringliteral">&quot;The widget can not be created&quot;</span>);</div><div class="line">}</div></div><!-- fragment --><p><b>Note:</b></p>
<div class="fragment"><div class="line">The configuration is done and check at the runtime ==&gt; you need to test it to be sure your configuration work.</div></div><!-- fragment --><h2>Call generic factory system (compositing) </h2>
<div class="fragment"><div class="line"><span class="preprocessor">#include &lt;ewol::widget::Composer.hpp&gt;</span></div><div class="line">ewol::widget::WidgetShared tmpWidget = ewol::widget::composerGenerateString(<span class="stringliteral">&quot;&lt;button name=&#39;my name&#39; expand=&#39;true,false&#39; fill=&#39;true,true&#39;/&gt;&quot;</span>);</div><div class="line"><span class="keywordflow">if</span> (tmpWidget == <span class="keyword">nullptr</span>) {</div><div class="line"> APPL_CRITICAL(<span class="stringliteral">&quot;The widget can not be created&quot;</span>);</div><div class="line">}</div></div><!-- fragment --><p>With this way you just like string ...</p>
<h2>Load from a xml file (compositing) </h2>
<p>File <code>gui.xml</code></p>
<div class="fragment"><div class="line">&lt;<span class="keywordtype">button</span> <span class="keyword">name</span>=<span class="stringliteral">&quot;my name&quot;</span></div><div class="line"> <span class="keyword">expand</span>=<span class="stringliteral">&quot;true,false&quot;</span></div><div class="line"> <span class="keyword">fill</span>=<span class="stringliteral">&quot;true,true&quot;</span>/&gt;</div></div><!-- fragment --><div class="fragment"><div class="line"><span class="preprocessor">#include &lt;ewol::widget::Composer.hpp&gt;</span></div><div class="line">ewol::widget::WidgetShared tmpWidget = ewol::widget::composerGenerateFile(<span class="stringliteral">&quot;DATA:gui.xml&quot;</span>);</div><div class="line"><span class="keywordflow">if</span> (tmpWidget == <span class="keyword">nullptr</span>) {</div><div class="line"> APPL_CRITICAL(<span class="stringliteral">&quot;The widget can not be created&quot;</span>);</div><div class="line">}</div></div><!-- fragment --><p>This last way is just to simplify gui generation</p>
<h1><a class="anchor" id="ewol_tutorial_complex_xml_gui_simple"></a>
Simple load &amp; configure of a widget: </h1>
<p>The objective is to create a text label area with 2 button centered.</p>
<p><b>TODO ...</b> </p>
</div></div><!-- contents -->
<!-- HTML footer for doxygen 1.8.8-->
<!-- start footer part -->
</div>
</div>
</div>
</div>
</div>
<hr class="footer"/><address class="footer"><small>
Generated on Mon Oct 24 2016 14:06:03 for Ewol: Ewol Widget in OpenGl by &#160;<a href="http://www.doxygen.org/index.html">
<img class="footer" src="doxygen.png" alt="doxygen"/>
</a> 1.8.12
</small></address>
</body>
</html>