火山動(dòng)態(tài)文本滾動(dòng)條V5[AS3版]
更新時(shí)間：2008年03月30日 13:23:05 作者：
功能說明：本版滾動(dòng)條除了繼續(xù)保持體積小（小于2K），界面容易修改，資源占用率小的優(yōu)勢(shì)外，主要有以下幾點(diǎn)改進(jìn)：
1，使用AS3編寫。
2，寬高動(dòng)態(tài)指定。
3，增加滾動(dòng)條背景點(diǎn)擊事件。
4，消除了鼠標(biāo)滾輪無法同時(shí)準(zhǔn)確控制多個(gè)文本框的重大BUG。
在線演示
打包文件下載
package com.qoolu.component
{
import flash.events.MouseEvent;
import flash.events.Event;
import flash.display.SimpleButton;
import flash.text.TextField;
import flash.display.Sprite;
import flash.utils.getTimer;
import flash.geom.Rectangle;
/**
* @author 寂寞火山:[url]http://www.huoshan.org[/url]
* @version V5 [08.3.15]
* 動(dòng)態(tài)文本滾動(dòng)條
*/
public class ScrollBar extends Sprite {
//=============本類屬性==============
////接口元件
private var scrollText : TextField;
private var scrollBar_sprite : Sprite;
private var up_btn : SimpleButton;
private var down_btn : SimpleButton;
private var pole_sprite : Sprite;
private var bg_sprite : Sprite;
////初始數(shù)據(jù)
private var poleStartHeight : Number;
private var poleStartY : Number;
private var totalPixels : Number;
private var isSelect : Boolean;
////上下滾動(dòng)按鈕按鈕下時(shí)間
private var putTime : Number;
/**
* @param scrollText_fc:被滾動(dòng)的文本框
* @param scrollBarMc_fc：舞臺(tái)上與本類所代理的滾動(dòng)條元件
* @param height_fc：滾動(dòng)條高
* @param width_fc：滾動(dòng)條寬
*/
public function ScrollBar(scrollText_fc : TextField, scrollBarMc_fc : Sprite, height_fc : uint = 0,width_fc : uint = 0) {
//——————滾動(dòng)條_sprite，滾動(dòng)條按鈕和滑塊mc，被滾動(dòng)的文本域初始化
scrollText = scrollText_fc;
scrollBar_sprite = scrollBarMc_fc;
up_btn = SimpleButton(scrollBar_sprite.getChildByName("up_btn"));
down_btn = SimpleButton(scrollBar_sprite.getChildByName("down_btn"));
pole_sprite = Sprite(scrollBar_sprite.getChildByName("pole_mc"));
bg_sprite = Sprite(scrollBar_sprite.getChildByName("bg_mc"));
//——————可用性控制
pole_sprite.visible = false;
up_btn.enabled = false;
down_btn.enabled = false;
//——————其他屬性初始化
bg_sprite.useHandCursor = false;
isSelect = scrollText.selectable;
if(height_fc == 0) {
bg_sprite.height = scrollText.height;
}else {
bg_sprite.height = height_fc;
}
if(width_fc != 0) {
bg_sprite.width = width_fc + 2;
pole_sprite.width = width_fc;
up_btn.width = up_btn.height = down_btn.width = down_btn .height = width_fc;
}
down_btn.y = bg_sprite.y + bg_sprite.height - down_btn.height - 1;
poleStartHeight = Math.floor(down_btn.y - up_btn.y - up_btn.height);
poleStartY = pole_sprite.y = Math.floor(up_btn.y + up_btn.height);
//——————注冊(cè)偵聽器
//文本滾動(dòng)與鼠標(biāo)滾輪
scrollText.addEventListener(Event.SCROLL, textScroll);
scrollText.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheel);
//上滾動(dòng)按鈕
up_btn.addEventListener(MouseEvent.MOUSE_DOWN, upBtn);
up_btn.stage.addEventListener(MouseEvent.MOUSE_UP, upBtnUp);
//下滾動(dòng)按鈕
down_btn.addEventListener(MouseEvent.MOUSE_DOWN, downBtn);
down_btn.stage.addEventListener(MouseEvent.MOUSE_UP, downBtnUp);
//滑塊
pole_sprite.addEventListener(MouseEvent.MOUSE_DOWN, poleSprite);
pole_sprite.stage.addEventListener(MouseEvent.MOUSE_UP, poleUp);
//滑塊背景點(diǎn)擊
bg_sprite.addEventListener(MouseEvent.MOUSE_DOWN, bgDown);
}
/**
* 文本滾動(dòng)事件
*/
private function textScroll(event : Event) : void {
//判斷滑塊兒是否顯示，并根據(jù)文本內(nèi)容多少定義滑塊高度
if(scrollText.maxScrollV != 1) {
pole_sprite.visible = true;
up_btn.enabled = true;
down_btn.enabled = true;
//定義一個(gè)高度因子，此因子隨加載文本的增多，將無限趨向于1
var heightVar : Number = 1 - (scrollText.maxScrollV - 1) / scrollText.maxScrollV;
//根據(jù)高度因子初始化滑塊的高度
pole_sprite.height = Math.floor(poleStartHeight * Math.pow(heightVar, 1 / 3));
totalPixels = Math.floor(down_btn.y - up_btn.y - up_btn.height - pole_sprite.height);
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}else {
pole_sprite.visible = false;
up_btn.enabled = false;
down_btn.enabled = false;
}
}
/**
* 滑塊滾動(dòng)
*/
private function poleSprite(event : MouseEvent) : void {
//首先取消文本框滾動(dòng)偵聽，因?yàn)槲谋緷L動(dòng)的時(shí)候會(huì)設(shè)置滑塊的位置，而此時(shí)是通過滑塊調(diào)整文本的位置，所以會(huì)產(chǎn)生沖突
scrollText.removeEventListener(Event.SCROLL, textScroll);
//監(jiān)聽舞臺(tái)，這樣可以保證拖動(dòng)滑竿的時(shí)候，鼠標(biāo)在舞臺(tái)的任意位置松手，都會(huì)停止拖動(dòng)
scrollBar_sprite.stage.addEventListener(MouseEvent.MOUSE_UP, poleUp);
//限定拖動(dòng)范圍
var dragRect : Rectangle = new Rectangle(pole_sprite.x, poleStartY, 0, totalPixels);
pole_sprite.startDrag(false, dragRect);
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, poleDown);
}
private function poleDown(event : Event) : void {
//在滾動(dòng)過程中及時(shí)獲得滑塊所處位置
var nowPosition : Number = Math.floor(pole_sprite.y);
//使文本隨滾動(dòng)條滾動(dòng),這里為什么要加1，可見scroll屬性值應(yīng)該是取正的，也就是說它會(huì)刪除小數(shù)部分，而非采用四舍五入制？
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 2;
//誤差校正
var unitPixels : Number = totalPixels / (scrollText.maxScrollV - 1);
if((nowPosition - poleStartY) < unitPixels) {
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels;
}
}
private function poleUp(event : MouseEvent) : void {
pole_sprite.stopDrag();
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, poleDown);
scrollBar_sprite.stage.removeEventListener(MouseEvent.MOUSE_UP, poleUp);
scrollText.addEventListener(Event.SCROLL, textScroll);
}
/**
* 滑塊背景點(diǎn)擊
*/
private function bgDown(event : MouseEvent) : void {
var nowPosition : Number;
if((scrollBar_sprite.mouseY - up_btn.y) < (pole_sprite.height / 2)) {
nowPosition = Math.floor(up_btn.y + up_btn.height);
}else if((down_btn.y - scrollBar_sprite.mouseY) < pole_sprite.height / 2) {
nowPosition = Math.floor(down_btn.y - pole_sprite.height);
}else {
nowPosition = scrollBar_sprite.mouseY - pole_sprite.height / 2;
}
pole_sprite.y = nowPosition;
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 2;
var unitPixels : Number = totalPixels / (scrollText.maxScrollV - 1);
if((nowPosition - poleStartY) < unitPixels) {
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 1;
}
}
/**
* 下滾動(dòng)按鈕
*/
private function downBtn(event : MouseEvent) : void {
scrollText.scrollV++;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
//當(dāng)鼠標(biāo)在按鈕上按下的時(shí)間大于設(shè)定時(shí)間時(shí)，連續(xù)滾動(dòng)
putTime = getTimer();
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, downBtnDown);
}
private function downBtnDown(event : Event) : void {
if(getTimer() - putTime > 500) {
scrollText.scrollV++;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
private function downBtnUp(event : MouseEvent) : void {
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, downBtnDown);
}
/**
* 上滾動(dòng)按鈕
*/
private function upBtn(event : MouseEvent) : void {
scrollText.scrollV--;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
//當(dāng)鼠標(biāo)在按鈕上按下的時(shí)間大于設(shè)定時(shí)間時(shí)，連續(xù)滾動(dòng)
putTime = getTimer();
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, upBtnDown);
}
private function upBtnDown(event : Event) : void {
if(getTimer() - putTime > 500) {
scrollText.scrollV--;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
private function upBtnUp(event : MouseEvent) : void {
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, upBtnDown);
}
/**
* 鼠標(biāo)滾輪事件
*/
private function mouseWheel(event : MouseEvent) : void {
if(isSelect == false) {
scrollText.scrollV -= Math.floor(event.delta / 2);
}else if(isSelect == true) {
event.delta = 1;
}
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
}
打包文件下載
復(fù)制代碼 代碼如下:
package com.qoolu.component
{
import flash.events.MouseEvent;
import flash.events.Event;
import flash.display.SimpleButton;
import flash.text.TextField;
import flash.display.Sprite;
import flash.utils.getTimer;
import flash.geom.Rectangle;
/**
* @author 寂寞火山:[url]http://www.huoshan.org[/url]
* @version V5 [08.3.15]
* 動(dòng)態(tài)文本滾動(dòng)條
*/
public class ScrollBar extends Sprite {
//=============本類屬性==============
////接口元件
private var scrollText : TextField;
private var scrollBar_sprite : Sprite;
private var up_btn : SimpleButton;
private var down_btn : SimpleButton;
private var pole_sprite : Sprite;
private var bg_sprite : Sprite;
////初始數(shù)據(jù)
private var poleStartHeight : Number;
private var poleStartY : Number;
private var totalPixels : Number;
private var isSelect : Boolean;
////上下滾動(dòng)按鈕按鈕下時(shí)間
private var putTime : Number;
/**
* @param scrollText_fc:被滾動(dòng)的文本框
* @param scrollBarMc_fc：舞臺(tái)上與本類所代理的滾動(dòng)條元件
* @param height_fc：滾動(dòng)條高
* @param width_fc：滾動(dòng)條寬
*/
public function ScrollBar(scrollText_fc : TextField, scrollBarMc_fc : Sprite, height_fc : uint = 0,width_fc : uint = 0) {
//——————滾動(dòng)條_sprite，滾動(dòng)條按鈕和滑塊mc，被滾動(dòng)的文本域初始化
scrollText = scrollText_fc;
scrollBar_sprite = scrollBarMc_fc;
up_btn = SimpleButton(scrollBar_sprite.getChildByName("up_btn"));
down_btn = SimpleButton(scrollBar_sprite.getChildByName("down_btn"));
pole_sprite = Sprite(scrollBar_sprite.getChildByName("pole_mc"));
bg_sprite = Sprite(scrollBar_sprite.getChildByName("bg_mc"));
//——————可用性控制
pole_sprite.visible = false;
up_btn.enabled = false;
down_btn.enabled = false;
//——————其他屬性初始化
bg_sprite.useHandCursor = false;
isSelect = scrollText.selectable;
if(height_fc == 0) {
bg_sprite.height = scrollText.height;
}else {
bg_sprite.height = height_fc;
}
if(width_fc != 0) {
bg_sprite.width = width_fc + 2;
pole_sprite.width = width_fc;
up_btn.width = up_btn.height = down_btn.width = down_btn .height = width_fc;
}
down_btn.y = bg_sprite.y + bg_sprite.height - down_btn.height - 1;
poleStartHeight = Math.floor(down_btn.y - up_btn.y - up_btn.height);
poleStartY = pole_sprite.y = Math.floor(up_btn.y + up_btn.height);
//——————注冊(cè)偵聽器
//文本滾動(dòng)與鼠標(biāo)滾輪
scrollText.addEventListener(Event.SCROLL, textScroll);
scrollText.addEventListener(MouseEvent.MOUSE_WHEEL, mouseWheel);
//上滾動(dòng)按鈕
up_btn.addEventListener(MouseEvent.MOUSE_DOWN, upBtn);
up_btn.stage.addEventListener(MouseEvent.MOUSE_UP, upBtnUp);
//下滾動(dòng)按鈕
down_btn.addEventListener(MouseEvent.MOUSE_DOWN, downBtn);
down_btn.stage.addEventListener(MouseEvent.MOUSE_UP, downBtnUp);
//滑塊
pole_sprite.addEventListener(MouseEvent.MOUSE_DOWN, poleSprite);
pole_sprite.stage.addEventListener(MouseEvent.MOUSE_UP, poleUp);
//滑塊背景點(diǎn)擊
bg_sprite.addEventListener(MouseEvent.MOUSE_DOWN, bgDown);
}
/**
* 文本滾動(dòng)事件
*/
private function textScroll(event : Event) : void {
//判斷滑塊兒是否顯示，并根據(jù)文本內(nèi)容多少定義滑塊高度
if(scrollText.maxScrollV != 1) {
pole_sprite.visible = true;
up_btn.enabled = true;
down_btn.enabled = true;
//定義一個(gè)高度因子，此因子隨加載文本的增多，將無限趨向于1
var heightVar : Number = 1 - (scrollText.maxScrollV - 1) / scrollText.maxScrollV;
//根據(jù)高度因子初始化滑塊的高度
pole_sprite.height = Math.floor(poleStartHeight * Math.pow(heightVar, 1 / 3));
totalPixels = Math.floor(down_btn.y - up_btn.y - up_btn.height - pole_sprite.height);
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}else {
pole_sprite.visible = false;
up_btn.enabled = false;
down_btn.enabled = false;
}
}
/**
* 滑塊滾動(dòng)
*/
private function poleSprite(event : MouseEvent) : void {
//首先取消文本框滾動(dòng)偵聽，因?yàn)槲谋緷L動(dòng)的時(shí)候會(huì)設(shè)置滑塊的位置，而此時(shí)是通過滑塊調(diào)整文本的位置，所以會(huì)產(chǎn)生沖突
scrollText.removeEventListener(Event.SCROLL, textScroll);
//監(jiān)聽舞臺(tái)，這樣可以保證拖動(dòng)滑竿的時(shí)候，鼠標(biāo)在舞臺(tái)的任意位置松手，都會(huì)停止拖動(dòng)
scrollBar_sprite.stage.addEventListener(MouseEvent.MOUSE_UP, poleUp);
//限定拖動(dòng)范圍
var dragRect : Rectangle = new Rectangle(pole_sprite.x, poleStartY, 0, totalPixels);
pole_sprite.startDrag(false, dragRect);
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, poleDown);
}
private function poleDown(event : Event) : void {
//在滾動(dòng)過程中及時(shí)獲得滑塊所處位置
var nowPosition : Number = Math.floor(pole_sprite.y);
//使文本隨滾動(dòng)條滾動(dòng),這里為什么要加1，可見scroll屬性值應(yīng)該是取正的，也就是說它會(huì)刪除小數(shù)部分，而非采用四舍五入制？
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 2;
//誤差校正
var unitPixels : Number = totalPixels / (scrollText.maxScrollV - 1);
if((nowPosition - poleStartY) < unitPixels) {
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels;
}
}
private function poleUp(event : MouseEvent) : void {
pole_sprite.stopDrag();
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, poleDown);
scrollBar_sprite.stage.removeEventListener(MouseEvent.MOUSE_UP, poleUp);
scrollText.addEventListener(Event.SCROLL, textScroll);
}
/**
* 滑塊背景點(diǎn)擊
*/
private function bgDown(event : MouseEvent) : void {
var nowPosition : Number;
if((scrollBar_sprite.mouseY - up_btn.y) < (pole_sprite.height / 2)) {
nowPosition = Math.floor(up_btn.y + up_btn.height);
}else if((down_btn.y - scrollBar_sprite.mouseY) < pole_sprite.height / 2) {
nowPosition = Math.floor(down_btn.y - pole_sprite.height);
}else {
nowPosition = scrollBar_sprite.mouseY - pole_sprite.height / 2;
}
pole_sprite.y = nowPosition;
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 2;
var unitPixels : Number = totalPixels / (scrollText.maxScrollV - 1);
if((nowPosition - poleStartY) < unitPixels) {
scrollText.scrollV = (scrollText.maxScrollV - 1) * (nowPosition - poleStartY) / totalPixels + 1;
}
}
/**
* 下滾動(dòng)按鈕
*/
private function downBtn(event : MouseEvent) : void {
scrollText.scrollV++;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
//當(dāng)鼠標(biāo)在按鈕上按下的時(shí)間大于設(shè)定時(shí)間時(shí)，連續(xù)滾動(dòng)
putTime = getTimer();
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, downBtnDown);
}
private function downBtnDown(event : Event) : void {
if(getTimer() - putTime > 500) {
scrollText.scrollV++;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
private function downBtnUp(event : MouseEvent) : void {
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, downBtnDown);
}
/**
* 上滾動(dòng)按鈕
*/
private function upBtn(event : MouseEvent) : void {
scrollText.scrollV--;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
//當(dāng)鼠標(biāo)在按鈕上按下的時(shí)間大于設(shè)定時(shí)間時(shí)，連續(xù)滾動(dòng)
putTime = getTimer();
scrollBar_sprite.addEventListener(Event.ENTER_FRAME, upBtnDown);
}
private function upBtnDown(event : Event) : void {
if(getTimer() - putTime > 500) {
scrollText.scrollV--;
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
private function upBtnUp(event : MouseEvent) : void {
scrollBar_sprite.removeEventListener(Event.ENTER_FRAME, upBtnDown);
}
/**
* 鼠標(biāo)滾輪事件
*/
private function mouseWheel(event : MouseEvent) : void {
if(isSelect == false) {
scrollText.scrollV -= Math.floor(event.delta / 2);
}else if(isSelect == true) {
event.delta = 1;
}
pole_sprite.y = Math.floor(poleStartY + totalPixels * (scrollText.scrollV - 1) / (scrollText.maxScrollV - 1));
}
}
}
相關(guān)文章
rollOver與mouseOver同樣在鼠標(biāo)移到目標(biāo)上時(shí)觸發(fā)事件，細(xì)微區(qū)別在于，mouseOver的bubbles等于true,而rollOver的bubbles是false.2009-10-10
Google Analytics在Flash cs3下的使用教程分析
因?yàn)楣ぷ鞯脑?，最近使用到Google Analytics組件，這個(gè)組件在網(wǎng)上的資料很多，但是大部分都是詳談組件的優(yōu)勢(shì)的，具體的使用沒有很詳細(xì)的說明2009-02-02
AS3 navigateToURL導(dǎo)致ExternalInterface 執(zhí)行失敗問題
AS3 navigateToURL導(dǎo)致ExternalInterface 執(zhí)行失敗問題2009-02-02
這本書是一本經(jīng)典的書籍，說實(shí)話一些小的AS3的項(xiàng)目是做了好幾個(gè)，基本的語法也都知道（其實(shí)有面向?qū)ο缶幊陶Z言的基礎(chǔ)后再入門一門新的語言還是很快的）。現(xiàn)在找到了這邊經(jīng)典書籍完整版，就好好看看，順便寫一些總結(jié)。2009-02-02
簡(jiǎn)單說說AS3.0中對(duì)于XML支持的不同吧： .AS2.0對(duì)XML的支持勉勉強(qiáng)強(qiáng)，將就著可以用。而AS3.0中對(duì)XML的支持是全方位的，極其強(qiáng)大和靈活的2008-03-03
在用flash做項(xiàng)目的時(shí)候，把一些元件，通過設(shè)置鏈接類，然后使用這個(gè)類，通過getClass方法即可把這個(gè)素材拿下來2008-06-06
as3+xml+asp+access做的有獎(jiǎng)問答
as3+xml+asp+access做的有獎(jiǎng)問答實(shí)現(xiàn)代碼2009-02-02
Actionscript 3.0中Singleton實(shí)現(xiàn) 修正篇
說明：上一篇"一個(gè)簡(jiǎn)單的Actionscript的單態(tài)模式類"的實(shí)現(xiàn)在Actionscript中報(bào)錯(cuò)，具體原因會(huì)在這篇Blog中詳細(xì)說明。2009-02-02
AS3 中的package（包）應(yīng)用實(shí)例代碼
初學(xué)者在學(xué)習(xí)AS3時(shí)會(huì)遇到什么樣的問題呢？只有從初學(xué)的角度來實(shí)踐，才能知道，package 這個(gè)高手們必玩的內(nèi)容，對(duì)初學(xué)者來說或許就有一些困惑。2008-08-08![火山動(dòng)態(tài)文本滾動(dòng)條V5[AS3版]](http://img.jbzj.com/images/xgimg/bcimg9.png)
火山動(dòng)態(tài)文本滾動(dòng)條V5[AS3版]
功能說明：本版滾動(dòng)條除了繼續(xù)保持體積小（小于2K），界面容易修改，資源占用率小的優(yōu)勢(shì)外，主要有以下幾點(diǎn)改進(jìn)： 1，使用AS3編寫。 2，寬高動(dòng)態(tài)指定。 3，增加滾動(dòng)條背景點(diǎn)擊事件。 4，消除了鼠標(biāo)滾輪無法同時(shí)準(zhǔn)確控制多個(gè)文本框的重大BUG。2008-03-03