<div id="container"><div id="contents"><div class="content">\r
<h1>Animations: 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
+<p>Animation allows your objects to move around / change their properties for a specified duration.</p>\r
\r
-<p>DALi provides a rich and easy to use animation framework which allows you to create visually rich applications. The Dali::Animation API can be used to animate the properties of any number of objects, typically Actors. Animation components are shown in a following figure.</p>\r
+<p>DALi provides a rich and easy to use animation framework which allows you to create visually rich applications. <span style="font-family: Courier New,Courier,monospace;">Dali::Animation</span> can be used to animate the animatable properties of any number of objects.</p>\r
+\r
+<p>Animation components are shown in the following figure:</p>\r
\r
<p class="figure">Figure: DALi animation components</p> \r
<p align="center"><img alt="DALi animation components" src="../../images/animation_components.png"/></p> \r
\r
-<p>DALi animations occur in a dedicated thread. This allows animations to run smoothly, regardless of the time taken to process inputs events and other factors in the application code.</p>\r
+<p>DALi animations occur in a dedicated thread. This allows animations to run smoothly, regardless of the time taken to process inputs events and other factors in the application code. Please see <a href="multi_threaded_n.htm#animations">Animations with Multi-Threading</a></p>\r
\r
<h2 id="basic" name="basic">Creating a Basic Animation</h2>\r
\r
</pre> \r
\r
<h2 id="notifications" name="notifications">Notifications</h2>\r
-<p>Using DALi's signal framework applications can be notified when the animation finishes. The Dali::Animation API supports "fire and forget" behavior, which means that an animation continues to play if the handle is discarded. Note that in the following example, the "Finish" signal is emitted.</p>\r
-<pre class="prettyprint">\r
-void ExampleCallback(Animation& source)\r
-{\r
- std::cout << "Animation has finished" << std::endl;\r
-}\r
+<p>Using DALi's signal framework applications can be notified when the animation finishes. The Dali::Animation API supports "fire and forget" behavior, which means that an animation continues to play if the handle is discarded. In the following example, the Finished signal is emitted after 2 seconds:</p>\r
\r
-void ExampleAnimation(Actor actor)\r
-{\r
- Animation animation = Animation::New(2.0f); // Duration 2 seconds\r
- animation.AnimateTo(Property(actor, Actor::Property::POSITION), 10.0f, 50.0f, 0.0f);\r
- animation.FinishedSignal().Connect(ExampleCallback);\r
- animation.Play();\r
-} // At this point the animation handle has gone out of scope\r
-\r
-Actor actor = Actor::New();\r
-Stage::GetCurrent().Add(actor);\r
-\r
-// Fire the animation and forget about it\r
-ExampleAnimation(actor);\r
-\r
-// The animation continues, and "Animation has finished" is printed after 2 seconds\r
+<pre class="prettyprint">\r
+ // ... Assuming this code is in the HelloWorldController class\r
+ void Create( Application& application )\r
+ {\r
+ PushButton actor = PushButton::New();\r
+ Stage::GetCurrent().Add( actor );\r
+\r
+ Animation animation = Animation::New(2.0f); // Duration 2 seconds\r
+ animation.AnimateTo( Property( actor, Actor::Property::POSITION ), Vector3( 100.0f, 100.0f, 0.0f ) );\r
+ animation.FinishedSignal().Connect( this, &HelloWorldController::OnFinished );\r
+ animation.Play(); // Fire the animation and forget about it\r
+ } // At this point the animation handle has gone out of scope\r
+\r
+ void OnFinished( Animation& animation )\r
+ {\r
+ // Do something when the animation is finished\r
+ }\r
+ // ...\r
</pre>\r
\r
<h2 id="alpha" name="alpha">Alpha Functions</h2>\r
AlphaFunction alphaFunction(&MyAlphaFunction);\r
animation.SetDefaultAlphaFunction(alphaFunction);\r
</pre>\r
-<p>It is possible to specify a different alpha function for each animator in an Animation object.</p>\r
+<p>It is possible to specify a different alpha function for each animate call in an Animation object.</p>\r
<pre class="prettyprint">\r
animation.AnimateTo(Property(actor1, Dali::Actor::Property::POSITION), Vector3(10.0f, 50.0f, 0.0f), Dali::AlphaFunction::EASE_IN);\r
</pre>\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>Types of Animations: Various Animations Supported by DALi</title> \r
+ <title>Animations Types: Types of Animations Supported by DALi</title> \r
</head>\r
\r
<body onload="prettyPrint()" style="overflow: auto;">\r
<div id="toc_border"><div id="toc">\r
<p class="toc-title">Content</p>\r
<ul class="toc">\r
- <li><a href="#frame">Frame Animation</a></li>\r
+ <li><a href="#frame">Key Frame Animation</a></li>\r
<li><a href="#path">Path Animation</a></li>\r
<li><a href="#shader">Shader Effect Animation</a></li>\r
</ul>\r
</div>\r
\r
<div id="container"><div id="contents"><div class="content">\r
-<h1>Types of Animations: Various Animations Supported by DALi</h1>\r
+<h1>Animations Types: Types of Animations Supported by DALi</h1>\r
\r
-<h2 id="frame" name="frame">Frame Animation</h2>\r
+<p>DALi supports the key frame animation, path animation, and shader effect animation.</p>\r
+\r
+<h2 id="frame" name="frame">Key Frame Animation</h2>\r
\r
<p>DALi provides support for animating between several different values, or key frames. A key frame takes a progress value between 0.0f and 1.0f (0 and 100% respectively) and portrays the value of the property when the animation has progressed that much. You can create several key frames:</p>\r
<pre class="prettyprint">\r