<ul>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Button.htm">Button</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Checkbox.htm">Checkbox</a></li>
+ <li><a href="ui_fw_api/Mobile_UIComponents/mobile_ColoredListview.htm">ColoredListView</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Drawer.htm">Drawer</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_DropdownMenu.htm">DropdownMenu</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Expandable.htm">Expandable</a></li>
+ <li><a href="ui_fw_api/Mobile_UIComponents/mobile_FloatingActions.htm">FloatingActions</a></li>
+ <li><a href="ui_fw_api/Mobile_UIComponents/mobile_GridView.htm">GridView</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_IndexScrollBar.htm">IndexScrollBar</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Listview.htm">Listview</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_NavigationBar.htm">NavigationBar</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_PageIndicator.htm">PageIndicator</a></li>
+ <li><a href="ui_fw_api/Mobile_UIComponents/mobile_PanelChanger.htm">PanelChanger</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Popup.htm">Popup</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Progress.htm">Progress</a></li>
<li><a href="ui_fw_api/Mobile_UIComponents/mobile_Radio.htm">Radio</a></li>
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
+<html>
+<head>
+ <script type="text/javascript" src="../snippet.js"></script>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
+ <link href="../styles.css" rel="StyleSheet" type="text/css">
+ <link href="../snippet.css" rel="StyleSheet" type="text/css">
+ <title>Colored List View</title>
+</head>
+<body onload="prettyPrint()" id="content">
+<h1>Colored List View</h1>
+
+<p>Colored list view provides the list has gradient background color.</p>
+<p>You should check if your brower support WebGL since colored list view uses the WebGL technology.</p>
+
+<h2>Table of Contents</h2>
+<ol class="toc">
+
+ <li><a href="#default-selector">Default selectors</a></li>
+
+ <li><a href="#manual-constructor">Manual constructor</a>
+ </li>
+
+ <li><a href="#options-list">Options</a>
+ </li>
+</ol>
+
+<h2><a id='default-selector'></a>Default selector</h2>
+
+<p>By default, all <ul> and <ol> elements with the <code>class="ui-colored-list"</code> or <code>data-role="coloredlistview"</code> attribute are displayed as colored list view components.</p>
+
+<h2><a id="manual-constructor"></a>Manual Constructor</h2>
+<p>To manually create a colored list view component, use the component constructor from the <code>tau</code> namespace:</p>
+<p>The constructor requires an <code>HTMLElement</code> parameter to create the component, and you can get it with the <code>document.getElementById()</code> method. The constructor can also take a second parameter, which is an object defining the configuration options for the component.</p>
+<pre class="prettyprint">
+<ul class="ui-colored-list" id="coloredlist">
+ <li class="ui-li-static">Item</li>
+ <li class="ui-li-static">Item</li>
+ <li class="ui-li-static">Item</li>
+</ul>
+<script>
+ var elColoredList = document.getElementById("coloredlist"),
+ coloredList = tau.widget.ColoredListview(elColoredList);
+</script>
+</pre>
+
+<h2><a id="options-list"></a>Options</h2>
+
+<table>
+ <tbody>
+ <tr>
+ <th>Option</th>
+ <th>Input type</th>
+ <th>Default value</th>
+ <th>Description</th>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-colored-listview-number</span></td>
+ <td class="option">number</td>
+ <td class="option">15</td>
+ <td class="option">the number of list items to be applied colored list view</td>
+ </tr>
+
+ </tbody>
+</table>
+
+<h2>Where to Go Next</h2>
+<ul>
+ <li><a href="./widget_reference.htm">Widget Reference</a></li>
+
+</ul>
+<div id="footer">
+ <hr size="1">
+ <font size="1">Except as noted, this content - excluding the Code Examples - is licensed under <a
+ href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution
+ 3.0</a> and all of the Code Examples contained herein are licensed under <a
+ href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br>For details, see the
+ <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</font>
+</div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
+<html>
+<head>
+ <script type="text/javascript" src="../snippet.js"></script>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
+ <link href="../styles.css" rel="StyleSheet" type="text/css">
+ <link href="../snippet.css" rel="StyleSheet" type="text/css">
+ <title>Floating Actions</title>
+</head>
+<body onload="prettyPrint()" id="content">
+<h1>Floating Actions</h1>
+
+<p>Floating actions component creates a floating button at the bottom of the screen.</p>
+<p>You can move the floating button from left end to right end.</p>
+
+<h2>Table of Contents</h2>
+<ol class="toc">
+
+ <li><a href="#default-selector">Default selectors</a></li>
+
+ <li><a href="#manual-constructor">Manual constructor</a>
+ </li>
+
+ <li><a href="#options-list">Options</a>
+ </li>
+</ol>
+
+<h2><a id='default-selector'></a>Default selector</h2>
+
+<p>By default, all elements with the <code>class="ui-floatingactions"</code> or <code>data-role="floatingactions"</code> attribute are displayed as floating actions components.</p>
+
+<h2><a id="manual-constructor"></a>Manual Constructor</h2>
+<p>To manually create a floating actions component, use the component constructor from the <code>tau</code> namespace:</p>
+<p>The constructor requires an <code>HTMLElement</code> parameter to create the component, and you can get it with the <code>document.getElementById()</code> method. The constructor can also take a second parameter, which is an object defining the configuration options for the component.</p>
+<pre class="prettyprint">
+<div class="ui-floatingactions" id="floating">
+ <button class="ui-floatingactions-item" data-icon="floating-add"/>
+ <button class="ui-floatingactions-item" data-icon="floating-search"/>
+</div>
+<script>
+ var elFloatingActions = document.getElementById("floating"),
+ flaotingActions = tau.widget.FloatingActions(elFloatingActions);
+</script>
+</pre>
+
+<h2><a id="options-list"></a>Options</h2>
+
+<table>
+ <tbody>
+ <tr>
+ <th>Option</th>
+ <th>Input type</th>
+ <th>Default value</th>
+ <th>Description</th>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-from-rgba</span></td>
+ <td class="option">string</td>
+ <td class="option">"rgba(66, 162, 207, 1)"</td>
+ <td class="option">color when the floating button is positioned at the left end</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-to-rgba</span></td>
+ <td class="option">string</td>
+ <td class="option">"rgba(54, 132, 168, 1)"</td>
+ <td class="option">color when the floating button is positioned at the right end</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-opacity</span></td>
+ <td class="option">number</td>
+ <td class="option">0.9</td>
+ <td class="option">opacity when the floating button is clicked</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-duration</span></td>
+ <td class="option">number</td>
+ <td class="option">300</td>
+ <td class="option">animation duration for color and opacity (unit of time : millisecond)</td>
+ </tr>
+
+ </tbody>
+</table>
+
+<h2>Where to Go Next</h2>
+<ul>
+ <li><a href="./widget_reference.htm">Widget Reference</a></li>
+
+</ul>
+<div id="footer">
+ <hr size="1">
+ <font size="1">Except as noted, this content - excluding the Code Examples - is licensed under <a
+ href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution
+ 3.0</a> and all of the Code Examples contained herein are licensed under <a
+ href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br>For details, see the
+ <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</font>
+</div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
+<html>
+<head>
+ <script type="text/javascript" src="../snippet.js"></script>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
+ <link href="../styles.css" rel="StyleSheet" type="text/css">
+ <link href="../snippet.css" rel="StyleSheet" type="text/css">
+ <title>Grid View</title>
+</head>
+<body onload="prettyPrint()" id="content">
+<h1>Grid View</h1>
+
+<p>Grid View components provides a list of grid-type and presents contents that are easily identified as images.</p>
+<p>You can adjust the number of columns of grid using a pinch gesture. In reorder mode, you can move each item.</p>
+<p>Grid view can have labels and set type of the labels.</p>
+
+<h2>Table of Contents</h2>
+<ol class="toc">
+
+ <li><a href="#default-selector">Default selectors</a></li>
+
+ <li><a href="#manual-constructor">Manual constructor</a>
+ </li>
+
+ <li><a href="#options-list">Options</a>
+ </li>
+
+ <li><a href="#methods">Methods</a></li>
+</ol>
+
+<h2><a id='default-selector'></a>Default selector</h2>
+
+<p>By default, all ul elements with the <code>class="ui-gridview"</code> or <code>data-role="gridview"</code> attribute are displayed as grid view components.</p>
+
+<h2><a id="manual-constructor"></a>Manual Constructor</h2>
+<p>To manually create a grid view component, use the component constructor from the <code>tau</code> namespace:</p>
+<p>The constructor requires an <code>HTMLElement</code> parameter to create the component, and you can get it with the <code>document.getElementById()</code> method. The constructor can also take a second parameter, which is an object defining the configuration options for the component.</p>
+<pre class="prettyprint">
+<ul id="gridview" class="ui-gridview">
+ <li class="ui-gridview-item">
+ <img class="ui-gridview-image" src="images/1.jpg">
+ <div class="ui-gridview-handler"></div>
+ </li>
+ <li class="ui-gridview-item">
+ <img class="ui-gridview-image" src="images/2.jpg">
+ <div class="ui-gridview-handler"></div>
+ </li>
+ <li class="ui-gridview-item">
+ <img class="ui-gridview-image" src="images/3.jpg">
+ <div class="ui-gridview-handler"></div>
+ </li>
+ <li class="ui-gridview-item">
+ <img class="ui-gridview-image" src="images/4.jpg">
+ <div class="ui-gridview-handler"></div>
+ </li>
+</ul>
+<script>
+ var elGridView = document.getElementById("gridview"),
+ gridView = tau.widget.GridView(elGridView);
+</script>
+</pre>
+
+<h2><a id="options-list"></a>Options</h2>
+
+<table>
+ <tbody>
+ <tr>
+ <th>Option</th>
+ <th>Input type</th>
+ <th>Default value</th>
+ <th>Description</th>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-cols</span></td>
+ <td class="option">number</td>
+ <td class="option">4</td>
+ <td class="option">the number of columns to be displayed</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-reorder</span></td>
+ <td class="option">boolean</td>
+ <td class="option">false</td>
+ <td class="option">represents whether grid view is reorder mode</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-label</span></td>
+ <td class="option">string</td>
+ <td class="option">"none"</td>
+ <td class="option">type of label to be attatched to grid item("none", "in", "out")</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-min-width</span></td>
+ <td class="option">number, string</td>
+ <td class="option">null</td>
+ <td class="option">minimum width px of grid item(number or "auto")</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-min-cols</span></td>
+ <td class="option">number</td>
+ <td class="option">1</td>
+ <td class="option">the minimum number of columns</td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-max-cols</span></td>
+ <td class="option">number</td>
+ <td class="option">5</td>
+ <td class="option">the maximum number of columns</td>
+ </tr>
+
+ </tbody>
+</table>
+
+<h2><a id='methods'></a>Methods</h2>
+
+<p>To call method on DropdownMenu, you can refer following:</p>
+
+<pre class="prettyprint">
+var elGridView = document.getElementById("gridview"),
+ gridView = tau.widget.GridView(elGridView),
+ item;
+
+gridView.methodName(methodArgument1, methodArgument2, ...);
+</pre>
+
+<h3>Summary</h3>
+<table class="informaltable">
+ <thead>
+ <tr>
+ <th>Method</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>
+ <pre class="intable prettyprint"><a href="#method-add">addItem</a> ( ) </pre>
+ </td>
+ <td><p>Add an item to grid view</p></td>
+ </tr>
+
+
+
+ <tr>
+ <td>
+ <pre class="intable prettyprint"><a href="#method-remove">removeItem</a> ( ) </pre>
+ </td>
+ <td><p>Remove an item from grid view</p></td>
+ </tr>
+
+ </tbody>
+</table>
+<dl>
+
+
+
+ <dt class="method"><code><b><span class="methodName"
+ id="method-add">addItem</span></b></code></dt>
+ <dd>
+ <div class="brief">
+ <p>Add an item to grid view</p>
+ </div>
+ <div class="synopsis">
+ <pre class="signature prettyprint">addItem (HTMLElement item) </pre>
+ </div>
+
+ <div class="parameters">
+ <p><span class="param">Parameters:</span></p>
+ <table>
+ <tbody>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Required / optional</th>
+ <th>Description</th>
+ </tr>
+
+
+ <tr>
+ <td><span style="font-family: Courier New,Courier,monospace">item</span></td>
+ <td>HTMLElement</td>
+ <td>required</td>
+ <td>element to be added</td>
+ </tr>
+
+
+ </tbody>
+ </table>
+ </div>
+
+ <div class="returntype">
+ <p><span class="return">Return value:</span></p>
+
+
+ No Return Value
+
+ </div>
+
+ <div class="example">
+ <span class="example"><p>Code
+ example:</p><p></p></span>
+ <pre name="code" class="examplecode
+ prettyprint">
+<script>
+var elGridView = document.getElementById("gridview"),
+ gridView = tau.widget.GridView(elGridView),
+ item;
+
+gridView.addItem(item);
+</script>
+</pre>
+ </div>
+ </dd>
+
+
+ <dt class="method"><code><b><span class="methodName"
+ id="method-remove">removeItem</span></b></code></dt>
+ <dd>
+ <div class="brief">
+ <p>Remove an item from grid view</p>
+ </div>
+ <div class="synopsis">
+ <pre class="signature prettyprint">removeItem (HTMLElement item) </pre>
+ </div>
+
+ <div class="parameters">
+ <p><span class="param">Parameters:</span></p>
+ <table>
+ <tbody>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Required / optional</th>
+ <th>Description</th>
+ </tr>
+
+
+ <tr>
+ <td><span style="font-family: Courier New,Courier,monospace">item</span></td>
+ <td>HTMLElement</td>
+ <td>required</td>
+ <td>element to be removed</td>
+ </tr>
+
+
+ </tbody>
+ </table>
+ </div>
+
+ <div class="returntype">
+ <p><span class="return">Return value:</span></p>
+
+
+ No Return Value
+
+ </div>
+
+ <div class="example">
+ <span class="example"><p>Code
+ example:</p><p></p></span>
+ <pre name="code" class="examplecode
+ prettyprint">
+<script>
+var elGridView = document.getElementById("gridview"),
+ gridView = tau.widget.GridView(elGridView),
+ item;
+
+gridView.removeItem(item);
+</script>
+</pre>
+ </div>
+ </dd>
+
+
+
+</dl>
+
+<h2>Where to Go Next</h2>
+<ul>
+ <li><a href="./widget_reference.htm">Widget Reference</a></li>
+
+</ul>
+<div id="footer">
+ <hr size="1">
+ <font size="1">Except as noted, this content - excluding the Code Examples - is licensed under <a
+ href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution
+ 3.0</a> and all of the Code Examples contained herein are licensed under <a
+ href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br>For details, see the
+ <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</font>
+</div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
+<html>
+<head>
+ <script type="text/javascript" src="../snippet.js"></script>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
+ <link href="../styles.css" rel="StyleSheet" type="text/css">
+ <link href="../snippet.css" rel="StyleSheet" type="text/css">
+ <title>Panel Changer</title>
+</head>
+<body onload="prettyPrint()" id="content">
+<h1>Panel Changer</h1>
+
+<p>To implement multi page layout in a page component, you can use panel and panel changer components.</p>
+<p>Panel can have header, content and so on like the page component.</p>
+<p>It works even if the panel components is in other HTML files.</p>
+<p>Panel changer component controls lifecycle of the panels.</p>
+
+
+<h2>Table of Contents</h2>
+<ol class="toc">
+
+ <li><a href="#default-selector">Default selectors</a></li>
+
+ <li><a href="#manual-constructor">Manual constructor</a>
+ </li>
+
+ <li><a href="#html-examples">HTML Examples</a></li>
+
+ <li><a href="#options-list">Options</a>
+ </li>
+
+ <li><a href="#methods-list">Methods</a>
+ </li>
+
+ <li><a href="#events-list">Events</a>
+ </li>
+</ol>
+
+<h2><a id="default-selectors"></a>Default Selectors</h2>
+
+<p>By default, all elements with the class="ui-panel-changer" or data-role="panel-changer" attribute are displayed as panel changer components.</p>
+<p>Panel components use the data-role="panel" or class="ui-panel".</p>
+
+<h2><a id='manual-constructor'></a>Manual Constructor</h2>
+
+<p>For manual creation of panel changer, you can use constructor from <strong>tau</strong> namespace:</p>
+
+<pre class="prettyprint">
+var elPanelChanger = document.getElementById("panelchanger"),
+ panelChanger = tau.widget.PanelChanger(elPanelChanger);
+</pre>
+
+<h2><a id="html-examples"></a>HTML Examples</h2>
+
+<ul><li>
+<p>Panels in another HTML file panel.html</p>
+<pre class="prettyprint">
+<div id="panel2" class="ui-panel">
+ <div class="ui-content">
+ <ul class="ui-listview">
+ <li class="ui-li-anchor">
+ <a href="#panel3">Go Panel 3</a>
+ </li>
+ </ul>
+ </div>
+</div>
+<div id="panel3" class="ui-panel">
+ <div class="ui-content">
+ <ul class="ui-listview">
+ <li class="ui-li-anchor">
+ <a>Panel3</a>
+ </li>
+ </ul>
+ </div>
+</div>
+</pre>
+</li>
+<br>
+<li>
+<p>Panel changer and main panel in your HTML file</p>
+<pre class="prettyprint">
+<div id="panelChanger" class="ui-panel-changer">
+ <div id="mainpanel" class="ui-panel">
+ <ul class="ui-listview">
+ <li class="ui-li-anchor">
+ <a href="./panel.html#panel2">Go Panel 2</a>
+ </li>
+ </ul>
+ </div>
+</div>
+</pre>
+</li>
+</ul>
+
+<h2><a id="options-list"></a>Options</h2>
+
+<table>
+ <tbody>
+ <tr>
+ <th>Option</th>
+ <th>Input type</th>
+ <th>Default value</th>
+ <th>Description</th>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">data-manage-history</span></td>
+ <td class="option">boolean</td>
+ <td class="option">true</td>
+ <td class="option">represent whether to manage history of panels</td>
+ </tr>
+
+ </tbody>
+</table>
+
+
+<h2><a id="methods-list"></a>Methods</h2>
+
+<h3>Summary</h3>
+<table class="informaltable">
+ <thead>
+ <tr>
+ <th>Method</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+
+
+ <tr>
+ <td>
+ <pre class="intable prettyprint"><a href="#method-changePanel">changePanel</a> ( String address, String animationType, String direction ) </pre>
+ </td>
+ <td><p>Change panel method</p></td>
+ </tr>
+
+
+ </tbody>
+</table>
+<dl>
+
+
+ <dt class="method"><code><b><span class="methodName"
+ id="method-changePanel">changePanel</span></b></code></dt>
+ <dd>
+ <div class="brief">
+ <p>change panel</p>
+ </div>
+ <div class="synopsis">
+ <pre class="signature prettyprint">changePanel ( String address, String animationType, String direction) </pre>
+ </div>
+
+ <div class="description">
+ <p>
+
+ </p>
+ </div>
+
+ <div class="parameters">
+ <p><span class="param">Parameters:</span></p>
+ <table>
+ <tbody>
+ <tr>
+ <th>Parameter</th>
+ <th>Type</th>
+ <th>Description</th>
+ </tr>
+
+
+ <tr>
+ <td><span style="font-family: Courier New,Courier,monospace">address</span></td>
+ <td>String</td>
+ <td>path of a panel to be changed</td>
+ </tr>
+
+ <tr>
+ <td><span style="font-family: Courier New,Courier,monospace">animationType</span></td>
+ <td>String</td>
+ <td>animation type of panel changing</td>
+ </tr>
+
+ <tr>
+ <td><span style="font-family: Courier New,Courier,monospace">direction</span></td>
+ <td>String</td>
+ <td>represent panel history goes forward or backward.</td>
+ </tr>
+
+
+ </tbody>
+ </table>
+ </div>
+
+ <div class="returntype">
+ <p><span class="return">Return value:</span></p>
+
+
+ No Return Value
+
+ </div>
+
+ </dd>
+
+
+</dl>
+
+ <h2><a id="events-list"></a>Events</h2>
+
+ <table>
+ <tbody>
+ <tr>
+ <th>Name</th>
+ <th>Description</th>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelbeforecreate</span></td>
+ <td><p>Triggered before the new panel component is created and initialized.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelcreate</span></td>
+ <td><p>Triggered after the new panel component creation.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelbeforeshow</span></td>
+ <td><p>Triggered before the new panel is displayed.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelshow</span></td>
+ <td><p>Triggered after the new panel is displayed.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelbeforehide</span></td>
+ <td><p>Triggered before the current panel is about to be closed.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelhide</span></td>
+ <td><p>Triggered after the current panel is hidden.</p></td>
+ </tr>
+
+ <tr>
+ <td class="option"><span style="font-family: Courier New,Courier,monospace">panelchange</span></td>
+ <td><p>Triggered after switching from the current panel to the new panel.</p></td>
+ </tr>
+
+ </tbody>
+ </table>
+
+
+<h2>Where to Go Next</h2>
+<ul>
+ <li><a href="./widget_reference.htm">Widget Reference</a></li>
+
+</ul>
+<div id="footer">
+ <hr size="1">
+ <font size="1">Except as noted, this content - excluding the Code Examples - is licensed under <a
+ href="http://creativecommons.org/licenses/by/3.0/legalcode" target="_blank">Creative Commons Attribution
+ 3.0</a> and all of the Code Examples contained herein are licensed under <a
+ href="https://www.tizen.org/bsd-3-clause-license" target="_blank">BSD-3-Clause</a>.<br>For details, see the
+ <a href="https://www.tizen.org/content-license" target="_blank">Content License</a>.</font>
+</div>
+</body>
+</html>
\ No newline at end of file
</tr>
<tr>
- <td>Colored List View</td>
- <td></td>
+ <td><a href="mobile_ColoredListview.htm">Colored List View</td>
+ <td>Colored list view provides the list has gradient background color.</td>
<td>2.4</td>
</tr>
</tr>
<tr>
- <td>Floating Actions</td>
- <td></td>
+ <td><a href="mobile_FloatingActions.htm">Floating Actions</a></td>
+ <td>Floating actions component creates a floating button at the bottom of the screen.</td>
<td>2.4</td>
</tr>
<tr>
- <td>Grid View</td>
- <td></td>
+ <td><a href="mobile_GridView.htm">Grid View</a></td>
+ <td>Grid View components provides a list of grid-type and presents contents that are easily identified as images.</td>
<td>2.4</td>
</tr>
</tr>
<tr>
- <td>Panel Changer</td>
- <td></td>
+ <td><a href="mobile_PanelChanger.htm">Panel Changer</a></td>
+ <td>Panel changer and panel component provide multi page layout in a page component.</td>
<td>2.4</td>
</tr>
projects / sdk / online-doc.git / commitdiff