[Native][UI Practice] Update Basic Application Layout.

Update screenshots based on the current naviframe theme.
Add explanation for creating a back button of naviframe automatically.
Correct explanation for naviframe.

Change-Id: I4e5cf117b8e70261620d75f0f0d2899fb2095f54
Signed-off-by: Jaehyun Cho <jae_hyun.cho@samsung.com>

diff --git a/org.tizen.ui.practices/html/images/screenshot_1.png b/org.tizen.ui.practices/html/images/screenshot_1.png
index 02b5a8c..3ea49ba 100644 (file)
Binary files a/org.tizen.ui.practices/html/images/screenshot_1.png and b/org.tizen.ui.practices/html/images/screenshot_1.png differ

diff --git a/org.tizen.ui.practices/html/images/screenshot_2.png b/org.tizen.ui.practices/html/images/screenshot_2.png
index 5bf9807..c53911e 100644 (file)
Binary files a/org.tizen.ui.practices/html/images/screenshot_2.png and b/org.tizen.ui.practices/html/images/screenshot_2.png differ

diff --git a/org.tizen.ui.practices/html/native/efl/form_tutorial_n.htm b/org.tizen.ui.practices/html/native/efl/form_tutorial_n.htm
index 5fafeae..1c3685a 100644 (file)
--- a/org.tizen.ui.practices/html/native/efl/form_tutorial_n.htm
+++ b/org.tizen.ui.practices/html/native/efl/form_tutorial_n.htm
@@ -73,19 +73,21 @@ main(int argc, char **argv)
 
  <h2 id="naviframe" name="naviframe">Creating a Naviframe for Switching Views</h2>
 
-<p>Use a naviframe in this application to switch between different views. The first displayed view is the contact list. When an item is selected in this list, information on the contact is displayed in a contact details form. Both the list and form views are opened in a naviframe, which handles the animations between the views. It also creates a back button in the top bar, and when the button is clicked, launches the back animation, deletes the form view, and shows the contact list again.</p>
+<p>Use a naviframe in this application to switch between different views. The first displayed view is the contact list. When an item is selected in this list, information on the contact is displayed in a contact details form. Both the list and form views are opened in a naviframe, which handles the transition between the views. It also creates a back button on the title area, and when the button is clicked, launches the transition, deletes the form view, and shows the contact list again.</p>
 
        <p class="figure">Figure: Views (list and form)</p> 
     <p align="center"><img alt="Form tutorial: list" src="../../images/screenshot_2.png" /> <img alt="Form tutorial: form" src="../../images/screenshot_1.png" /></p>
 
+<p>To create a back button on the title area automatically, call the elm_naviframe_prev_btn_auto_pushed_set() with EINA_TRUE (second parameter). This function decides whether creating a back button automatically or not in the views pushed later.</p>
 <p>Since the naviframe is the main layout of the window, it takes all the available space. To configure the naviframe size, use the <span style="font-family: Courier New,Courier,monospace">elm_win_resize_object_add()</span> function to add the naviframe object (second parameter) to the main window (first parameter). To ensure that the naviframe covers the entire window area, call the <span style="font-family: Courier New,Courier,monospace">evas_object_resize_hint_weight_set()</span> function on the naviframe object to force the naviframe to fill its parent (the main window). The naviframe object expands in both X and Y directions.</p>
 <p>In the end, show the naviframe object on the screen.</p>
 <pre class="prettyprint">
 // Create the naviframe
-nav = elm_naviframe_add(win);
-evas_object_size_hint_weight_set(nav, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
-elm_win_resize_object_add(win, nav);
-evas_object_show(nav);
+naviframe = elm_naviframe_add(win);
+elm_naviframe_prev_btn_auto_pushed_set(naviframe, EINA_TRUE);
+evas_object_size_hint_weight_set(naviframe, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
+elm_win_resize_object_add(win, naviframe);
+evas_object_show(naviframe);
 </pre> 
 
  <h2 id="list" name="list">Creating a Contact List</h2>
@@ -169,7 +171,7 @@ for (i = 0; i &lt; EINA_C_ARRAY_LENGTH(contacts); i++)
 list = _create_contact_list(win);
 
 // Push the list on top of the naviframe
-elm_naviframe_item_push(nav, NULL, NULL, NULL, list, NULL);
+elm_naviframe_item_push(naviframe, "Contact List", NULL, NULL, list, NULL);
 </pre>
 </li>
 <li>