<?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-60B979FB-43BD-480E-8E17-1D3DA2002CB1" xml:lang="en"><title>Slider
pop-up</title><prolog><metadata><keywords/></metadata></prolog><conbody>
<p>The Slider pop-up component can be used for situations where a value is
changed with a slider, for example when changing zoom or volume level. The
common Slider pop-up component has a set of elements from which to select
and modify the slider in question, for example, value ranges, whether to have
current value as text included, or additional icons related to the slider.</p>
<p>For application specific slider pop-up the application may define ways
to open the pop-up. For common pop-up such as Volume Control, ways to open
the pop-up are defined. The Slider pop-up has default time-out after which
it disappears, but for good reason this time-out can be overridden by the
application. </p>
<p>Instead of using the pop-up, the application may define the slider to be
always visible (fixed in the layout). If slider is fixed in the layout, the
pop-up is not shown.</p>
<p>The orientation of the slider pop-up can be either horizontal or vertical.
The orientation and location are always the same across applications, unless
application uses the slider as fixed in the layout. Value growth direction
in Slider is always either up or right depending on the Slider orientation
in the UI. </p>
<table id="GUID-7A441CF1-6B7B-43EF-9E31-AF45034B49FB"><title>Default touch
events for the Slider pop-up</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 slider)</p></entry>
<entry><p>Slider thumb is moved to the nearest slider step position on the
slider. Value is changed accordingly.</p><p>If touch down event is performed
in the middle of two slider step positions, the slider thumb is moved towards
the greater (larger) value.</p></entry>
<entry><p>Tactile: No touch down effect. Sensitive slider effect and audio
feedback is provided when the thumb moves.</p></entry>
</row>
<row>
<entry><p>Touch down (on slider thumb)</p></entry>
<entry><p>Slider thumb is activated and can be moved.</p></entry>
<entry><p>Tactile: Sensitive slider effect is provided with touch down.</p></entry>
</row>
<row>
<entry><p>Touch release</p></entry>
<entry><p>No effect</p></entry>
<entry><p>Tactile: Sensitive slider effect is provided with the touch release
(on slider thumb).</p></entry>
</row>
<row>
<entry><p>Touch down and hold (on slider)</p></entry>
<entry><p>Moves the thumb step by step to the place where touched down.</p></entry>
<entry><p>Tactile: Hold slider effect is given with long touch on the slider.
Effect is bound to the steps. If there are more than 15 steps, then smooth
slider effect is given instead.</p></entry>
</row>
<row>
<entry><p>Touch down and hold (on slider thumb)</p></entry>
<entry><p>Inactive</p></entry>
<entry><p>Tactile: No effect</p></entry>
</row>
<row>
<entry><p>Touch down and move</p></entry>
<entry><p>Slider thumb is moved along with the touch event. It moves step
by step via its possible positions. Value is changing accordingly. </p><p>If
touch release in the middle of two slider step positions, the slider thumb
is moved towards the greater (larger) value. </p><p><note>The slider control
area is the entire main pane area.</note></p></entry>
<entry><p>Tactile: Smooth slider effect is provide when dragging from the
thumb. </p><p>Smooth feedback can be increasing and decreasing when there
is a meaning to use this kind of feature, for example, in volume and zoom
slider.</p></entry>
</row>
<row>
<entry><p>Touch down and cancel (slider thumb)</p></entry>
<entry><p>Slider thumb is moved to the nearest slider step position where
it was when the touch left the slider control area.</p></entry>
<entry><p>Tactile: No feedback is provide with touch release after drag outside.</p></entry>
</row>
</tbody>
</tgroup>
</table>
<p/>
<table id="GUID-905C951F-5C5D-431E-84E9-384EFDBE3192"><title>Default touch
events for the Minus / Plus indicators.</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</p></entry>
<entry><p>Slider thumb moves either up or down. Direction depends on which
indicator has been touched.</p></entry>
<entry><p>Tactile: Sensitive button effect and audio feedback is provided
with the touch down event.</p></entry>
</row>
<row>
<entry><p>Touch down and hold (keep touch down)</p></entry>
<entry><p>This action performs a “key repeat”, similar to many single touch
down and release on the indicator.</p></entry>
<entry><p>Tactile: Sensitive button effect provided with steps.</p></entry>
</row>
<row>
<entry><p>Touch release</p></entry>
<entry><p>Slider thumb stops in its position</p></entry>
<entry><p>Tactile: Sensitive button effect given with touch release event.</p></entry>
</row>
<row>
<entry><p>Touch down and move outside and release the control area</p></entry>
<entry><p>Slider’s thumb remains in the position, where it was, before moving
out of both pop-up and indicator area.</p></entry>
<entry><p>Tactile: No effect</p></entry>
</row>
</tbody>
</tgroup>
</table>
<section id="GUID-1B1C405D-61EF-4E54-8704-23EA67FEC11A"><title>Using
slider pop-ups in applications</title><p>The API to use for the
slider pop-up is the Slider API.</p><p>To use a slider pop-up in your application,
create an instance of the class <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html" format="application/java-archive"><codeph>CAknSlider</codeph></xref>.</p><p>Use the method <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#522ccd7bdb0fac6707734578e2d4ed7b" format="application/java-archive"><codeph>CAknSlider::SetValueL()</codeph></xref> to set the slider handle's position.
To set the range of acceptable values, use the method <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#e6e3b16a15f653eb9fc5b207f7852857" format="application/java-archive"><codeph>CAknSlider::SetRange()</codeph></xref>. To set the step size, use
the method <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#f72ea3d251c686948dfea1dbcf9be170" format="application/java-archive"><codeph>CAknSlider::SetStepSize()</codeph></xref>.</p><p>To set the texts for the minimum and maximum values, use the
methods <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#0359150c9fd3d2390de7c0dd6f7d6063" format="application/java-archive"><codeph>CAknSlider::SetMinimumTextL()</codeph></xref> and <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#882ca8ea40249fd2636748a116370fed" format="application/java-archive"><codeph>CAknSlider::SetMaximumTextL()</codeph></xref>. </p><p>To enable drag events in the slider, use the method <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#a3db99850ff68e4a80071de18befdcd1" format="application/java-archive"><codeph>CAknSlider::EnableDrag()</codeph></xref></p><p>To use a custom graphic in your slider component, use the method <xref href="jar:GUID-759FBC7F-5384-4487-8457-A8D4B76F6AA6.jar!/html/classCAknSlider.html#6161f69289ee1c7e0f47de8fee21ecee" format="application/java-archive"><codeph>CAknSlider::SetGraphics()</codeph></xref>.</p></section>
</conbody></concept>