eui.Range
包 eui
类 public class Range
继承 eui.Range → eui.Component → egret.DisplayObjectContainer → egret.DisplayObject → egret.EventDispatcher → egret.HashObject
子类 eui.ProgressBar,eui.SliderBase
范围选取组件,该组件包含一个值和这个值所允许的最大最小约束范围。value属性的值永远被限制于当前的minimum和maximum之间，并且minimum和 maximum永远按照固定的顺序排列，即(minimum <= value <= maximum) 为真。如果snapInterval属性的值不是0，那么value的值也会被snapInterval所约束。
公共属性
| 属性 |
|---|
| maximum : number 最大有效值 |
| minimum : number 最小有效值规定 value属性的值不能够低于的最小值 |
| snapInterval : number snapInterval 属性定义 value 属性的有效值 |
| value : number 此范围的当前值 |
公共方法
| 方法 |
|---|
| Range() 创建一个 Range 实例 |
事件
| Events |
|---|
| egret.Event.COMPLETE 当设置skinName为外部exml文件路径时，加载并完成EXML解析后调度。 |
| egret.Event.RESIZE 当UI组件的尺寸发生改变时调度 |
| eui.UIEvent.MOVE 当UI组件在父级容器中的位置发生改变时调度 |
| eui.UIEvent.CREATION_COMPLETE 当UI组件第一次被添加到舞台并完成初始化后调度 |
| egret.Event.ADDED 将显示对象添加到显示列表中时调度。 |
| egret.Event.ADDED_TO_STAGE 在将显示对象直接添加到舞台显示列表或将包含显示对象的子树添加至舞台显示列表中时调度。 |
| egret.Event.REMOVED 将要从显示列表中删除显示对象时调度。 |
| egret.Event.REMOVED_FROM_STAGE 在从显示列表中直接删除显示对象或删除包含显示对象的子树时调度。 |
| egret.Event.ENTER_FRAME [广播事件] 播放头进入新帧时调度。 |
| egret.Event.RENDER [广播事件] 将要更新和呈现显示列表时调度。 |
| egret.TouchEvent.TOUCH_MOVE 当用户触碰设备时进行调度，而且会连续调度，直到接触点被删除。 |
| egret.TouchEvent.TOUCH_BEGIN 当用户第一次触摸启用触摸的设备时（例如，用手指触摸手机屏幕）调度。 |
| egret.TouchEvent.TOUCH_END 当用户移除与启用触摸的设备的接触时（例如，将手指从屏幕上抬起）调度。 |
| egret.TouchEvent.TOUCH_TAP 当用户在启用触摸设备上的已启动接触的同一 DisplayObject 实例上抬起接触点时（例如，手机点击屏幕后抬起）调度。 |
| egret.TouchEvent.TOUCH_RELEASE_OUTSIDE 当用户在启用触摸设备上的已启动接触的不同 DisplayObject 实例上抬起接触点时（例如，按住屏幕上的某个对象,然后从它上面挪开后再松开手指）调度。 |
属性详细信息
maximum
maximum : number = 100
- 支持版本:eui 1.0
- 运行平台:Web,Native
最大有效值。规定value属性的值不能够超过的最大值。该修正过程将在nearestValidValue()方法中进行。
minimum
minimum : number = 0
- 支持版本:eui 1.0
- 运行平台:Web,Native
最小有效值规定value属性的值不能够低于的最小值。该修正过程将在nearestValidValue()方法中进行。
snapInterval
snapInterval : number = 1
- 支持版本:eui 1.0
- 运行平台:Web,Native
如果为非零，则有效值为 minimum 与此属性的整数倍数之和，且小于或等于 maximum。
例如，如果 minimum 为 10，maximum 为 20，而此属性为 3，则可能的有效值为 10、13、16、19 和 20.
如果此属性的值为零，则仅会将有效值约束到介于 minimum 和 maximum 之间（包括两者）。
value
value : number = 0
- 支持版本:eui 1.0
- 运行平台:Web,Native
此范围的当前值。改变的value属性将在commitProperties()方法中被minimum属性和minimum属性所限制。此修正过程将在nearestValidValue()方法中进行。
方法详细信息
Range()
public Range()
创建一个 Range 实例。
- 支持版本:eui 1.0
- 运行平台:Web,Native
示例
**
* 下面的例子显示了如何实现一个仪表效果的 eui.Range 组件
*/
class RangeViewerExample extends eui.Range {
pointer: eui.Image;
constructor() {
super();
this.skinName =
`<e:Skin class="skins.RangeViewerSkin" minWidth="30" minHeight="18" xmlns:e="http:/ns.egret.com/eui">
<e:Image x="0" y="0" source="resource/range-background.png"/>
<e:Image id="pointer" x="60" y="60" source="resource/pointer.png"/>
</e:Skin>`;
}
protected updateSkinDisplayList() {
var range = this.maximum - this.minimum;
var rate = (this.value - this.minimum) / range;
var angle = -150 + rate * 120;
this.pointer.rotation = angle;
}
}
class RangeExample extends eui.Group {
constructor() {
super();
var rangeViewer = new RangeViewerExample();
rangeViewer.minimum = 0;
rangeViewer.maximum = 120;
rangeViewer.x = 50;
rangeViewer.y = 50;
var timer = new egret.Timer(1000);
timer.addEventListener(egret.TimerEvent.TIMER, e=> rangeViewer.value = Math.random() * 120, this);
timer.start();
this.addChild(rangeViewer);
}
}
