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.
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.
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.
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.
User action |
State change |
Feedback |
|---|---|---|
Touch down (on slider) |
Slider thumb is moved to the nearest slider step position on the slider. Value is changed accordingly. If touch down event is performed in the middle of two slider step positions, the slider thumb is moved towards the greater (larger) value. |
Tactile: No touch down effect. Sensitive slider effect and audio feedback is provided when the thumb moves. |
Touch down (on slider thumb) |
Slider thumb is activated and can be moved. |
Tactile: Sensitive slider effect is provided with touch down. |
Touch release |
No effect |
Tactile: Sensitive slider effect is provided with the touch release (on slider thumb). |
Touch down and hold (on slider) |
Moves the thumb step by step to the place where touched down. |
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. |
Touch down and hold (on slider thumb) |
Inactive |
Tactile: No effect |
Touch down and move |
Slider thumb is moved along with the touch event. It moves step by step via its possible positions. Value is changing accordingly. If touch release in the middle of two slider step positions, the slider thumb is moved towards the greater (larger) value. Note: The slider control area is the entire main pane area. |
Tactile: Smooth slider effect is provide when dragging from the thumb. 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. |
Touch down and cancel (slider thumb) |
Slider thumb is moved to the nearest slider step position where it was when the touch left the slider control area. |
Tactile: No feedback is provide with touch release after drag outside. |
User action |
State change |
Feedback |
|---|---|---|
Touch down |
Slider thumb moves either up or down. Direction depends on which indicator has been touched. |
Tactile: Sensitive button effect and audio feedback is provided with the touch down event. |
Touch down and hold (keep touch down) |
This action performs a “key repeat”, similar to many single touch down and release on the indicator. |
Tactile: Sensitive button effect provided with steps. |
Touch release |
Slider thumb stops in its position |
Tactile: Sensitive button effect given with touch release event. |
Touch down and move outside and release the control area |
Slider’s thumb remains in the position, where it was, before moving out of both pop-up and indicator area. |
Tactile: No effect |
The API to use for the slider pop-up is the Slider API.
To use a slider pop-up in your application, create an instance of the class CAknSlider.
Use the method CAknSlider::SetValueL() to set the slider handle's position. To set the range of acceptable values, use the method CAknSlider::SetRange(). To set the step size, use the method CAknSlider::SetStepSize().
To set the texts for the minimum and maximum values, use the methods CAknSlider::SetMinimumTextL() and CAknSlider::SetMaximumTextL().
To enable drag events in the slider, use the method CAknSlider::EnableDrag().
To use a custom graphic in your slider component, use the method CAknSlider::SetGraphics().