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 ()
        }
        
    }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是一个简单的示例代码,实现了控制音乐播放进度的滚动条: ``` import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; import flash.media.Sound; import flash.media.SoundChannel; import flash.net.URLRequest; // 加载音乐文件 var sound:Sound = new Sound(); sound.load(new URLRequest("music.mp3")); // 创建滚动条和进度条 var scrollBar:Sprite = new Sprite(); var progressBar:Sprite = new Sprite(); scrollBar.graphics.lineStyle(1, 0x000000); scrollBar.graphics.beginFill(0xFFFFFF); scrollBar.graphics.drawRect(0, 0, 200, 10); scrollBar.graphics.endFill(); progressBar.graphics.beginFill(0x0000FF); progressBar.graphics.drawRect(0, 0, 0, 10); progressBar.graphics.endFill(); scrollBar.addChild(progressBar); addChild(scrollBar); // 设置滚动条的位置和大小 scrollBar.x = 100; scrollBar.y = 100; // 播放音乐 var channel:SoundChannel; channel = sound.play(); // 监听滚动条拖动事件 scrollBar.addEventListener(MouseEvent.MOUSE_DOWN, onScrollBarMouseDown); function onScrollBarMouseDown(event:MouseEvent):void { // 监听舞台鼠标移动和松开事件 stage.addEventListener(MouseEvent.MOUSE_MOVE, onStageMouseMove); stage.addEventListener(MouseEvent.MOUSE_UP, onStageMouseUp); } function onStageMouseMove(event:MouseEvent):void { // 计算进度条的宽度 var progressWidth:Number = mouseX - scrollBar.x; if (progressWidth < 0) { progressWidth = 0; } else if (progressWidth > scrollBar.width) { progressWidth = scrollBar.width; } // 更新进度条的宽度 progressBar.width = progressWidth; // 计算音乐播放的位置 var position:Number = progressWidth / scrollBar.width * sound.length; // 跳转音乐播放位置 channel.stop(); channel = sound.play(position); } function onStageMouseUp(event:MouseEvent):void { // 移除鼠标移动和松开事件的监听 stage.removeEventListener(MouseEvent.MOUSE_MOVE, onStageMouseMove); stage.removeEventListener(MouseEvent.MOUSE_UP, onStageMouseUp); } // 监听音乐播放事件,更新进度条的位置 channel.addEventListener(Event.SOUND_COMPLETE, onSoundComplete); function onSoundComplete(event:Event):void { // 重置进度条和音乐播放位置 progressBar.width = 0; channel.stop(); channel = sound.play(); } ``` 在上面的代码中,我们首先加载了一个音乐文件,并创建了一个滚动条和进度条。滚动条的拖动事件被监听,当拖动滚动条时,进度条的宽度会随之改变,并根据进度条的宽度计算音乐播放的位置,然后跳转到该位置继续播放音乐。同时,我们还监听了音乐播放事件,在音乐播放完成后重置进度条和音乐播放位置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值