package { import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; import flash.geom.Rectangle; //轻量级滑块控件(by yjmyzz@126.com,http://yjmyzz.cnblogs.com/) public class SimpleSlider extends Sprite { private var _value:Number; private var _max:Number=100; private var _min:Number=0; private var _handle:Sprite; private var _back:Sprite; private var _progress:Sprite; private var _tri:Sprite; private var _backWidth:Number=0; private var _backHeight:Number=100; private var _backColor:uint=0xcccccc; private var _backBorderColor:uint=0x999999; private var _handleWidth:Number=6; private var _handleHeight:Number=20; private var _handleColor:uint=0x000000; private var _handleBorderColor:uint=0xcccccc; private var _progressColor:uint=0xffff99; private var _showProgress:Boolean=false; private var _progressValue:uint=0; private var _showTri:Boolean=false; private var _triHighlightColor:uint = 0xffff99; public function SimpleSlider(min:Number=0, max:Number=100, value:Number=100, showProgress:Boolean=false) { _min=min; _max=max; this._showProgress=showProgress; _value=Math.min(Math.max(value, min), max); init(); } private function init():void { _back=new Sprite(); addChild(_back); this._progress=new Sprite(); addChild(_progress); this._tri = new Sprite(); addChild(_tri); _handle=new Sprite(); _handle.buttonMode=true; addChild(_handle); _handle.addEventListener(MouseEvent.MOUSE_DOWN, MouseDownHandler); draw(); updatePosition(); } private function draw():void { drawBack(); drawHandle(); drawProgress(); drawTriBack(); } //画三角形背景 private function drawTriBack():void { _tri.graphics.clear(); if (this._showTri && _backWidth>_backHeight) { _back.graphics.clear(); _progress.graphics.clear(); //画整体背景 _tri.graphics.beginFill(_backColor); _tri.graphics.lineStyle(0, _backBorderColor); _tri.graphics.moveTo(0,_backHeight); _tri.graphics.lineTo(_backWidth,_backHeight); _tri.graphics.lineTo(_backWidth,0); _tri.graphics.lineTo(0,_backHeight); _tri.graphics.endFill(); _tri.y = _handleHeight - _backHeight -1; //画高亮部分 _tri.graphics.beginFill(this._triHighlightColor); _tri.graphics.moveTo(0,_backHeight); _tri.graphics.lineTo(_handle.x,_backHeight); _tri.graphics.lineTo(_handle.x,_backHeight - _handle.x*_backHeight/_backWidth); _tri.graphics.lineTo(0,_backHeight); _tri.graphics.endFill(); } } private function drawBack():void { _back.graphics.clear(); _back.graphics.beginFill(_backColor); _back.graphics.lineStyle(0, _backBorderColor); _back.graphics.drawRect(0, 0, _backWidth, _backHeight); _back.graphics.endFill(); } private function drawProgress():void { _progress.graphics.clear(); if (this._showProgress) { _progress.graphics.beginFill(this._progressColor); _progress.graphics.drawRect(1, 1, _backWidth - 2, _backHeight - 2); _progress.graphics.endFill(); } } private function drawHandle():void { _handle.graphics.clear(); _handle.graphics.beginFill(_handleColor); _handle.graphics.lineStyle(0, _handleBorderColor); _handle.graphics.drawRect(0, 0, _handleWidth, _handleHeight); _handle.graphics.endFill(); if (_backWidth > _backHeight) { //水平 _handle.x=0; _back.y=_handleHeight / 2 - _backHeight / 2; if (this._showProgress) { this._progress.y=_back.y; } } else { //垂直 _handle.x=_back.width / 2 - _handle.width / 2; _handle.y=0; } } private function updatePosition():void { var handleRange:Number=_backHeight - _handleHeight; var valueRange:Number=_max - _min; if (_backWidth > _backHeight) { //水平 handleRange=_backWidth - _handleWidth; _handle.x=((_value - _min) / valueRange) * handleRange; if (this._showTri){ this.drawTriBack(); } } else { //垂直 _handle.y=handleRange - ((_value - _min) / valueRange) * handleRange; } } private function updateValue():void { var handleRange:Number=_backHeight - _handleHeight; var valueRange:Number=_max - _min; if (_backWidth > _backHeight) { //水平 handleRange=_backWidth - _handleWidth; _value=(_handle.x / handleRange) * valueRange + _min; if (this._showTri){ this.drawTriBack(); } //trace(_handle.x); } else { //垂直 _value=(handleRange - _handle.y) / handleRange * valueRange + _min; } dispatchEvent(new Event(Event.CHANGE)); } private function MouseUpHandler(e:MouseEvent):void { stage.removeEventListener(MouseEvent.MOUSE_MOVE, MouseMoveHandler); stage.removeEventListener(MouseEvent.MOUSE_UP, MouseUpHandler); _handle.stopDrag(); } private function MouseDownHandler(e:MouseEvent):void { stage.addEventListener(MouseEvent.MOUSE_MOVE, MouseMoveHandler); stage.addEventListener(MouseEvent.MOUSE_UP, MouseUpHandler); //垂直滑块 if (_backWidth < _backHeight) { _handle.startDrag(false, new Rectangle(_handle.x, 0, 0, _backHeight - _handleHeight)); } else { //水平滑块 _handle.startDrag(false, new Rectangle(0, 0, _backWidth - _handleWidth, 0)); } } private function MouseMoveHandler(e:MouseEvent):void { updateValue(); } public function move(x:Number, y:Number):void { this.x=x; this.y=y; } public function set backBorderColor(n:uint):void { _backBorderColor=n; draw(); } public function get backBorderColor():uint { return _backBorderColor; } public function set backColor(n:uint):void { _backColor=n; draw(); } public function get backColor():uint { return _backColor; } public function set handleBorderColor(n:uint):void { _handleBorderColor=n; draw(); } public function get handleBorderColor():uint { return _handleBorderColor; } public function set handleColor(n:uint):void { _handleColor=n; draw(); } public function get handleColor():uint { return _handleColor; } //设置最大值 public function set max(n:Number):void { _max=n; updatePosition(); } //获取最大值 public function get max():Number { return _max; } //设置最小值 public function set min(n:Number):void { _min=n; updatePosition(); } //获取最大值 public function get min():Number { return _min; } //设置滑块当前值 public function set value(n:Number):void { _value=n; _value=Math.min(_max, Math.max(_value, _min)); updatePosition(); } //获取滑块当前值 public function get value():Number { return _value; } //设置滑块宽度 public function set handleWidth(n:Number):void { _handleWidth=n; draw(); } //获取滑块宽度 public function get handleWidth():Number { return _handleWidth; } //设置背景高度 public function set backHeight(n:Number):void { _backHeight=n; draw(); } //获取背景高度 public function get backHeight():Number { return _backHeight; } //设置滑块高度 public function set handleHeight(n:Number):void { _handleHeight=n; draw(); updatePosition(); } //获取滑块高度 public function get handleHeight():Number { return _handleHeight; } //设置背景宽度 public function set backWidth(n:Number):void { _backWidth=n; draw(); } //设置背景宽度 public function get backWidth():Number { return _backWidth; } public function set progressValue(v:uint):void { if (v >= 100) { v=100; } else if (v <= 0) { v=0; } this._progressValue=v; if (this._showProgress) { this._progress.width=(_backWidth - 2) * _progressValue / 100; } } public function get progressValue():uint { return this._progressValue; } public function set progressColor(v:uint):void { this._progressColor=v; drawProgress(); } public function get progressColor():uint { return this._progressColor; } public function set showProgress(v:Boolean):void { this._showProgress=v; drawProgress(); } public function get showProgress():Boolean { return this._showProgress; } public function set showTri(v:Boolean):void { this._showTri=v; this.drawTriBack(); } public function get showTri():Boolean { return this._showTri; } } }