最近一直做会议与AS3有关项目
今天花了点时间写了一个可以选择套皮肤,或无皮肤AS3.0文本滚动条
不需要皮肤的话,代码会简单的话花一个皮肤
初学,不完美的地方自己可以自己修改。
这里说下套 皮肤方式。
比如我们做一个styleTextScrollBar的皮肤,建一个styleTextScrollBar的影片剪辑然后捆绑上md.UI.styleTextScrollBar,这个类不用写,系统会帮你自动生成,我们只是需要里面一些元件。
分别做四个元件,2个按钮2个影片剪辑
upBtn(SimpleButton);
bottonBtn(SimpleButton);
bgMc(MovieClip)
slipMc:MovieClip;(MovieClip)
然后看类的使用方法吧!
文本滚动条类:
/*
使用方法
//导入mdTextScrollBar组件类
import md.UI.mdTextScrollBar
//库中绑定的皮肤 这个类可以不用写,在库链接写上 md.UI.styleTextScrollBar就会自动生成
import md.UI.styleTextScrollBar
//创建组件
var mdScroll:mdTextScrollBar=new mdTextScrollBar(Text,styleTextScrollBar,300)
addChild(mdScroll)
//说明
//Text:需要绑定的TextField对象,必填
//styleTextScrollBar:需要绑定的皮肤(可选,默认AS3绘制皮肤)
//300:滚动条高度(可选,默认100)
*/
package md.UI{
import flash.display.Sprite;
import flash.display.MovieClip;
import flash.display.SimpleButton;
import flash.text.TextField;
import flash.events.*;
import flash.geom.Rectangle;
import flash.utils.getTimer;
import flash.display.CapsStyle;
import flash.display.LineScaleMode;
public class mdTextScrollBar extends Sprite {
var Text:TextField;
var upBtn:SimpleButton;
var bottonBtn:SimpleButton;
var bgMc:MovieClip;
var slipMc:MovieClip;
var ScrollBarMc:Sprite;
var ScrollBarHeight:Number;
var slipVar:Number;
var slipHeight:Number;
var putTime:uint;
//构造函数
public function mdTextScrollBar(mdText:TextField,...tag) {
Text=mdText;
if (tag.length>0) {
if (tag[0] is Class) {
//有皮肤模式
if (tag[1]==undefined) {
//无设定高度
styleModeInit(tag[0]);
} else {
//有设定高度
styleModeInit(tag[0],tag[1]);
}
} else if (tag[0] is Number) {
//无皮肤模式
//trace("无皮肤模式,但设置了高度"+tag[0]);
nudityModeInit(tag[0]);
} else {
trace("mdTextScrollBar使用非法参数,启动无皮肤模式");
//无皮肤模式
nudityModeInit();
}
} else {
//无皮肤模式
nudityModeInit();
}
}
//皮肤模式
private function styleModeInit(...tag) {
ScrollBarMc=new tag[0];
addChild(ScrollBarMc);
//初始化皮肤
upBtn=ScrollBarMc.getChildByName("upBtn") as SimpleButton;
bottonBtn=ScrollBarMc.getChildByName("bottonBtn") as SimpleButton;
bgMc=ScrollBarMc.getChildByName("bgMc") as MovieClip;
slipMc=ScrollBarMc.getChildByName("slipMc") as MovieClip;
if (tag[1]!=undefined) {
ScrollBarHeight=tag[1];
} else {
ScrollBarHeight=100;
}
upBtn.y=0;
upBtn.x=0;
bgMc.x=0;
bgMc.y=upBtn.height;
bgMc.height=ScrollBarHeight-upBtn.height-bottonBtn.height;
bottonBtn.x=0;
bottonBtn.y=upBtn.height+bgMc.height;
slipMc.x=0;
slipMc.y=upBtn.height;
slipHeight=bgMc.height-slipMc.height;
ScrollBarMc.visible=false
;
//这里mdScrollBar对象的stage还没被赋值
//trace(mdScrollBar.stage)
addEventListener(Event.ENTER_FRAME, addStageEvent);
}
//裸奔模式,我好心点画套皮肤给他吧
private function nudityModeInit(...tag) {
if (tag[0]!=undefined) {
ScrollBarHeight=tag[0];
} else {
ScrollBarHeight=100;
}
ScrollBarMc=new Sprite();
upBtn=new directionButton(15,1);
bottonBtn=new directionButton(15,2);
bottonBtn.y=ScrollBarHeight-bottonBtn.height
bgMc=new MovieClip()
bgMc.graphics.beginFill(0xcccccc)
bgMc.graphics.drawRect(0,0,15,ScrollBarHeight-upBtn.height-bottonBtn.height)
bgMc.y=upBtn.height
slipMc=new MovieClip()
slipMc.graphics.beginFill(0x999999,0)
slipMc.graphics.drawRect(0,0,15,30)
slipMc.graphics.beginFill(0xeeeeee)
slipMc.graphics.drawRoundRect((15-10)/2,0,10,30,5,5)
slipMc.y=upBtn.height
slipHeight=bgMc.height-slipMc.height;
addChild(ScrollBarMc);
ScrollBarMc.addChild(bgMc);
ScrollBarMc.addChild(upBtn);
ScrollBarMc.addChild(bottonBtn)
ScrollBarMc.addChild(slipMc);
ScrollBarMc.visible=false
addEventListener(Event.ENTER_FRAME, addStageEvent);
}
//加载进场景后初始化事件
private function addStageEvent(event:Event):void {
if (ScrollBarMc.stage!=null) {
//文本滚动与鼠标滚轮
Text.addEventListener(Event.SCROLL, textScroll);
//上滚动按钮
upBtn.addEventListener(MouseEvent.MOUSE_DOWN, upBtnDown);
//下滚动按钮
bottonBtn.addEventListener(MouseEvent.MOUSE_DOWN, bottonBtnDown);
//滑块
slipMc.addEventListener(MouseEvent.MOUSE_DOWN, slipDown);
event.target.removeEventListener(Event.ENTER_FRAME, addStageEvent);
}
}
//文本滚动时候
private function textScroll(event:Event) {
//trace(Text.scrollV+"|"+Text.maxScrollV)
if (Text.maxScrollV != 1) {
ScrollBarMc.visible=true;
slipVar=Text.scrollV/Text.maxScrollV;
if (Text.scrollV!=1) {
slipMc.y=bgMc.y+(slipHeight*slipVar);
} else {
slipMc.y=bgMc.y;
}
} else {
ScrollBarMc.visible=false;
}
}
/*
* 滑块滚动
*/
private function slipDown(event : MouseEvent):void {
//首先取消文本框滚动侦听,因为文本滚动的时候会设置滑块的位置,而此时是通过滑块调整文本的位置,所以会产生冲突
Text.removeEventListener(Event.SCROLL, textScroll);
//限定拖动范围
var dragRect : Rectangle = new Rectangle(slipMc.x, bgMc.y, 0, slipHeight);
slipMc.startDrag(false,dragRect);
ScrollBarMc.addEventListener(Event.ENTER_FRAME, slipMcDownTime);
slipMc.stage.addEventListener(MouseEvent.MOUSE_UP, slipUp);
}
private function slipMcDownTime(event : Event):void {
Text.scrollV=Math.round(((slipMc.y-upBtn.height)/slipHeight)*Text.maxScrollV);
}
private function slipUp(event : MouseEvent):void {
Text.addEventListener(Event.SCROLL, textScroll);
slipMc.stopDrag();
slipMc.stage.removeEventListener(MouseEvent.MOUSE_UP, slipUp);
}
/*
* 上滚动按钮
*/
private function upBtnDown(event : MouseEvent):void {
Text.scrollV--;
if (Text.scrollV>1) {
slipMc.y =bgMc.y+(slipHeight*(Text.scrollV/Text.maxScrollV));
} else {
slipMc.y =bgMc.y;
}
//当鼠标在按钮上按下的时间大于设定时间时,连续滚动
putTime = getTimer();
ScrollBarMc.addEventListener(Event.ENTER_FRAME, upBtnDownTime);
upBtn.stage.addEventListener(MouseEvent.MOUSE_UP, upBtnUp);
}
private function upBtnDownTime(event : Event):void {
if (getTimer() - putTime > 500) {
Text.scrollV--;
if (Text.scrollV>1) {
slipMc.y =bgMc.y+(slipHeight*(Text.scrollV/Text.maxScrollV));
} else {
slipMc.y =bgMc.y;
}
}
}
private function upBtnUp(event : MouseEvent):void {
ScrollBarMc.removeEventListener(Event.ENTER_FRAME, upBtnDownTime);
upBtn.stage.removeEventListener(MouseEvent.MOUSE_UP, upBtnUp);
}
/*
* 下滚动按钮
*/
private function bottonBtnDown(event : MouseEvent):void {
Text.scrollV++;
slipMc.y =bgMc.y+(slipHeight*(Text.scrollV/Text.maxScrollV));
//当鼠标在按钮上按下的时间大于设定时间时,连续滚动
putTime = getTimer();
ScrollBarMc.addEventListener(Event.ENTER_FRAME, bottonBtnTime);
bottonBtn.stage.addEventListener(MouseEvent.MOUSE_UP, bottonBtnUp);
}
private function bottonBtnTime(event : Event):void {
if (getTimer() - putTime > 500) {
Text.scrollV++;
slipMc.y =bgMc.y+(slipHeight*(Text.scrollV/Text.maxScrollV));
}
}
private function bottonBtnUp(event : MouseEvent):void {
ScrollBarMc.removeEventListener(Event.ENTER_FRAME, bottonBtnTime);
bottonBtn.stage.removeEventListener(MouseEvent.MOUSE_UP, bottonBtnUp);
}
}
}
import flash.display.DisplayObject;
import flash.display.Shape;
import flash.display.SimpleButton;
import flash.display.CapsStyle;
import flash.display.LineScaleMode;
//方向按钮类directionButton
class directionButton extends SimpleButton {
var upColor:uint = 0xE1E1E1;
var overColor:uint = 0xE6E6E6;
var downColor:uint = 0xcccccc;
var size:uint;
var way:uint;
public function directionButton(size,way) {
this.size=size;
this.way=way;
downState = new directionButtonDisplayState(downColor, size,way);
overState = new directionButtonDisplayState(overColor, size,way);
upState = new directionButtonDisplayState(upColor, size,way);
hitTestState = new directionButtonDisplayState(upColor, size,way);
}
}
//绘制方向按钮的方法类directionButtonDisplayState
class directionButtonDisplayState extends Shape {
var bgColor:uint;
var size:uint;
var way:uint;
public function directionButtonDisplayState(bgColor:uint, size:uint,way:uint) {
this.bgColor = bgColor;
this.size = size;
this.way=way;
draw();
}
private function draw():void {
graphics.beginFill(bgColor);
graphics.drawRect(0, 0, size, size);
graphics.endFill();
graphics.beginFill(0xffffff,.4);
if (way==1) {
graphics.drawRect(0, 0, size, size/2);
graphics.endFill();
} else if (way==2) {
graphics.drawRect(0, size/2, size, size/2);
graphics.endFill();
} else if (way==3) {
graphics.drawRect(0, 0, size/2, size);
graphics.endFill();
} else if (way==4) {
graphics.drawRect(size/2, 0, size/2, size);
graphics.endFill();
}
graphics.beginFill(0x000000);
graphics.lineStyle(1, bgColor, 0,true);
if (way==1) {
graphics.moveTo(size/2, size/2-size/4);
graphics.lineTo(size/2+size/4,size/2+size/4);
graphics.lineTo(size/2-size/4,size/2+size/4);
graphics.lineTo(size/2, size/2-size/4);
} else if (way==2) {
graphics.moveTo(size/2, size/2+size/4);
graphics.lineTo(size/2+size/4,size/2-size/4);
graphics.lineTo(size/2-size/4,size/2-size/4);
graphics.lineTo(size/2, size/2+size/4);
} else if (way==3) {
graphics.moveTo(size/2-size/4, size/2);
graphics.lineTo(size/2+size/4,size/2-size/4);
graphics.lineTo(size/2+size/4,size/2+size/4);
graphics.lineTo(size/2-size/4, size/2);
} else if (way==4) {
graphics.moveTo(size/2+size/4, size/2);
graphics.lineTo(size/2-size/4,size/2-size/4);
graphics.lineTo(size/2-size/4,size/2+size/4);
graphics.lineTo(size/2+size/4, size/2);
}
}
}