Feathers:slider
原文地址：http://wiki.starling-framework.org/feathers/slider
目录 |
如何使用Feathers Slider组件
Slider组件 组件用来设定并显示最大与最小值区间中的一个值。这个值可以通过沿着水平或垂直轨道的滑块的滑动来改变调整。
基础部分
让我们开始来创建一个Slider。
var slider:Slider = new Slider(); slider.minimum = 0; slider.maximum = 100; slider.value = 50; this.addChild( slider );
value 属性表示slider当前的值，而 minimum 和 maximum 属性是建立一个范围区间。我们也可以用一对更有用的属性来进一步控制该slider的行为:
slider.step = 1; slider.page = 10;
step属性是控制当slider被拖拽时，其值以什么样的步长变化。如果我们设定step为1，往上拖动时其值就会以整数形式变化，而不可能出现4.5这样的值。当你触摸slider轨迹时，会让page属性起作用。此值会反复地增长或减少直到触到轨迹的末端。一般来说，page是大于step的。
监听Event.CHANGE事件来判断该属性发生了变化:
slider.addEventListener( Event.CHANGE, slider_changeHandler );
监听器可能像这样:
function slider_changeHandler( event:Event ):void { var slider:Slider = Slider( event.currentTarget ); trace( "slider.value changed:", slider.value); }
===== 对一个Slider着肤
Slider皮肤控件分成2或3部分。
对Thumb着肤
一个slider的thumb其实是一个简单的 Button控件，而且你可以像其他任何按钮一样着肤。如果你创建了一个主题，你可以指定[[1]]名称。
setInitializerForClass( Button, sliderThumbInitializer, Slider.DEFAULT_CHILD_NAME_THUMB );
或者可以这样，你可以传thumb的属性到Slider的thumbProperties属性中。下面，我们会传Starling Image 显示对象给thumb的每个皮肤状态。
slider.thumbProperties.defaultSkin = new Image( upTexture ); slider.thumbProperties.downSkin = new Image( downTexture ); slider.thumbProperties.hoverSkin = new Image( hoverTexture );
对Track(s)着肤
slider的track由一两个按钮组成，其依赖于trackLayoutMode的属性值。默认情况下，其为一个单一的填充于这个slider的整个宽高的轨迹。如果你想把按钮分开在track的两边（一边是minimum，另一边是maximum），那么我们可以设定trackLayoutMode到 Slider.TRACK_LAYOUT_MODE_MIN_MAX。这种方式中，每个track的宽度都会随着thumb移动而调整，以确保两个track永远重合在thumb的中心。
如果我们创建了一个theme，那么我们就可以创建一个用名为Slider.DEFAULT_CHILD_NAME_MINIMUM_TRACK的Button类设定的initializer，来设 定"minimum"轨迹到thumb的左边或底部。如果我们使用Slider.TRACK_LAYOUT_MODE_SINGLE，就是设定单一的track。同样，我们根据slider的方向，可以创建一个用名为Slider.DEFAULT_CHILD_NAME_MAXIMUM_TRACK的Button类设定的initializer，来设定"minimum"轨迹到thumb的右边或顶部。
setInitializerForClass( Button, sliderMinimumTrackInitializer, Slider.DEFAULT_CHILD_NAME_MINIMUM_TRACK ); setInitializerForClass( Button, sliderMaximumTrackInitializer, Slider.DEFAULT_CHILD_NAME_MAXIMUM_TRACK );
除此之外，我们可以使用minimumTrackProperties和maximumTrackProperties来传递按钮皮肤。
slider.minimumTrackProperties.defaultSkin = new Scale9Image( onTrackUpTextures ); slider.minimumTrackProperties.downSkin = new Scale9Image( onTrackDownTextures ); slider.maximumTrackProperties.defaultSkin = new Scale9Image( offTrackUpTextures ); slider.maximumTrackProperties.downSkin = new Scale9Image( offTrackDownTextures );
另一方面，如果我们想一个总是填充包括slider边缘的整长的track，那么我们可以设置trackLayoutMode给lider.TRACK_LAYOUT_MODE_SINGLE。既然如此，我们还可以只通过minimumTrackProperties设置单一的track属性。那么maximumTrackProperties 就会被忽略。
slider.minimumTrackProperties.defaultSkin = new Scale9Image( trackTextures );
Slider.TRACK_LAYOUT_MODE_SINGLE通常是track处于静态出现情况下的最佳情况。当你想track处于按下或悬停状，Slider.TRACK_LAYOUT_MODE_MIN_MAX会运转的更佳，因为此状态只在thumb的一边改变。
无Thumb
一个slider也提供一个[[2]]属性。如果设置false，thumb就隐藏了，同时track变成可拖动状态。联合minimum和maximum的track来生成一个增长的颜色值填充的slider。
相关链接
For more tutorials, return to the Feathers Documentation.
翻译者：郭必江
