User Tools

Site Tools


slider

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

slider [2015/09/18 17:02] (current)
glass created
Line 1: Line 1:
 +====== Slider ======
  
 +The SliderElement creates interactive sliders.
 +
 +{| class="​wikitable"​
 +!
 +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.
 +|}
 +
 +
 +{| class="​wikitable"​
 +!
 +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]]
 +
 +
 +<​code:​csharp linenums:​1>​
 +<!-- 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>​
 +</​code>​
slider.txt · Last modified: 2015/09/18 17:02 by glass