User Tools

Site Tools


slider

Slider

The SliderElement creates interactive sliders.


Characteristic

Definition
Type Interactive Display Object
Category Element
Scope Local
Position *
Parents Container
Children Graphics
Gestures Drag, touchDown
Requirements The nesting structure and class attributes must match the example below.

Attribute

Type

Description
discrete true/false sets the slider's mode
gestureReleaseInertia true/false turns gestureReleaseInertia off/on
hit object reference sets the slider's hit area
knob object reference sets the slicer's knob element
max number sets the max output value
min number sets the min output value
orientation text sets the orientation of the slider, choose “horizontal” or “vertical”
rail object reference sets the slider's rail element
steps number sets the number of discrete steps used when in discrete mode

See Also: Display Attributes

<!-- Vertical continous slider -->
<Slider id="vertical" x="500" y="100" discrete="false" orientation="vertical" gestureReleaseInertia="true" hit="#hitArea" rail="#bottom" knob="#top" min="0" max="100">
    <Graphic id="bottom" shape="rectangle" x="0" y="0" width="20" height="500" lineStroke="1" color="0x222222" lineColor="0x333333" alpha="1"/>
    <Graphic id="top" shape="circle" x="-15" y="0" radius="25" color="0xDDDDDD" lineStroke="2" lineColor="0x666666"/>
    <Graphic id="hitArea" shape="rectangle" x="-40" y="0" width="100" height="500" alpha="0" />
</Slider>

<!-- Vertical slider updated by program -->
<Slider id="input-vert" x="600" y="100" mouseEnabled="false" discrete="true" orientation="vertical" gestureReleaseInertia="true" hit="#hitArea" rail="#bottom" knob="#top" min="0" max="100">
    <Graphic id="bottom" shape="rectangle" x="0" y="0" width="20" height="500" lineStroke="1" color="0x222222" lineColor="0x333333" alpha="1"/>
    <Graphic id="top" shape="circle" x="-15" y="0" radius="25" color="0xDDDDDD" lineStroke="2" lineColor="0x666666"/>
    <Graphic id="hitArea" shape="rectangle" x="-40" y="0" width="100" height="500" alpha="0" />
</Slider>

<!-- Horizontal snaps to discrete points slider -->
<Slider id="horizontal" x="700" y="200" discrete="true" steps="5" orientation="horizontal" gestureReleaseInertia="false" hit="#hitArea" rail="#bottom" knob="#top" min="0" max="100">
    <Graphic id="bottom" shape="rectangle" x="0" y="0" width="500" height="20" lineStroke="1" color="0x222222" lineColor="0x333333" alpha="1"/>
    <Graphic id="top" shape="rectangle" x="0" y="-10" width="10" height="40" color="0xDDDDDD" lineStroke="2" lineColor="0x666666"/>
    <Graphic id="hitArea" shape="rectangle" x="0" y="-40" width="500" height="100" alpha="0" />
</Slider>

<!-- Horizontal slider updated by program -->
<Slider id="input-horiz" x="700" y="300" mouseEnabled="false" discrete="false" orientation="horizontal" gestureReleaseInertia="false" hit="#hitArea" rail="#bottom" knob="#top"  min="0" max="100">
    <Graphic id="bottom" shape="rectangle" x="0" y="0" width="500" height="20" lineStroke="1" color="0x222222" lineColor="0x333333" alpha="1"/>
    <Graphic id="top" shape="rectangle" x="0" y="-10" width="10" height="40" color="0xDDDDDD" lineStroke="2" lineColor="0x666666"/>
    <Graphic id="hitArea" shape="rectangle" x="0" y="-40" width="500" height="100" alpha="0" />
</Slider>
slider.txt · Last modified: 2015/09/18 17:02 by glass