[DALi] Update contents
authorYoonsang Lee <ysang114.lee@samsung.com>
Thu, 15 Oct 2015 09:57:01 +0000 (18:57 +0900)
committerYoonsang Lee <ysang114.lee@samsung.com>
Mon, 19 Oct 2015 10:45:52 +0000 (19:45 +0900)
- Remove nine patch image contents
- Remove load / release policy contents
- Remove blending example of control's background color and image
- Update small changes

Signed-off-by: Yoonsang Lee <ysang114.lee@samsung.com>
Change-Id: I5d57c666b115a756a263de525bbb9c6c79c50d59

org.tizen.ui.practices/html/native/dali/animation_types_n.htm
org.tizen.ui.practices/html/native/dali/control_base_n.htm
org.tizen.ui.practices/html/native/dali/event_handling_n.htm
org.tizen.ui.practices/html/native/dali/multi_threaded_n.htm
org.tizen.ui.practices/html/native/dali/rendering_effects_n.htm
org.tizen.ui.practices/html/native/dali/resources_n.htm

index eb1c426..702c4f5 100644 (file)
@@ -90,7 +90,7 @@ animation.Animate(actor1, path, Vector3::ZERO);
 
 
 <h2 id="shader" name="shader">Shader Effect Animation</h2>
-<p>Shader effects provide a visual effect for actors. In a shader, uniforms are set according to the purpose of applications. The uniforms of a shader can be animated using the <span style="font-family: Courier New,Courier,monospace;">Animation::AnimateTo()</span> functions.</p>
+<p>Shader effects provide a visual effect for actors. In a shader, uniforms are set according to the purpose of applications. The uniforms of a shader can be animated using the Animate functions such as <span style="font-family: Courier New,Courier,monospace;">Animation::AnimateTo()</span>.</p>
 <p>For example, to animate the center point of the Bendy shader effect:</p>
 <pre class="prettyprint">
 Dali::Animation animation = Dali::Animation::New(1.0f);
index e686ca6..ab3443f 100644 (file)
@@ -77,15 +77,6 @@ control.SetBackgroundImage(image);
 <p class="figure">Figure: Control object with a background image</p>  
        <p align="center"><img alt="Control object with a background image" src="../../images/background_image.png"/></p> 
 
-<p>The background image is blended with the background color. The following example shows what happens if a red background color is set on the control with a background image:</p>
-  
-<pre class="prettyprint">
-control.SetBackgroundColor(Dali::Color::RED);
-</pre>
-
-<p class="figure">Figure: Control object with a background image blended with a background color</p>  
-       <p align="center"><img alt="Control object with a background image blended with a background color" src="../../images/background_image_color.png"/></p> 
-    
 
 <script type="text/javascript" src="../../scripts/jquery.zclip.min.js"></script>
 <script type="text/javascript" src="../../scripts/showhide.js"></script>
index 23350cc..41fb45a 100644 (file)
@@ -316,10 +316,10 @@ OnKeyEvent(const KeyEvent&amp; event)
 <ul>
 <li><strong>Touched signal</strong> notifies you of a screen touch or mouse click</li>
 <li><strong>Hovered signal</strong> notifies you of mouse hovering</li>
-<li><strong>Wheel event signal</strong> notifies you of mouse wheel rolling</li>
+<li><strong>Wheel event signal</strong> notifies you of wheel rolling (ex. mouse wheel)</li>
 <li><strong>Key event signal</strong> notifies you of a keyboard input</li>
-<li><strong>Key input focus signals</strong> notifies you that a control is ready to receive key event signals</li>
-<li><strong>Keyboard focus signals</strong> notifies you of a moved focus by navigation keys (such as left or right)</li>
+<li><strong>Key input focus signals</strong> notify you that a control is ready to receive key event signals</li>
+<li><strong>Keyboard focus signals</strong> notify you of a moved focus by navigation keys (such as left or right)</li>
 </ul>
 <p>These signals are provided by the following classes:</p>
 
index fcbdd7f..f056990 100644 (file)
 
           <h2 id="animations" name="animations">Animations with Multi-threading</h2>
 
-<p>DALi animations and rendering occur in a dedicated rendering thread. This allows animations to run smoothly, regardless of the time taken to process input events in the application code.</p>
+<p>DALi animations and rendering occur in a dedicated render thread. This allows animations to run smoothly, regardless of the time taken to process input events in the application code.</p>
 
 <p>Internally, DALi contains the scene graph that mirrors the actor hierarchy. The scene graph objects perform the actual animation and rendering, while the actors provide thread-safe access. Actors and scene graph objects communicate through messaging.</p>
 
-<p>The following figure shows an actor hierarchy, in which one of the actors is being animated. The green objects in are created by the application code, while the blue private objects are used in the dedicated rendering thread.</p>
+<p>The following figure shows an actor hierarchy, in which one of the actors is being animated. The green objects in are created by the application code, while the blue private objects are used in the dedicated render thread.</p>
 
 <p class="figure">Figure: Actor hierarchy with an animation</p> 
        <p align="center"><img alt="Actor hierarchy with an animation" src="../../images/multi_threading2.png"/></p> 
  
 <h3 id="read" name="read">Reading an Animated Value</h3>
 
-<p>When a property is animatable, it can only be modified in the rendering thread. The value returned from a getter function is the value used when the previous frame was rendered.</p>
+<p>When a property is animatable, it can only be modified in the render thread. The value returned from a getter function is the value used when the previous frame was rendered.</p>
 
 <p>For example, the <span style="font-family: Courier New,Courier,monospace;">GetCurrentPosition()</span> function returns the position in which the actor was last rendered. Since the <span style="font-family: Courier New,Courier,monospace;">SetPosition()</span> function is asynchronous, a call to <span style="font-family: Courier New,Courier,monospace;">GetCurrentPosition()</span> function does not immediately return the same value.</p>
 
@@ -99,7 +99,7 @@ Actor actor = Actor::New();
 <p class="figure">Figure: Actor hierarchy with an animated property</p>  
        <p align="center"><img alt="Actor hierarchy with an animated property" src="../../images/multi_threading.png"/></p> 
  
-<p>The order of execution in the rendering thread is:</p>
+<p>The order of execution in the render thread is:</p>
 <ol>
 <li>Process the message and call the <span style="font-family: Courier New,Courier,monospace;">SetPosition()</span> function.</li>
 <li>Apply the animation and call the <span style="font-family: Courier New,Courier,monospace;">SetPosition()</span> function.</li>
index 8cb4197..01c7666 100644 (file)
 </ul>
 
 <h3 id="custom" name="custom">Custom Shader Effects</h3>
-<p>The <span style="font-family: Courier New,Courier,monospace;">ShaderEffect</span> enables you to create custom shader effects by specifying the vertex and pixel shaders. For a custom shader, you can provide the vertex and fragment shader code as strings. These shader snippets get concatenated with the default attributes and uniforms.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace;">ShaderEffect</span> enables you to create custom shader effects by specifying the vertex and fragment shaders. For a custom shader, you can provide the vertex and fragment shader code as strings. These shader snippets get concatenated with the default attributes and uniforms.</p>
 
 <p>Create a custom shader effect:</p>
 
index 7256670..6381489 100644 (file)
@@ -121,17 +121,6 @@ class ResourceImageController : public ConnectionTracker
 <p>For more information about the resource threads, see <a href="multi_threaded_n.htm#resource">Resource Loading with Multi-threading</a>.</p>
 
 
-<h3>Load and Release Policies</h3>
-
-
-<p>By default, resource images start loading immediately and the data is released only when the <span style="font-family: Courier New,Courier,monospace;">ResourceImage</span> handle is destroyed. To optimize its memory footprint, the application can ask resources to be loaded only when actually required and their data to be released automatically when they are no longer being used by actors:</p>
-
-<pre class="prettyprint">Dali::ResourceImage image = Dali::ResourceImage::New(&quot;/my-path/my-image.png&quot;, 
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dali::ResourceImage::ON_DEMAND, 
-&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dali::Image::UNUSED);</pre>
-
-<p>If the <span style="font-family: Courier New,Courier,monospace;">Dali::Image::UNUSED</span> property is used, the resource data is reloaded automatically when the image is used again.</p>
-
 <h3>Load Time Resizing</h3>
 
 <p>An application loading images from an external source often wants to display those images at a lower resolution than their native ones. To support this, DALi can resize an image at load time so that its in-memory copy uses less space and its visual quality benefits from being prefiltered. The <span style="font-family: Courier New,Courier,monospace;">Dali::FittingMode</span> namespace (in <a href="../../../../org.tizen.native.mobile.apireference/namespaceDali_1_1FittingMode.html">mobile</a> and <a href="../../../../org.tizen.native.wearable.apireference/namespaceDali_1_1FittingMode.html">wearable</a> applications) provides 4 algorithms, which can be used to fit an image to a desired rectangle, a desired width, or a desired height.</p>
@@ -184,40 +173,6 @@ Dali::Image image = Dali::ResourceImage::New(filename, ImageDimensions(240, 240)
 <p>This is a disk-read operation, which can be slow and block the event thread. This operation is currently not supported for remote resources, such as HTTP or HTTPS URLs.</p>
 
 
-<h2 id="patch" name="patch">Using Nine-Patch Images</h2>
-
-
-<p>DALi supports nine-patch images, which can be stretched while maintaining their corners.</p>
-
-<h3>Nine-Patch Image Format</h3>
-
-<p>A nine-patch image has 9 sections. In the following figure (on the right), the sections 2, 4, 5, 6, 8 are stretched and the sections 1, 3, 7, 9 keep their size unchanged when the size of the image is changed:</p>
-
-<p class="figure">Figure: A nine-patch image explained</p>  
-       <p align="center"><img alt="A nine-patch image" src="../../images/nine_patch_dali.9.png"/> <img alt="A nine-patch image" src="../../images/nine_patch_explained.png"/></p>
-
-<p>The black lines top and left side of the image determine the stretchable region.</p>
-          
-<p>This format is compatible with the one used in Android. Therefore, you can easily make nine-patch images using existing tools, such as <a href="https://romannurik.github.io/AndroidAssetStudio/nine-patches.html" target="_blank">Simple Nine-patch Generator</a>.</p>
-
-
-
-<h3>Nine-Patch Image Loading</h3>
-
-<p>A nine-patch image can be loaded by the <span style="font-family: Courier New,Courier,monospace;">ResourceImage</span> class just like other images. If an image file has a <span style="font-family: Courier New,Courier,monospace;">.9.png</span> or <span style="font-family: Courier New,Courier,monospace;">.9.jpg</span> extension and proper nine-patch image contents as mentioned earlier, the image loaded by the <span style="font-family: Courier New,Courier,monospace;">ResourceImage</span> class is rendered in the nine-patch way with the <span style="font-family: Courier New,Courier,monospace;">ImageView</span> class.</p>
-
-<p>The following is an example of using a <span style="font-family: Courier New,Courier,monospace;">*.9.png</span> image:</p>
-
-<pre class="prettyprint">
-ResourceImage image = ResourceImage::New(&quot;nine_patch_dali.9.png&quot;);
-ImageActor imageView = ImageActor::New(image);
-imageView.SetSize(200, 200);
-</pre>
-
-<p>The following figure shows the result:</p>
-<p class="figure">Figure: 200 x 200 image</p>
-       <p align="center"><img alt="200 x 200 image" src="../../images/nine_patch_expanded.png"/></p>
-
           
 <h2 id="buffer" name="buffer">Using a Buffer Image</h2>