<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>Advanced Animations</title> \r
+ <title>Types of Animations: Various Animations Realizable with DALi</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Advanced Animations</h1>\r
+<h1>Types of Animations: Various Animations Realizable with DALi</h1>\r
\r
<h2 id="frame" name="frame">Frame Animation</h2>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>Animation: Creating Transformations</title> \r
+ <title>Animation: Making Your Actors Alive</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Animation: Creating Transformations</h1>\r
+<h1>Animation: Making Your Actors Alive</h1>\r
\r
<p>Animation is an effect that shows sequential frames in quick succession to give the illusion of movement.</p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>Buttons</title> \r
+ <title>Buttons: Push, Check, Select!</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div> \r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Buttons</h1>\r
+<h1>Buttons: Push, Check, Select!</h1>\r
\r
<p>Button is a small object on UI that you press in order to operate it. Dali provides button controls, such as <span style="font-family: Courier New,Courier,monospace;">PushButton</span> , <span style="font-family: Courier New,Courier,monospace;">CheckBoxButton</span> , and <span style="font-family: Courier New,Courier,monospace;">RadioButton</span> . The base class for button controls is <span style="font-family: Courier New,Courier,monospace;">Toolkit::Button</span>. The <span style="font-family: Courier New,Courier,monospace;">Toolkit::Button</span> class provides the <span style="font-family: Courier New,Courier,monospace;">disabled</span> property and the <span style="font-family: Courier New,Courier,monospace;">clicked</span> signal. Basic signals provided by the <span style="font-family: Courier New,Courier,monospace;">Toolkit::Button</span> class are listed in the following table.</p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>Constraints</title> \r
+ <title>Constraints: Imposing Your Own Constraints on Actors</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Constraints</h1>\r
+<h1>Constraints: Imposing Your Own Constraints on Actors</h1>\r
\r
<p>Constraints are used to modify the property of an actor, based on other properties of the same actor; properties of the actor's parent; or properties of another actor altogether, when the modification needs to be at run-time. Custom functions or functors can be supplied, where the desired value of the property can be calculated. These functions (or functors) are called in every frame, therefore they must be fast and not too complex, otherwise they can affect performance.</p>\r
<p>Multiple constraints can be applied to the same actor at the same time. The order in which constraints are applied is important as this is the order in which they are processed in the update thread.</p>\r
<p>Enables you to handle DALi events.</p></li>
<li><a href="ui_components_n.htm">UI Components: Creating the Application Layout</a>
<p>Enables you to handle DALi UI components.</p></li>
- <li><a href="animation_n.htm">Animation: Creating Transformations</a>
+ <ul>
+ <li><a href="buttons_n.htm">Buttons: Push, Check, Select!</a></li>
+ <li><a href="itemview_n.htm">ItemView: Item Container with Layouts</a></li>
+ <li><a href="scrollview_n.htm">ScrollView: Scrollable Container for Items</a></li>
+ <li><a href="tableview_n.htm">TableView: Container with Grid-like Layout</a></li>
+ <li><a href="textfield_n.htm">TextField: Typing Your Text</a></li>
+ <li><a href="textlabel_n.htm">TextLabel: Displaying Text Labels</a></li>
+ </ul>
+ <li><a href="animation_n.htm">Animation: Making Your Actors Alive</a>
<p>Enables you to create animated effects.</p></li>
+ <ul>
+ <li><a href="advanced_animation_n.htm">Types of Animations: Various Animations Realizable with DALi</a></li>
+ <li><a href="constraints_n.htm">Constraints: Imposing Your Own Constraints on Actors</a></li>
+ <li><a href="multi_threading_n.htm">Multi-Threading Notes: The Secret of High-Performance Animation in DALi</a></li>
+ </ul>
<li><a href="resources_n.htm">Resources: Handling Images</a>
<p>Enables you to manage resource images.</p></li>
<li><a href="rendering_effects_n.htm">Rendering and Effects: Managing Viewing Modes and Shader Effects</a>
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>ItemView</title> \r
+ <title>ItemView: Item Container with Layouts</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>ItemView</h1>\r
+<h1>ItemView: Item Container with Layouts</h1>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">ItemView</span> class provides scrollable layout for item sets. The <span style="font-family: Courier New,Courier,monospace;">ItemView</span> is a scrollable container that can contain many items. It can have several layouts. There are also built-in layouts that you can use, as illustrated in the following figure.</p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>Multi-threading</title> \r
+ <title>Multi-Threading Notes: The Secret of High-Performance Animation in DALi</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div> \r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Multi-threading</h1>\r
+<h1>Multi-Threading Notes: The Secret of High-Performance Animation in DALi</h1>\r
\r
<h2 id="hierachy" name="hierachy">Multi-threaded Architecture</h2>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>ScrollView</title> \r
+ <title>ScrollView: Scrollable Container for Items</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>ScrollView</h1>\r
+<h1>ScrollView: Scrollable Container for Items</h1>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">ScrollView</span> class provides scrollable view. The <span style="font-family: Courier New,Courier,monospace;">ScrollView</span> contains actors that can be scrolled manually through touch or automatically. </p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>TableView</title> \r
+ <title>TableView: Container with Grid-like Layout</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>TableView</h1>\r
+<h1>TableView: Container with Grid-like Layout</h1>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">TableView</span> class is a layout container for aligning child actors in a grid like layout. <span style="font-family: Courier New,Courier,monospace;">TableView</span> constraints the x and y position and width and height of the child actors.</p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>TextField </title> \r
+ <title>TextField: Type Your Text!</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>TextField </h1>\r
+<h1>TextField: Type Your Text!</h1>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">TextField</span> class is a control providing a single-line editable text field.</p>\r
\r
<script type="text/javascript" src="../../scripts/core.js" charset="utf-8"></script>\r
<script type="text/javascript" src="../../scripts/search.js" charset="utf-8"></script>\r
\r
- <title>TextLabel</title> \r
+ <title>TextLabel: Displaying Text Labels</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>TextLabel</h1>\r
+<h1>TextLabel: Displaying Text Labels</h1>\r
\r
<p>The <span style="font-family: Courier New,Courier,monospace;">TextLabel</span> class provides a control that renders a short text string. The text labels are lightweight, non-editable, and do not respond to user input.</p>\r
\r