AS3.0写的一个滚动条【缓动效果】

阅读更多

package
{
    import flash.display.MovieClip;
    import flash.events.MouseEvent;
    import flash.events.Event;
    import flash.geom.Rectangle;
    
    public class myScrollBar extends MovieClip
    {
        
        private var moveSpeed:Number = 5;//滚动速度
        private var easingSpeed:Number = 4.5;//缓动速度

        private var contentName:MovieClip;
        private var maskViewName:MovieClip;
        
        /*需要用到的变量来计算拖动值*/
        private var scrollable:Number;
        private var scrollHeight:Number;
        private var top_scroll:Number;

        private var rx:Number;
        private var ry:Number;
        private var rwidth:Number;
        private var rheight:Number;
        
        private var easing:Boolean = true;
        
        public function myScrollBar ()
        {
            init();
        }
        //定义滚动控制影片的位置
        public function init ()
        {
            /*在此修改遮罩名:maskMc 和 被遮罩[内容]名:contentMc*/
            maskViewName = MovieClip(parent).maskMc
            contentName = MovieClip(parent).contentMc
            
            //设置遮罩
            contentName.mask = maskViewName
            
            //强制固定可控制元件的所有属性
            upBtn.y = maskViewName.y;//向上滚动按钮的位置
            
            downBtn.x = upBtn.x;
            
            scrollBg.x = upBtn.x;
            scrollBg.y = upBtn.y + upBtn.height;//滚动背景的y坐标
            scrollBg.height = downBtn.y - upBtn.height - upBtn.y;//滚动背景的高度
            
            dragBar.x = upBtn.x;
            dragBar.y = upBtn.y + upBtn.height;
            
            scrollHeight = scrollBg.height
            scrollable = contentName.height - maskViewName.height;
            top_scroll = contentName.y;
            
            //滑块可拖动的区域
            rx = scrollBg.x;
            ry = upBtn.y+upBtn.height;
            rwidth = 0;
            rheight = scrollBg.height - dragBar.height+1;
            
            //在开始前检测我们的滚动是否可滚动，如果内容不足滚动，隐藏dragger等，并返回。
            if (scrollable < 0)
            {
                dragBar.visible = false;
                return;
            }
            myBtnEvent()
            updateContentPos ()
        }
        //更新滚动内容的位置。公式的应用
        private function updateContentPos ()
        {
            var percent_scrolled:Number=(dragBar.y - upBtn.height) / (scrollHeight - dragBar.height);
            contentName.newY = Math.round(top_scroll -(scrollable * percent_scrolled));
            //contentName.y=Math.round(top_scroll - (scrollable * percent_scrolled));
            
            //缓动效果
            contentName.addEventListener(Event.ENTER_FRAME,easingFunc)
        }
        private function easingFunc(event:Event)
        {
            if(!easing)
             {
                 event.target.y = event.target.newY
             }
             else
             {
                 event.target.y += (event.target.newY-event.target.y)/easingSpeed
             }
        }
        
        //滚动按钮事件
        private function myBtnEvent()
        {
            upBtn.addEventListener(MouseEvent.MOUSE_DOWN,upBtnDownFunc) //向上按钮鼠标按下事件
            dragBar.addEventListener(MouseEvent.MOUSE_DOWN,dragBarDownFunc) //滑块按钮鼠标按下事件
            downBtn.addEventListener(MouseEvent.MOUSE_DOWN,downBtnDownFunc) //向下按钮鼠标按下事件
        }
        
        
        //向上按钮
        private function upBtnDownFunc(event:Event)
        {
            event.target.addEventListener(Event.ENTER_FRAME,upBtnMoveFunc);
            event.target.addEventListener(MouseEvent.MOUSE_UP,upBtnUpFunc);
            event.target.addEventListener(MouseEvent.MOUSE_OUT,upBtnOutFunc);
        }
        private function upBtnMoveFunc(event:Event)
        {
            dragBar.y = Math.max (ry, dragBar.y - moveSpeed);
            updateContentPos ()
        }
        private function upBtnUpFunc(event:Event)
        {
            event.target.removeEventListener(Event.ENTER_FRAME,upBtnMoveFunc);
        }
        private function upBtnOutFunc(event:MouseEvent)
        {
            event.target.removeEventListener(Event.ENTER_FRAME,upBtnMoveFunc);
        }
        
        //向下按钮
        private function downBtnDownFunc(event:Event)
        {
            event.target.addEventListener(Event.ENTER_FRAME,downBtnMoveFunc);
            event.target.addEventListener(MouseEvent.MOUSE_UP,downBtnUpFunc);
            event.target.addEventListener(MouseEvent.MOUSE_OUT,downBtnOutFunc);
        }
        private function downBtnMoveFunc(event:Event)
        {
            dragBar.y = Math.min (rheight+event.target.height, dragBar.y + moveSpeed);
            updateContentPos ()
        }
        private function downBtnUpFunc(event:Event)
        {
            event.target.removeEventListener(Event.ENTER_FRAME,downBtnMoveFunc);
        }
        private function downBtnOutFunc(event:Event)
        {
            event.target.removeEventListener(Event.ENTER_FRAME,downBtnMoveFunc);
        }
        
        //滑块事件
        private function dragBarDownFunc(event:Event)
        {
            var rec:Rectangle = new Rectangle(rx,ry,rwidth,rheight);
            event.target.startDrag(false,rec)
            event.target.addEventListener(MouseEvent.MOUSE_MOVE,dragBarEnterFunc) //滑块按钮鼠标松开事件
            
            event.target.addEventListener(MouseEvent.MOUSE_UP,dragBarUpFunc) //滑块按钮鼠标松开事件
            event.target.addEventListener(MouseEvent.MOUSE_OUT,dragBarOutFunc)
        }
        private function dragBarUpFunc(event:Event)
        {
            event.target.stopDrag();
            event.target.removeEventListener(MouseEvent.MOUSE_MOVE,dragBarEnterFunc);
        }
        private function dragBarOutFunc(event:Event)
        {
            event.target.stopDrag();
            event.target.removeEventListener(MouseEvent.MOUSE_OUT,dragBarEnterFunc);
        }
        private function dragBarEnterFunc(event:Event)
        {
            updateContentPos ()
        }
        
    }
}