<body class="no-toc" onload="prettyPrint()" style="overflow: auto;">
-<div id="navigation">
+<div id="toc-navigation">
</div>
<div id="container"><div id="contents"><div class="content">
<div id="profile">
- <p><img alt="Mobile native" src="../images/mn_icon.png"/></p>
+ <p><img alt="Mobile native" src="../images/mn_icon.png"/> <img alt="Wearable native" src="../images/wn_icon.png"/></p>
</div>
<p>The <strong>Navigation</strong> view displays thumbnail images of all the views in the currently selected project. If the <strong>Navigation</strong> view is not visible, open it from <strong>Window > Show View > Other > Tizen > Navigation</strong>.</p>
<p class="figure">Figure: Navigation view</p>
-<p style="text-align:center;"><img alt="Navigation view" src="../images/navigation_001.png" /></p>
-
-<p>In the <strong>Navigation</strong> view, you can:</p>
-
-<ul class="ul"><li>Change the current view on the designer by clicking on the thumbnail.</li>
-<li>Re-order views by dragging them to the selected position.</li>
-<li>Create and delete view templates and views using the context menu:
-<ul class="ul">
- <li>To add an empty view, right-click the view and select <strong>Add Empty View</strong>.</li>
-
-<li>To add a new view through a view template:
-
-<p style="text-align:center;"><img alt="Adding a view" src="../images/navigation_002.png" /></p>
-
-<ol>
- <li>Right-click the view and select <strong>New</strong>.</li>
- <li>Select a category.</li>
- <li>Select a view template.</li>
- <li>Insert a page ID.</li>
- <li>Click <strong>Finish</strong>.</li>
-</ol>
-</li>
-
- <li>To delete a selected view:
- <ol>
- <li>Right-click the view and select <strong>Delete</strong>.</li>
- </ol>
- </li>
-
- <li>To create a new view template:
-<p style="text-align:center;"><img alt="Creating a template" src="../images/navigation_003.png" /></p>
- <ol>
- <li>Right-click the view and select <strong>Create Template</strong>.</li>
- <li>Input a category.</li>
- <li>Insert a view template name.</li>
- <li>Click <strong>Finish</strong>.</li>
- </ol>
- </li>
-
- <li>To set the startup view:
- <ol>
- <li>Right-click the view and select <strong>Set Startup View</strong>.</li>
- </ol>
- </li>
-</ul></li></ul>
-
-
+<p style="text-align:center;"><img src="../images/nuib_navigation_001.png" /></p>
+
+<p>The <strong>Navigation</strong> view provides the following features:</p>
+
+<ul>
+<li>View navigation</li>
+ <ul>
+ <li>You can see the thumbnails of the views.</li>
+ <li>You can select a view to edit on WYSIWYG Editor.</li>
+ </ul>
+<li>View management</li>
+ <ul>
+ <li>You can create / delete the views.</li>
+ <ul>
+ <li>context menu > New </li>
+ <p class="figure">Figure: New View Wizard</p>
+ <p style="text-align:center;"><img src="../images/nuib_new_view_wizard.png" /></p>
+ <li>context menu > Add Empty View (Ctrl + a) </li>
+ <li>context menu > Delete (Delete) </li>
+ <ul>
+ <li>Startup View & Editing View can not be deleted</li>
+ </ul>
+ </ul>
+ <li>You can copy / cut / paste / move the views.</li>
+ <li>You can select startup view.</li>
+ </ul>
+<li>View template</li>
+ <ul>
+ <li>You can create / delete the view templates.</li>
+ <ul>
+ <li>context menu > Create View Template </li>
+ <p class="figure">Figure: New View Template Wizard</p>
+ <p style="text-align:center;"><img src="../images/nuib_new_view_template_wizard.png" /></p>
+ </ul>
+ <li>You can use the view templates to create new view.</li>
+ </ul>
+</ul>
<h3 id="outline" name="outline">Outline View</h3>
-<p>The <strong>Outline</strong> view displays the hierarchical structure of the page currently open in the <strong>Page Designer</strong> view. If the <strong>Outline</strong> view is not visible, open it from <strong>Window > Show View > Other > General > Outline</strong>.</p>
+<p>The <strong>Outline</strong> view displays the hierarchical structure of the view currently open in the <strong>WYSIWYG Editor</strong>. If the <strong>Outline</strong> view is not visible, open it from <strong>Window > Show View > Other > General > Outline</strong>.</p>
<p class="figure">Figure: Outline view</p>
-<p style="text-align:center;"><img alt="Outline view" src="../images/native_app_outline_001.png" /></p>
-
-<p>In the <strong>Outline</strong> view, you can manage widgets:</p>
-<ul class="ul">
-<li>Change the current view on the designer by selecting the view on the view combobox.</li>
-<li>Move a widget by dragging it to a new position.</li>
-<li>Change the widget ID in the context menu or by pressing the <strong>F2</strong> key. (The view ID cannot be changed.)</li>
-<li>Manage selected widgets by cutting, copying, pasting, and deleting them.</li>
+<p style="text-align:center;"><img alt="Outline view" src="../images/nuib_outline_001.png" /></p>
+
+<p>The <strong>Outline</strong> view provides the following features:</p>
+<ul>
+<li>Widget navigation</li>
+<ul>
+ <li>You can see widget hierarchy.</li>
+</ul>
+
+<li>Widget management</li>
+<ul>
+ <li>You can copy / cut / paste / delete / rename the widgets.</li>
+</ul>
</ul>
<h3 id="properties" name="properties">Properties View</h3>
<p style="text-align:center;"><img alt="Properties view" src="../images/properties_1.png" width="420" height="349" /></p>
<p>The <strong>Properties </strong>view consists of <strong>Attributes</strong>, and <strong>Event</strong> tabs:</p>
-<ul class="ul">
+<ul>
<li><strong>Attributes</strong>
<p>In the <strong>Attributes</strong> tab, you can edit widget attributes. Attributes are categorized into common (common widget properties) and widget specification (widget-specific properties) attributes. The widget specification attributes are divided into categories according to the widget attributes.</p>
-<ul class="ul">
+<ul>
<li><strong>Common</strong>
<p>The <strong>Common</strong> category only includes the ID attribute, which is the default widget identifier in the code.</p>
</li>
<p>The <strong>Resources</strong> view displays the resources in the selected project. If the <strong>Resources</strong> view is not visible, open it from <strong>Window > Show View > Other > Tizen > Resources</strong>.</p>
<p class="figure">Figure: Resources view</p>
-<p style="text-align:center;"><img alt="Resources view" src="../images/resources.png" width="291" height="424" /></p>
+<p style="text-align:center;"><img alt="Resources view" src="../images/nuib_resources.png" width="291" height="424" /></p>
<p>The <strong>Resources</strong> view provides the following features:</p>
-<ul class="ul">
-<li>Resource management
-<p>You can copy, paste, delete, and rename resources.</p>
-</li>
+<ul>
<li>Resource navigation
<p>You can move files to child and parent folders.</p>
</li>
+<li>Resource management
+<p>You can copy, paste, delete, and rename resources.</p>
+</li>
<li>Resource filter
<p>You can filter the view to show resources of a particular name or extension.</p>
</li>
<p class="figure">Figure: WYSIWYG Editor</p>
<p style="text-align:center;"><img alt="WYSIWYG Editor" src="../images/nuib_we_editor.png" /></p>
<p>The <strong>WYSIWYG Editor</strong> view consists of the following parts:</p>
-<ul class="ul">
+<ul>
<li>
<p>Palette</p>
<p>The palette contains EFL widgets, which you can select and add to the design area.</p>
+<ul>
+<li>Supported widgets for mobile</li>
+<p>Scroller, Grid, Table, Box, Panes, Panel, Button, Check, Radio, Colorselector, Entry, Spinner, Slider, Naviframe, List, Genlist, Toolbar, Multibuttonentry, Gengrid, Index, Background, Datetime, Icon, Image, Label, Progressbar, Layout</p>
+<li>Supported widgets for wearable</li>
+<p>Scroller, Grid, Table, Box, Panel, Button, Check, Radio, Entry, Spinner, Slider, Naviframe, List, Genlist, Index, Background, Datetime, Icon, Image, Label, Progressbar, Layout</p>
+</ul>
</li>
<li>
<p>Toolbar</p>
<p>The toolbar supports the following functions:</p>
-<ul class="ul">
+<ul>
<li>Select the view you want to edit using the view combo.
<table>
<tbody>
</body>
-</html>
\ No newline at end of file
+</html>