Flash/Flex学习笔记(36)：自己动手实现一个滑块控件(JimmySilder)

package Jimmy.Event {
	import flash.events.Event;

	public class ValueChangeEvent extends Event {		
		public static const VALUE_CHANGE:String = "VALUE_CHANGE";		
		private var _OldValue:Number,_NewValue:Number;
		
		public function ValueChangeEvent(eventType:String,oldValue:Number,newValue:Number){
			this._OldValue = oldValue;
			this._NewValue = newValue;
			super(eventType);
		}
		
		public function get OldValue():Number{
			return _OldValue;
		}
		
		public function get NewValue():Number{
			return _NewValue;
		}
	}
}

//滑块控件 beta 0.001 -- by 菩提树下的杨过 http://yjmyzz.cnblogs.com/
package {
	import flash.display.Sprite;
	import flash.display.MovieClip;
	import flash.events.MouseEvent;
	import flash.ui.Mouse;
	import flash.events.Event;
	import flash.ui.MouseCursor;
	import flash.geom.Rectangle;
	import Jimmy.Event.ValueChangeEvent;

	public class JimmySilder extends MovieClip {

		private var _btnWidth:uint;//滑块宽度
		private var _btnHeight:uint;//滑块高度
		private var _barWidth:uint;//滑块背景条宽度
		private var _barHeight:uint;//滑块背景条高度
		private var _isDragging:Boolean=false;//是否正在拖动
		private var _value:Number=0.0;//滑块的值(百分比)

		public function JimmySilder(btnWidth:uint = 10,btnHeight:uint = 30,barWidth:uint=200,barHeight:uint=10,v:Number=0.5):void {

			//trace("JimmySilder's constructor is called.");

			this._btnWidth=btnWidth;
			this._btnHeight=btnHeight;
			this._barWidth=barWidth;
			this._barHeight=barHeight;

			init();

			this.Value=v;
			
			this.addEventListener(Event.ADDED_TO_STAGE,AddedToStage);
			
			
		}
		
		private function AddedToStage(e:Event):void{
			this.stage.addEventListener(MouseEvent.MOUSE_MOVE,stageMouseMoveHandler);
			this.stage.addEventListener(MouseEvent.MOUSE_UP,stageMouseUpHandler);
		}

		//属性Value的setter方法
		public function set Value(v:Number):void {
			if (v<=0) {
				v=0.0;
			}
			if (v>=1) {
				v=1.0;
			}
			this._value=v;
			this._mcBtn.x = _mcBar.width/(-2) + _mcBar.width * _value;//根据value百分比值来定位mcBtn的横坐标
		}

		//属性Value的getter方法
		public function get Value():Number {
			return _value;
		}
		
		//初始化
		private function init():void {
			this._mcBtn.width=_btnWidth;
			this._mcBtn.height=_btnHeight;
			this._mcBar.width=_barWidth;
			this._mcBar.height=_barHeight;

			this._mcBtn.addEventListener(MouseEvent.MOUSE_OVER, mcBtnMouseOverHandler);
			this._mcBtn.addEventListener(MouseEvent.MOUSE_OUT, mcBtnMouseOutHandler);
			this._mcBtn.addEventListener(MouseEvent.MOUSE_DOWN,mcBtnMouseDownHandler);			

			this._mcBar.addEventListener(MouseEvent.MOUSE_DOWN,mcBarMouseDownHandler);
			//trace("init 初始化完成");
		}
		
		//切换光标为手形
		private function mcBtnMouseOverHandler(e:MouseEvent) {
			Mouse.cursor=MouseCursor.HAND;
		}

		//切换光标为系统光标
		private function mcBtnMouseOutHandler(e:MouseEvent) {
			Mouse.cursor=MouseCursor.AUTO;
		}

		//开始拖动
		private function mcBtnMouseDownHandler(e:MouseEvent) {
			//trace("开始拖动");
			_mcBtn.startDrag(true,new Rectangle(_mcBar.width/(-2),0,_mcBar.width,0));//注意：这里锁定中心在指定区域拖动
			_isDragging=true;
		}

		//停止拖动
		private function stageMouseUpHandler(e:MouseEvent) {
			//trace("停止拖动");
			_mcBtn.stopDrag();
			_isDragging=false;
		}

		//在自身区域上移动时，动态计算_value值
		private function stageMouseMoveHandler(e:MouseEvent) {
			if (_isDragging) {
				RaiseEvent();
				//trace(_value);
			}
		}

		

		//在背景条上点击时，滑块直接跳到该位置
		private function mcBarMouseDownHandler(e:MouseEvent) {
			_mcBtn.x=mouseX;
			RaiseEvent();
		}
		
		//触发事件
		private function RaiseEvent():void {
			var _oldValue:Number=_value;
			_value = (_mcBtn.x + _mcBar.width/2)/_mcBar.width;
			var _valueChangeEvent:ValueChangeEvent=new ValueChangeEvent(ValueChangeEvent.VALUE_CHANGE,_oldValue,_value);
			dispatchEvent(_valueChangeEvent);//触发事件  
		}
	}
}

import Jimmy.Event.ValueChangeEvent;

var silder:JimmySilder = new JimmySilder();

silder.width = 200;
silder.height = 20;
silder.x = stage.stageWidth/2;
silder.y = 200;

//trace(silder.Value);

addChild(silder);

silder.addEventListener(ValueChangeEvent.VALUE_CHANGE, ValueChangeHandler);

testObj.scaleX = testObj.scaleY = silder.Value;

testObj2.rotation = silder.Value * 360;

function ValueChangeHandler(e:ValueChangeEvent){
	//trace("当前滑块的值是：" + e.NewValue);	
	testObj.scaleX = testObj.scaleY = e.NewValue;
	
	testObj2.rotation = silder.Value * 360;
}