Symbian3/SDK/Source/GUID-76FD2A71-E8A3-4C82-9704-3F7F6AD4DFD8.dita
author Dominic Pinkman <dominic.pinkman@nokia.com>
Fri, 11 Jun 2010 12:39:03 +0100
changeset 8 ae94777fff8f
parent 7 51a74ef9ed63
child 13 48780e181b38
permissions -rw-r--r--
Week 23 contribution of SDK documentation content. See release notes for details. Fixes bugs Bug 2714, Bug 462.

<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (c) 2007-2010 Nokia Corporation and/or its subsidiary(-ies) All rights reserved. -->
<!-- This component and the accompanying materials are made available under the terms of the License 
"Eclipse Public License v1.0" which accompanies this distribution, 
and is available at the URL "http://www.eclipse.org/legal/epl-v10.html". -->
<!-- Initial Contributors:
    Nokia Corporation - initial contribution.
Contributors: 
-->
<!DOCTYPE concept
  PUBLIC "-//OASIS//DTD DITA Concept//EN" "concept.dtd">
<concept id="GUID-76FD2A71-E8A3-4C82-9704-3F7F6AD4DFD8" xml:lang="en"><title>Navi
pane</title><prolog><metadata><keywords/></metadata></prolog><conbody>
<p>The principal uses of the Navi pane are to display information about the
current state and view, and to help the user to navigate in the application.</p>
<fig id="GUID-3E3F8A70-C0EB-4B17-AB6D-7374FBF8B453">
<title>Navi pane</title>
<image href="GUID-EDBCCC26-BA4D-4318-9F0D-62272FA97BBF_d0e67259_href.png" placement="inline"/>
</fig>
<p>Depending on the context, the Navi pane contains elements presented in
the following table.</p>
<table id="GUID-8F674003-C512-4E42-BB7E-85A55F93E3BB"><title>Possible Navi
pane content</title>
<tgroup cols="2"><colspec colname="col1"/><colspec colname="col2"/>
<thead>
<row>
<entry>Component</entry>
<entry>Description</entry>
</row>
</thead>
<tbody>
<row>
<entry><p>Tabs</p><fig id="GUID-2CBA76C9-3918-40C7-889B-BC5181B34955"/></entry>
<entry><p>Tabs are used to view parallel data views alternatively. Arrow indicators
are used only for navigation texts. </p><p>Each tab has either a graphic or
a text (or both) as a label. The following tab layouts can be used: <ul>
<li><p>Two tabs</p></li>
<li> <p>Three tabs</p></li>
<li><p>Four tabs</p></li>
<li><p>Two long tabs</p></li>
<li> <p>Three long tabs (stacked so that only one is fully visible at a time)</p></li>
</ul>The currently active tab is highlighted.</p><p>More than four tabs can
exist simultaneously. They can be scrolled horizontally. However, as a design
guideline, the number of tabs should be kept small (the maximum of six tabs
is recommended), and the number should not be dynamic. See <xref href="GUID-72DE3EB1-1AF5-4157-8B99-A1C7143DAD2C.dita"/> for
a description of the effect of tabs on the navigation within an application.</p></entry>
</row>
<row>
<entry><p>Navigation text (icon+text)</p><fig id="GUID-B2C30B15-0343-4430-8535-05C8BAAB1B7B">
<image href="GUID-6FE79448-5052-46F9-A74E-A128CB367697_d0e67337_href.png" scale="30" placement="inline"/>
</fig></entry>
<entry><p>Navigation text is displayed in the <uicontrol>Navi pane</uicontrol> when
similar items can be browsed by scrolling horizontally, such as dates in Calendar.
Arrow indicators at both ends of the pane indicate the possibility to scroll.</p></entry>
</row>
<row>
<entry><p>Indicators</p><fig id="GUID-89499CD6-C3C5-4BD5-964A-02ADD8A30116">
<image href="GUID-03A3E872-8183-4F56-976E-A6AF435742C6_d0e67355_href.png" scale="30" placement="inline"/>
</fig></entry>
<entry><p>In editors, the <uicontrol>Navi pane</uicontrol> contains editing
indicators. See <xref href="GUID-BA8806CC-BE7C-4927-ACF6-DA0CB6E96AAA.dita">Indicators</xref> for
a more detailed description of the <uicontrol>Navi pane</uicontrol> indicators.</p></entry>
</row>
<row>
<entry><p>Folder structure indication</p><fig id="GUID-274C1478-A141-4705-A6BF-E99703FE714D">
<image href="GUID-257212F5-A414-4F17-A786-DB3168218139_d0e67378_href.png" scale="30" placement="inline"/>
</fig></entry>
<entry><p>Opened sub-folders are indicated in the <uicontrol>Navi pane</uicontrol>.</p></entry>
</row>
<row>
<entry><p>Application-specific content</p></entry>
<entry><p>When none of the above content types is suitable, the <uicontrol>Navi
pane</uicontrol> content can be designed specifically for an application.</p></entry>
</row>
<row>
<entry><p>Empty pane</p><fig id="GUID-85A80F31-F9ED-4ECE-BAF0-5A2083CE578A">
<image href="GUID-E64A8D76-28AD-4F75-9E92-3290488F85D9_d0e67410_href.png" scale="30" placement="inline"/>
</fig></entry>
<entry><p>The <uicontrol>Navi pane</uicontrol> can be empty.</p></entry>
</row>
</tbody>
</tgroup>
</table>
<p/>
<table id="GUID-D5CFA14A-79F4-4E9C-A051-6588C7DDAC59"><title>Default touch
events for ungrouped soft notification</title>
<tgroup cols="3"><colspec colname="col1" colwidth="0.80*"/><colspec colname="col2" colwidth="1.01*"/><colspec colname="col3" colwidth="1.19*"/>
<thead>
<row>
<entry valign="top"><p>User action</p></entry>
<entry valign="top"><p>State change</p></entry>
<entry valign="top"><p>Feedback</p></entry>
</row>
</thead>
<tbody>
<row>
<entry><p>Touch down on navigation text or navigation arrow</p></entry>
<entry><p>Application specific</p></entry>
<entry><p>Tactile: In case of activity, basic button effect and audio feedback
is provided.</p></entry>
</row>
<row>
<entry><p>Touch down and hold on navigation text</p></entry>
<entry><p>Inactive</p></entry>
<entry><p>Tactile: No effect</p></entry>
</row>
<row>
<entry><p>Touch down and hold on arrows</p></entry>
<entry><p>This action performs a “key repeat”, similar to many touch downs
and releases on arrow</p></entry>
<entry><p>Tactile: Sensitive button effect and audio feedback is provided
with key repeat action.</p></entry>
</row>
<row>
<entry><p>Touch release</p></entry>
<entry><p>No effect</p></entry>
<entry><p>Tactile: No effect</p></entry>
</row>
</tbody>
</tgroup>
</table>
<section id="GUID-3E478FC5-080A-4EAF-98F4-B0C0F1C8E19D"><title>Using
the navi pane in applications</title><p>The API to use for the Navi pane is
the <xref format="html" href="specs/guides/Navigation_Pane_API_Specification/Navigation_Pane_API_Specification.html" scope="peer">Navigation pane API</xref>. If you use tabs in the Navi pane,
the API for controlling the tabs is the <xref format="html" href="specs/guides/Tabs_API_Specification/Tabs_API_Specification.html" scope="peer">Tabs API</xref>. Applications can implement an observer to handle
the touch events in the Navi pane area.</p><p>For the indicators
in the Navi pane, use the Indicators API.</p><p>For implementation information
on the Navi pane, see <xref format="html" href="specs/guides/Navigation_Pane_API_Specification/Navigation_Pane_API_Specification.html#Navigation_Pane_API_Specification.topic3" scope="peer">Using the Navigation pane API</xref>. For implementation information
on tabs, see <xref format="html" href="specs/guides/Tabs_API_Specification/Tabs_API_Specification.html#Tabs_API_Specification.topic3" scope="peer">Using the Tabs API</xref>.</p><p>The <xref href="GUID-1239E9D4-0184-350E-A344-144499E0563E.dita"><apiname>MAknNaviDecoratorObserver</apiname></xref> class
provides touch support for the tab arrows in the Navi pane. To set the observer,
use the <xref href="GUID-7E710ED4-F210-3BD0-AC0A-DC506E327B32.dita#GUID-7E710ED4-F210-3BD0-AC0A-DC506E327B32/GUID-3EE352C1-5B27-30DB-9D72-21A84A89E7AB"><apiname>CAknNavigationDecorator::SetNaviDecoratorObserver()</apiname></xref> method.</p><p>To
create a tab group in the Navi pane, use the <xref href="GUID-985BFC71-A477-39EF-9134-6495131BA449.dita#GUID-985BFC71-A477-39EF-9134-6495131BA449/GUID-1DA90B0F-D97F-3556-8180-7F99081E9373"><apiname>CAknNavigationControlContainer::CreateTabGroupL()</apiname></xref>.
This is a factory method for a pre-implemented navigation pane tab group control.</p></section>
</conbody></concept>