Dojo学习笔记（十五）：Dojo滑动条Slider
Slider没有相对应的 HTML 控件，是一个相对独立的图形化的组件，可以通过鼠标、方向键来控制刻度尺的刻度。Dijit提供了水平和垂直滑动条。
Slider widget的使用却如同使用 CheckBox widget一样的方便。用户可以用鼠标点击、拖拉、中键滚动或者用键盘的上、下、左、右按键来选择Slider widget的刻度。
Silder 是由六个 widgets 组成，分别是：dijit.form.HorizontalSlider, dijit.form.VerticalSlider，dijit.form.HorizontalRule, dijit.form.VerticalRule，dijit.form.HorizontalRuleLabels, dijit.form.VerticalRuleLabels。
dijit.form.HorizontalSlider是水平方向的slider， dijit.form.VerticalSlider 是垂直方向的slider，提供可调节大小的标尺。其属性如下：
滑动条：HorizontalSlider 和 VerticalSlider 的属性
| 属性 | 属性类别 | 描述 |
| clickSelect | boolean true |
指定单击进度条是否可以更改刻度值 |
| discreteValues | integer Infinity |
在最大值与最小值之间可以设置的非连续值得个数 |
| intermediateChanges | Boolean false |
判断在调用 setValue 方法时是否直接触发 onChange 事件。如果为’ true ’，则每次执行 setValue 方法时都会触发 onChange 事件；如果为’ false ’，则 onChange 事件只有在自己被调用时才会被触发。 |
| maximum | integer 100 |
可设置的最大刻度值 |
| minimum | integer 0 |
可设置的最小刻度值 |
| pageIncrement | integer 2 |
点击键盘按键 pageup/pagedown 时一次变化的刻度值 |
| showButtons | boolean true |
指定是否在刻度条两端显示增加和减小的按钮 |
函数increment()表示以1单位为步长增加滑动条的值；函数decrement()表示以1单位为步长减少滑动条的值。
刻度尺：HorizontalRule 和 VerticalRule 的属性
| 属性 | 属性类别 | 描述 |
| container | Node containerNode |
设置刻度尺或文本标签相对于滑动条的位置，HorizontalSlider使用topDecoration或bottomDecoration，VerticalSlider使用leftDecoration或rightDecoration。 |
| count | Integer 3 |
指定生成刻度线的数量 |
| ruleStyle | String | 指定刻度线设置 CSS style |
dijit.form.HorizontalRuleLabels, dijit.form.VerticalRuleLabels 可以为标尺提供刻度标签，其属性如下：
标签：HorizontalRuleLabels 和 VerticalRuleLabels 的属性
| 属性 | 属性类别 | 描述 |
| labels | Array [] |
文本标签的数组，存放要展现的标签值 |
| labelStyle | String | 指定为文本标签设置 CSS style |
| minimum | Integer 0 |
在没有指定标签数组情况下，以这个值最左（下）端标签 |
| maximum | Integer 1 |
在没有指定标签数组情况下，以这个值最右（上）端标签 |
| getLabels | Function [] |
返回labels数组 |
| constraints | Object {pattern:"#%"} |
在没有指定标签数组情况下，使用这个对象包含的模式来生成数字标签 |
--声明方式：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
data-dojo-props=
"minimum: 0,maximum: 100,pageIncrement: 20,value: 20,intermediateChanges: true,style: 'height: 200px;'"
>
|