AS3.0实现自定义滚动条（滚动内容可以为Sprite或MovieClip等），修改属性类型即可！

效果演示：

源码：

Scrollbar.as

 

  1 package ui
  2 {
  3     import flash.display.Sprite;
  4     import flash.events.MouseEvent;
  5     import flash.events.Event;
  6     import ui.ListenManager;
  7     import flash.geom.Rectangle;
  8 
  9     public class Scrollbar extends Sprite
 10     {
 11         public var obj:Sprite;//需进行滚动的对象
 12         public var scrollmask:Sprite;//遮罩对象
 13         public var scrollheight:Number;//滚动条高度
 14         public var scrolltextnum:int;//文本显示行数
 15         public var textspeed:int;//文本滚动速度（行/像素）
 16         public var Scroll:Sprite;//自定义滚动条对象
 17         public var bar:Sprite;//滑块
 18         public var up:Sprite;//向上按钮
 19         public var down:Sprite;//向下按钮
 20         public var bg:Sprite;//滑槽
 21         public var displayobject:*;//接受stage，必须传入
 22         public var num:int;//计算滑块高度所用
 23 
 24         private var bars:Number;//滑块可滑动距离
 25         private var rect:Rectangle;//滑块可拖动范围
 26         private var i:int = 0;
 27         private var n:Number;
 28         private var listenmanager:ListenManager = new ListenManager();///监听管理器
 29         ////构造器函数/////
 30         public function Scrollbar():void
 31         {
 32         }
 33         /////初始化函数/////
 34         public function init():void
 35         {
 36             if (checkhide())
 37             {
 38                 addEventListeners();
 39             }
 40             else
 41             {
 42                 bar.visible = false;
 43             }
 44             setxy();
 45         }
 46         ///判断是否显示滚动条等///
 47         private function checkhide():Boolean
 48         {
 49             if (Scroll != null)
 50             {
 51                 if (obj.height <= scrollmask.height)
 52                 {
 53                     return false;
 54                 }
 55                 return true;
 56             }
 57             return false;
 58         }
 59         ///设置滚动条高度，对象遮罩等////
 60         private function setxy():void
 61         {
 62             up.y = 1;
 63             bg.y = up.height;
 64             bar.x = 1.2;
 65             bar.y = bg.y;
 66             if (bar.height >= 10)
 67             {
 68                 n = (obj.height - scrollmask.height)/(num+20);
 69                 bar.height = scrollmask.height - (obj.height - scrollmask.height)/n;
 70             }
 71             bg.height = scrollheight;
 72             down.y = bg.y + bg.height;
 73             bars = bg.height - bar.height;
 74             obj.mask = scrollmask;
 75             rect = new Rectangle(bar.x,bg.y,0,bg.height - bar.height);
 76         }
 77         ///当被滚动对象更新时，而需要改变滚动条状态，调用此方法///
 78         public function update(num:int):void
 79         {
 80             if (checkhide())
 81             {
 82                 i++;
 83                 if (bar.height >= 10)
 84                 {
 85                     n = (obj.height - scrollmask.height)/(num+20);
 86                     bar.height = scrollmask.height - (obj.height - scrollmask.height)/n;
 87                 }
 88                 bar.y = bg.y + bg.height - bar.height;
 89                 bar.y +=  bars * textspeed /(obj.height - scrollmask.height);
 90                 obj.y = scrollmask.y - obj.height + scrollmask.height;
 91                 objrun(textspeed);
 92                 updatebar();
 93                 bars = bg.height - bar.height;
 94                 rect = new Rectangle(bar.x,bg.y,0,bg.height - bar.height);
 95                 if (i == 1)
 96                 {
 97                     bar.visible = true;
 98                     addEventListeners();
 99                 }
100             }
101         }
102         ///为滚动条添加监听事件////
103         private function addEventListeners():void
104         {
105             listenmanager.fcn_add(bar,MouseEvent.MOUSE_DOWN,barclick);
106             listenmanager.fcn_add(bar,MouseEvent.MOUSE_UP,barup);
107             listenmanager.fcn_add(displayobject,MouseEvent.MOUSE_UP,barup);
108             listenmanager.fcn_add(up,MouseEvent.MOUSE_DOWN,upclick);
109             listenmanager.fcn_add(down,MouseEvent.MOUSE_DOWN,downclick);
110             listenmanager.fcn_add(Scroll,MouseEvent.MOUSE_WHEEL,mousewheel);
111             listenmanager.fcn_add(obj,MouseEvent.MOUSE_WHEEL,mousewheel);
112         }
113         ///鼠标点击滑块方法///;
114         private function barclick(evt:MouseEvent):void
115         {
116             bar.startDrag(false,rect);
117             listenmanager.fcn_add(bar,Event.ENTER_FRAME,bar_enter_frame);
118         }
119         ///鼠标点击滑块释放方法///;
120         private function barup(evt:MouseEvent):void
121         {
122             bar.stopDrag();
123             delevent();
124         }
125         ///鼠标点击向上按钮方法///
126         private function upclick(evt:MouseEvent):void
127         {
128             if (checkbar())
129             {
130                 bar.y -= bars * textspeed /(obj.height-scrollmask.height);//滑块移动的距离=滚动对象滚动的像素*滑块可移动的总距离/(被滚动对象的高度-遮罩的高度（即显示范围的高度))
131                 objrun(0-textspeed);
132                 //调用方法移动对象;
133                 updatebar();//校正滑块位置
134             }
135         }
136         ///鼠标点击向下按钮方法///
137         private function downclick(evt:MouseEvent):void
138         {
139             if (checkbar())
140             {
141                 bar.y +=  bars * textspeed /(obj.height - scrollmask.height);
142                 objrun(textspeed);
143                 updatebar();
144             }
145         }
146         ///鼠标滑轮事件///
147         private function mousewheel(evt:MouseEvent):void
148         {
149             if (evt.delta > 0)
150             {
151                 if (checkbar())
152                 {
153                     bar.y -=  bars * textspeed /(obj.height - scrollmask.height);
154                     objrun(-textspeed);
155                     updatebar();
156                 }
157             }
158             else
159             {
160                 if (checkbar())
161                 {
162                     bar.y +=  bars * textspeed /(obj.height - scrollmask.height);
163                     objrun(textspeed);
164                     updatebar();
165                 }
166             }
167         }
168         private function bar_enter_frame(evt:Event):void
169         {
170             obj.y = scrollmask.y - (bar.y - bg.y)*(obj.height - scrollmask.height)/bars;
171             if (obj.y > scrollmask.y)
172             {
173                 obj.y = scrollmask.y;
174             }
175             else if (obj.y < (scrollmask.y - obj.height + scrollmask.height))
176             {
177                 obj.y = scrollmask.y - obj.height + scrollmask.height;
178             }
179         }
180         private function objrun(i:Number):void
181         {
182             obj.y -=  i;
183             if (obj.y > scrollmask.y)
184             {
185                 obj.y = scrollmask.y;
186             }
187             else if (obj.y < (scrollmask.y - obj.height + scrollmask.height))
188             {
189                 obj.y = scrollmask.y - obj.height + scrollmask.height;
190             }
191         }
192         private function checkbar():Boolean
193         {
194             if (bar.y >= bg.y && bar.y <= (bars + bg.y))
195             {
196                 return true;
197             }
198             return false;
199         }
200         ///删除卸载事件侦听///
201         private function updatebar():void
202         {
203             if (bar.y < bg.y)
204             {
205                 bar.y = bg.y;
206             }
207             else if (bar.y >(bg.y + bg.height - bar.height))
208             {
209                 bar.y = bg.y + bg.height - bar.height;
210             }
211         }
212         private function delevent():void
213         {
214             listenmanager.fcn_del(bar,Event.ENTER_FRAME,bar_enter_frame);
215         }
216     }
217 }

ListenManager.as

 

 1 package ui
 2 {
 3     import flash.display.Sprite;
 4     public class ListenManager extends Sprite
 5     {
 6         public function ListenManager()
 7         {
 8 
 9         }
10         public function fcn_add(obj:*,_type:String,fcn:Function):void
11         {
12             obj.addEventListener(_type,fcn);
13         }
14         public function fcn_del(obj:*,_type:String,fcn:Function):void
15         {
16             obj.removeEventListener(_type,fcn);
17         }
18     }
19 }

 

loader.as

 

 1 package ui
 2 {
 3     import flash.display.Loader;
 4     public class loader extends Loader
 5     {
 6         private var Name:String;
 7         public function loader():void
 8         {
 9         }
10         public function get Names():String
11         {
12             return Name;
13         }
14         public function set Names(myname:String):void
15         {
16             Name = myname;
17         }
18     }
19 }

 

simple.as

 

  1 package ui
  2 {
  3     import flash.display.Sprite;
  4     import flash.display.SimpleButton;
  5     import flash.text.TextField;
  6     import flash.text.TextFormat;
  7     import flash.text.TextFieldAutoSize;
  8 
  9     public class simple extends Sprite
 10     {
 11         private var btnw:Number;
 12         private var btnh:Number;
 13         private var downcolor:uint;
 14         private var upcolor:uint;
 15         private var overcolor:uint;
 16         private var lineStly:Boolean;
 17         public function simple():void
 18         {
 19 
 20         }
 21         public function getsimplebtn(str:String,btnw:Number = 50,btnh:Number = 30,downcolor:uint = 0x990066,upcolor:uint = 0xffffff,overcolor:uint = 0x666666,lineStly:Boolean = false):SimpleButton
 22         {
 23             this.name = str;
 24             this.btnw = btnw;
 25             this.btnh = btnh;
 26             this.downcolor = downcolor;
 27             this.upcolor = upcolor;
 28             this.overcolor = overcolor;
 29             this.lineStly = lineStly;
 30             var btn:SimpleButton = new SimpleButton();
 31             btn.downState = downbtn();
 32             btn.upState = upbtn();
 33             btn.overState = overbtn();
 34             btn.hitTestState = hitbtn();
 35             return btn;
 36         }
 37         private function hitbtn():Sprite
 38         {
 39             var sprite:Sprite = new Sprite();
 40             sprite.graphics.beginFill(upcolor);
 41             sprite.graphics.drawRect(0,0,btnw,btnh);
 42             sprite.graphics.endFill();
 43             return sprite;
 44         }
 45         private function downbtn():Sprite
 46         {
 47             var txt:TextField = txtstr(this.name);
 48             var sprite:Sprite = DrawSprite(1);
 49             sprite.addChild(txt);
 50             return sprite;
 51         }
 52         private function upbtn():Sprite
 53         {
 54             var txt:TextField = txtstr(this.name);
 55             var sprite:Sprite = DrawSprite(0);
 56             sprite.addChild(txt);
 57             return sprite;
 58         }
 59         private function overbtn():Sprite
 60         {
 61             var txt:TextField = txtstr(this.name);
 62             var sprite:Sprite = DrawSprite(2);
 63             sprite.addChild(txt);
 64             return sprite;
 65         }
 66         private function txtstr(str:String):TextField
 67         {
 68             var txt:TextField = new TextField();
 69             var format:TextFormat = new TextFormat();
 70             format.font = "Verdana";
 71             format.size = 12;
 72             txt.autoSize = TextFieldAutoSize.LEFT;
 73             txt.text = str;
 74             txt.setTextFormat(format);
 75             return txt;
 76         }
 77         private function DrawSprite(n:int):Sprite
 78         {
 79             var sprite:Sprite = new Sprite();
 80             if (n == 0)
 81             {
 82                 sprite.graphics.beginFill(upcolor);
 83             }
 84             else if (n == 1)
 85             {
 86                 sprite.graphics.beginFill(downcolor);
 87             }
 88             else if (n == 2)
 89             {
 90                 sprite.graphics.beginFill(overcolor);
 91             }
 92             if(lineStly)
 93             {
 94                 sprite.graphics.lineStyle(1,0x660099);
 95             }
 96             sprite.graphics.drawRect(0,0,btnw,btnh);
 97             sprite.graphics.endFill();
 98             return sprite;
 99         }
100     }
101 }

文档类:Main.as

 

  1 package 
  2 {
  3     import flash.display.Sprite;
  4     import ui.simple;
  5     import ui.Scrollbar;
  6     import flash.display.SimpleButton;
  7     import flash.events.MouseEvent;
  8     import flash.display.Shape;
  9     import flash.net.URLLoader;
 10     import flash.events.Event;
 11     import flash.net.URLRequest;
 12     import ui.loader;
 13     import flash.display.Bitmap;
 14     import flash.text.TextField;
 15 
 16     public class Main extends Sprite
 17     {
 18         private var backbox:Sprite = new Sprite();
 19         private var sprite:Sprite = new Sprite();
 20         private var scrollcont:Sprite = new Sprite();
 21         private var i:int = 0;
 22         private var j:int = -1;
 23         private var num:int;
 24         private var bg:Sprite = new Sprite();
 25         private var bar:Sprite = new Sprite();
 26         private var up:Sprite = new Sprite();
 27         private var down:Sprite = new Sprite();
 28         private var listscroll:Scrollbar = new Scrollbar();
 29         public function Main():void
 30         {
 31             init();
 32         }
 33         private function init():void
 34         {
 35             var urlloader:URLLoader = new URLLoader();
 36             urlloader.addEventListener(Event.COMPLETE,com);
 37             urlloader.load(new URLRequest("https://files.cnblogs.com/zhoujunfeng2011/Pictures/data.xml"));
 38         }
 39         private function com(evt:Event):void
 40         {
 41             var myxml:XML = new XML(evt.target.data);
 42             num = myxml.child("pic").length();
 43             for (var i:int =0; i<num; i++)
 44             {
 45                 var myloader:loader = new loader();
 46                 myloader.contentLoaderInfo.addEventListener(Event.COMPLETE,piccom);
 47                 myloader.load(new URLRequest(myxml.child("pic")[i].@url));
 48                 myloader.Names = myxml.child("pic")[i]. @ name;
 49             }
 50         }
 51         private function piccom(evt:Event):void
 52         {
 53             j++;
 54             var myloader:loader = loader(evt.target.loader);
 55             var bitmap:Bitmap = Bitmap(myloader.content);
 56             var sprite:Sprite = new Sprite();
 57             sprite.addChild(bitmap);
 58             switch (myloader.Names)
 59             {
 60                 case "滑块" :
 61                     bar = sprite;
 62                     break;
 63                 case "滑槽" :
 64                     bg = sprite;
 65                     break;
 66                 case "向上" :
 67                     up = sprite;
 68                     break;
 69                 case "向下" :
 70                     down = sprite;
 71                     break;
 72             }
 73             if (j == num-1)
 74             {
 75                 uiinit();
 76             }
 77         }
 78         private function uiinit():void
 79         {
 80             var btn:simple = new simple();
 81             var spmask:Sprite = new Sprite();
 82             var Test_btn:SimpleButton;
 83             backbox.graphics.beginFill(0xffffff);
 84             backbox.graphics.lineStyle(1,0x660099);
 85             backbox.graphics.drawRect(0,0,200,241);
 86             backbox.graphics.endFill();
 87             backbox.y = 10;
 88             addChild(backbox);
 89             scrollcont.x = backbox.width - 14;
 90             scrollcont.y = backbox.y;
 91             addChild(scrollcont);
 92             down.y = scrollcont.y;
 93             scrollcont.addChild(down);
 94             scrollcont.addChild(bg);
 95             scrollcont.addChild(up);
 96             scrollcont.addChild(bar);
 97             spmask.graphics.beginFill(0x000000);
 98             spmask.graphics.drawRect(0,0,backbox.width,backbox.height);
 99             spmask.graphics.endFill();
100             backbox.addChild(sprite);
101             backbox.addChild(spmask);
102             Test_btn = btn.getsimplebtn("点击添加",60,30,0xff00cc,0xcc00cc,0x9900cc);
103             Test_btn.x = 65;
104             Test_btn.y = backbox.height + 15;
105             this.addChild(Test_btn);
106             for (i; i< 120; i++)
107             {
108                 var sbtn:simple = new simple();
109                 var sp:SimpleButton;
110                 var str:String = i + 1 + " this is Testing!";
111                 sp = sbtn.getsimplebtn(str,185,20,0x990099,0x66ffff,0x99ffff,true);
112                 sp.x = 1;
113                 sp.y = i * 20;
114                 sprite.addChild(sp);
115             }
116             listscroll.displayobject = this.stage;
117             listscroll.obj = sprite;
118             listscroll.scrollmask = spmask;
119             listscroll.textspeed = 20;
120             listscroll.Scroll = scrollcont;
121             listscroll.scrollheight = 212;
122             listscroll.up = up;
123             listscroll.down = down;
124             listscroll.bg = bg;
125             listscroll.bar = bar;
126             listscroll.num = i;
127             listscroll.init();
128             Test_btn.addEventListener(MouseEvent.CLICK,Testbtn_click);
129         }
130         private function Testbtn_click(evt:MouseEvent):void
131         {
132             var sbtn:simple = new simple();
133             var sp:SimpleButton;
134             var str:String = i + 1 + " this is Testing!";
135             sp = sbtn.getsimplebtn(str,185,20,0x990099,0x66ffff,0x99ffff,true);
136             sp.x = 1;
137             sp.y = i * 20;
138             sprite.addChild(sp);
139             listscroll.update(i);
140             i++;
141         }
142     }
143 }

为图方便所以使用了SimpleButton类型作为列表中的内容，，有些算法都是从网上收集起来的，不过稍改了下，希望会对你有帮助，代码有点乱，看了后希望点评下，谢谢！最后加上XML内容：

 

1 <?xml version="1.0" encoding="utf-8"?>
2 <data>
3     <pic name="滑槽" url="https://files.cnblogs.com/zhoujunfeng2011/Pictures/bg.png"/>
4     <pic name="向上" url="https://files.cnblogs.com/zhoujunfeng2011/Pictures/up.png"/>
5     <pic name="向下" url="https://files.cnblogs.com/zhoujunfeng2011/Pictures/down.png"/>
6     <pic name="滑块" url="https://files.cnblogs.com/zhoujunfeng2011/Pictures/bar.png"/>
7 </data>