學(xué)AS3幾個(gè)星期了,發(fā)一個(gè)我的小練習(xí):動(dòng)態(tài)文本滾動(dòng)條
功能說(shuō)明:
本版滾動(dòng)條除了繼續(xù)保持體積。ㄐ∮2K),界面容易修改,資源占用率小的優(yōu)勢(shì)外,主要有以下幾點(diǎn)改進(jìn):
- 使用AS3編寫(xiě)。
- 寬高動(dòng)態(tài)指定。
- 增加滾動(dòng)條背景點(diǎn)擊事件。
- 消除了鼠標(biāo)滾輪無(wú)法同時(shí)準(zhǔn)確控制多個(gè)文本框的重大BUG。
演示 源文件下載
使用方法見(jiàn)源文件
為了方便懶人,直接帖一下代碼:
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 { //=============本類(lèi)屬性============== ////接口元件 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)上與本類(lè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è)偵聽(tīng)器 //文本滾動(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è)高度因子,此因子隨加載文本的增多,將無(wú)限趨向于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)偵聽(tīng),因?yàn)槲谋緷L動(dòng)的時(shí)候會(huì)設(shè)置滑塊的位置,而此時(shí)是通過(guò)滑塊調(diào)整文本的位置,所以會(huì)產(chǎn)生沖突 scrollText.removeEventListener(Event.SCROLL, textScroll); //監(jiān)聽(tīng)舞臺(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)過(guò)程中及時(shí)獲得滑塊所處位置 var nowPosition : Number = Math.floor(pole_sprite.y); //使文本隨滾動(dòng)條滾動(dòng),這里為什么要加1,可見(jiàn)scroll屬性值應(yīng)該是取正的,也就是說(shuō)它會(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)); } } }
經(jīng)典論壇討論: http://bbs.blueidea.com/thread-2837973-1-1.html
本文鏈接:http://m.95time.cn/download/product/2008/5514.asp
出處:藍(lán)色理想
責(zé)任編輯:moby
|