中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

您的位置: 首頁 > 技術(shù)文檔 > 多媒體制作 > 用純AS寫滾動條
完美的loading—完美到底 回到列表 Flash Lite 2.0 中文版發(fā)布
 用純AS寫滾動條

作者:jimohuoshan 時間: 2006-03-16 文檔類型:原創(chuàng) 來自:藍(lán)色理想

前兩個星期抽時間看了看一直很感興趣卻沒時間研究的XML類和繪圖API
覺得也沒之前想象的那么神秘:)

用了三個晚自習(xí)的時間用AS1.0寫了這個純AS+XML的滾動條,算做練習(xí)吧。
請高手多多指教!

下面是所有的AS代碼:

//%%%%%%%%%%%%MC類自定義方法%%%%%%%%%%%%//
//——————繪圖方法————//
//三角型方法
MovieClip.prototype.sanjiaoxing = function(zuobiao1, zuobiao2, zuobiao3, bangzhi, yanse, toumingdu) {
    this.lineStyle(bangzhi, yanse, toumingdu);
    this.moveTo(zuobiao1.x, zuobiao1.y);
    this.lineTo(zuobiao2.x, zuobiao2.y);
    this.lineTo(zuobiao3.x, zuobiao3.y);
    this.lineTo(zuobiao1.x, zuobiao1.y);
};
//寬高矩形法,根據(jù)初始點坐標(biāo)和寬與高確定矩形。x,y為初始點坐標(biāo),kuan和gao為矩形的寬和高。
MovieClip.prototype.changkuanjuxing = function(x, y, kuan, gao, bangzhi, yanse, toumingdu) {
    this.lineStyle(bangzhi, yanse, toumingdu);
    this.moveTo(x, y);
    this.lineTo(x+kuan, y);
    this.lineTo(x+kuan, y+gao);
    this.lineTo(x, y+gao);
    this.lineTo(x, y);
};
//中心點矩形法,根據(jù)中心點的坐標(biāo)和寬與高確定矩形。x,y為中心點坐標(biāo),kuan,gao為矩形的長和寬。
MovieClip.prototype.zhongxinjuxing = function(x, y, kuan, gao, bangzhi, yanse, toumingdu) {
    this.lineStyle(bangzhi, yanse, toumingdu);
    this.moveTo(x-kuan/2, y+gao/2);
    this.lineTo(x+kuan/2, y+gao/2);
    this.lineTo(x+kuan/2, y-gao/2);
    this.lineTo(x-kuan/2, y-gao/2);
    this.lineTo(x-kuan/2, y+gao/2);
};
//————定位方法————//
MovieClip.prototype.dingwei = function(x, y) {
    this._x = x;
    this._y = y;
};
//————上色方法————//
//定義一個獲取顏色值,并把它轉(zhuǎn)化成16進(jìn)制的函數(shù)   
//獲取顏色值的后六位,使此方法可以同時滿足“#FFFFFF”和“0xFFFFFF”兩種格式的顏色值
function jinzhizhuanhuan(yansezhi) {
    var yansezhi = yansezhi.substr(-6, 6);
    return parseInt(yansezhi, 16);
}
Color.prototype.shangse = function(yansezhi) {
    this.setRGB(jinzhizhuanhuan(yansezhi));
};
MovieClip.prototype.shangse = function(yansezhi) {
    var linshi_color = new Color(this);
    linshi_color.shangse(yansezhi);
};
//%%%%%%%%%%%加載XML文檔%%%%%%%%%%%%%//
gundongtiao_xml = new XML();
gundongtiao_xml.ignoreWhite = true;
gundongtiao_xml.load("gundongtiao.xml");
gundongtiao_xml.onLoad = function() {
    var jiedianlujing_xml = gundongtiao_xml.firstChild.childNodes;
    //滾動條背景參數(shù)
    with (jiedianlujing_xml[0]) {
        var gundongtiaobeijingse = jinzhizhuanhuan(attributes["背景色"]);
        var gundongtiaotoumingdu = attributes["背景透明度"];
        var gundongtiaobiankuangse = jinzhizhuanhuan(attributes["邊框色"]);
        var gundongtiaobiankuangtoumingdou = attributes["邊框透明度"];
        var gundongtiaobiankuangcuxi = attributes["邊框粗細(xì)"];
        var gundongtiaokuan = attributes["寬"];
    }
    //方塊參數(shù)
    with (jiedianlujing_xml[1]) {
        var fangkuaibeijingse = jinzhizhuanhuan(attributes["背景色"]);
        var fangkuaitoumingdu = attributes["背景透明度"];
        var fangkuaibiankuangse = jinzhizhuanhuan(attributes["邊框色"]);
        var fangkuaibiankuangtoumingdou = attributes["邊框透明度"];
        var fangkuaibiankuangcuxi = attributes["邊框粗細(xì)"];
    }
    //三角參數(shù)
    with (jiedianlujing_xml[2]) {
        var sanjiaoyuanshise = jinzhizhuanhuan(attributes["原始色"]);
        var sanjiaohuodongse = jinzhizhuanhuan(attributes["活動色"]);
        //記錄下原始色和活動色,以備在“上”,“下”按鈕中使用
        jiluyuanshise = attributes["原始色"];
        jiluhuodongse = attributes["活動色"];
        var sanjiaotoumingdou = attributes["透明度"];
    }
    //滑塊參數(shù)
    with (jiedianlujing_xml[3]) {
        var huakuaibeijingse = jinzhizhuanhuan(attributes["背景色"]);
        var huakuaitoumingdu = attributes["背景透明度"];
        var huakuaibiankuangse = jinzhizhuanhuan(attributes["邊框色"]);
        var huakuaibiankuangtoumingdou = attributes["邊框透明度"];
        var huakuaibiankuangcuxi = attributes["邊框粗細(xì)"];
    }
    //先根據(jù)文本域的高確定滾動條的高
    gundongtiaogao = wenben_txt._height;
    ////////////中心法繪制滾動條背景矩形條
    createEmptyMovieClip("gundongtiao_mc", 1000);
    gundongtiao_mc.beginFill(gundongtiaobeijingse, gundongtiaotoumingdu);
    gundongtiao_mc.zhongxinjuxing(0, 0, gundongtiaokuan, gundongtiaogao, gundongtiaobiankuangcuxi, gundongtiaobiankuangse, gundongtiaobiankuangtoumingdou);
    gundongtiao_mc.endFill();
    //根據(jù)文本域的位置確定滾動條位置,使其緊貼在文本域的右端
    gundongtiao_mc.dingwei(wenben_txt._x+wenben_txt._width+gundongtiao_mc._width/2, wenben_txt._y+wenben_txt._height/2);
    /////////中心點矩形法繪制滾動條上下按鈕
    //////繪制上按鈕背景方塊
    gundongtiao_mc.createEmptyMovieClip("shangfangkuai_mc", 1);
    gundongtiao_mc.shangfangkuai_mc.beginFill(fangkuaibeijingse, fangkuaitoumingdu);
    gundongtiao_mc.shangfangkuai_mc.zhongxinjuxing(0, 0, gundongtiao_mc._width, gundongtiao_mc._width, fangkuaibiankuangcuxi, fangkuaibiankuangse, fangkuaitoumingdu);
    gundongtiao_mc.shangfangkuai_mc.endFill();
    //定位上按鈕背景方塊
    gundongtiao_mc.shangfangkuai_mc.dingwei(0, -gundongtiao_mc._height/2+gundongtiao_mc.shangfangkuai_mc._height/2);
    //////繪制上按鈕三角形
    gundongtiao_mc.createEmptyMovieClip("shangsanjiao_mc", 2);
    //中心點法繪制三角形
    //首先定義一個因子,此因子等于正三角形中心到各頂點的距離,用來定位三角形各頂點的位置。
    var yinzi = gundongtiaokuan/3;
    var zuobiao1x = -1/2*Math.pow(3, 1/2)*yinzi;
    var zuobiao1y = 1/2*yinzi;
    var zuobiao2x = 1/2*Math.pow(3, 1/2)*yinzi;
    var zuobiao2y = 1/2*yinzi;
    var zuobiao3x = 0;
    var zuobiao3y = -yinzi;
    var zuobiao1 = {x:zuobiao1x, y:zuobiao1y};
    var zuobiao2 = {x:zuobiao2x, y:zuobiao2y};
    var zuobiao3 = {x:zuobiao3x, y:zuobiao3y};
    gundongtiao_mc.shangsanjiao_mc.beginFill(sanjiaoyuanshise, sanjiaotoumingdou);
    gundongtiao_mc.shangsanjiao_mc.sanjiaoxing(zuobiao1, zuobiao2, zuobiao3, 1, 0x000000, 0);
    gundongtiao_mc.shangsanjiao_mc.endFill();
    //定位上三角形
    gundongtiao_mc.shangsanjiao_mc.dingwei(0, -gundongtiao_mc._height/2+gundongtiao_mc.shangfangkuai_mc._height/2);
    //////復(fù)制上按鈕背景方塊和三角形,并定位于下方
    //復(fù)制下方塊
    gundongtiao_mc.shangfangkuai_mc.duplicateMovieClip("xiafangkuai_mc", 3);
    //定位下按鈕背景方塊,這里的Y坐標(biāo)加一,是為了讓下方塊跟文本框底部對齊!
    gundongtiao_mc.xiafangkuai_mc.dingwei(0, Math.floor(gundongtiao_mc._height/2-gundongtiao_mc.xiafangkuai_mc._height/2)+1);
    //復(fù)制下三角形
    gundongtiao_mc.shangsanjiao_mc.duplicateMovieClip("xiasanjiao_mc", 4);
    //旋轉(zhuǎn)180度
    gundongtiao_mc.xiasanjiao_mc._rotation = 180;
    //定位下三角形
    gundongtiao_mc.xiasanjiao_mc.dingwei(0, gundongtiao_mc._height/2-gundongtiao_mc.xiafangkuai_mc._height/2);
    ///////////繪制滑塊
    //長寬矩形法繪制滑塊矩形
    gundongtiao_mc.createEmptyMovieClip("huakuai_mc", 5);
    gundongtiao_mc.huakuai_mc.beginFill(huakuaibeijingse, huakuaitoumingdu);
    gundongtiao_mc.huakuai_mc.changkuanjuxing(-gundongtiao_mc._width/2, 0, gundongtiao_mc._width, gundongtiao_mc._width, huakuaibiankuangcuxi, huakuaibiankuangse, huakuaibiankuangtoumingdou);
    gundongtiao_mc.huakuai_mc.endFill();
    //---------滾動初始化---------//
    //滑塊的初始高度,并記錄
    chushigaodu = Math.floor(gundongtiao_mc.xiafangkuai_mc._y-gundongtiao_mc.shangfangkuai_mc._y-gundongtiao_mc.shangfangkuai_mc._height);
    //初始化滑塊Y坐標(biāo),并記錄
    ychushiweizhi = gundongtiao_mc.huakuai_mc._y=Math.round(gundongtiao_mc.shangfangkuai_mc._y+gundongtiao_mc.
shangfangkuai_mc._height/2);
    //小滑塊不可見
    gundongtiao_mc.huakuai_mc._visible = false;
};
//%%%%%%%%%%%%%%%%滾動代碼%%%%%%%%%%%%%%%%%%//
//////////為父剪輯的文字域注冊偵聽器,以偵聽在文字域產(chǎn)生變化時,也就是在文本被載入進(jìn)來時,執(zhí)行下面的代碼。這樣就不用擔(dān)心代碼執(zhí)行順序問題!
var zhentingqi = new Object();
wenben_txt.addListener(zhentingqi);
//當(dāng)文字域載入完成時,為什么觸發(fā)onScroller事件,而不是onChange事件?
zhentingqi.onScroller = function() {
    trace("-------------------------");
    trace("滾動總行數(shù)="+wenben_txt.maxscroll);
    trace("當(dāng)前行="+wenben_txt.scroll);
    //判斷滑塊兒是否顯示,并根據(jù)文本內(nèi)容多少定義滑塊高度
    if (_parent.wenben_txt.maxscroll != 1) {
        gundongtiao_mc.huakuai_mc._visible = true;
        //定義一個高度因子,此因子隨加載文本的增多,將無限趨向于1。
        var gaoduyinzi = 1-(wenben_txt.maxscroll-1.5)/wenben_txt.maxscroll;
        //初始化滑塊的高度,它的最小高度定義為2象素。
        gaodu = gundongtiao_mc.huakuai_mc._height=Math.floor(chushigaodu*Math.pow(gaoduyinzi, 1/6));
        trace("滑塊高="+gaodu);
    }
    //滑塊滾動的總象素數(shù)
    var zongxiangsu = gundongtiao_mc.xiafangkuai_mc._y-gundongtiao_mc.shangfangkuai_mc._y-gundongtiao_mc.shangfangkuai_mc._height-gundongtiao_mc.huakuai_mc._height;
    //定義平均象素,每一行所包含的像素數(shù),即文本域每滾動一行,滑塊需要移動的象素數(shù)。       
    var pingjunxiangsu = zongxiangsu/(wenben_txt.maxscroll-1);
    //定義平均行數(shù),每一像素包含的行數(shù),即滑塊每移動一象素,文本域在理論上應(yīng)當(dāng)滾動的行數(shù)(盡管非整數(shù)行在視覺上沒有反映)。
    var pingjunhangshu = (wenben_txt.maxscroll-1)/Math.floor(zongxiangsu);
    trace("滾動總象素="+zongxiangsu);
    trace("平均象素值="+pingjunxiangsu);
    ///////////定義上按鈕
    gundongtiao_mc.shangfangkuai_mc.onRollOver = function() {
        gundongtiao_mc.shangsanjiao_mc.shangse(jiluhuodongse);
        this.onPress = function() {
            this.onEnterFrame = function() {
                wenben_txt.scroll--;
                // 使滑塊兒移動到相應(yīng)的位置。
                gundongtiao_mc.huakuai_mc._y = ychushiweizhi+pingjunxiangsu*(wenben_txt.scroll-1);
                trace("滑塊Y坐標(biāo)="+gundongtiao_mc.huakuai_mc._y);
            };
        };
        this.onRelease = function() {
            delete this.onEnterFrame;
        };
        this.onRollOut = function() {
            gundongtiao_mc.shangsanjiao_mc.shangse(jiluyuanshise);
        };
    };
    ////////////定義下按鈕
    gundongtiao_mc.xiafangkuai_mc.onRollOver = function() {
        gundongtiao_mc.xiasanjiao_mc.shangse(jiluhuodongse);
        this.onPress = function() {
            this.onEnterFrame = function() {
                wenben_txt.scroll++;
                //使滑塊兒移動到相應(yīng)的位置。   
                gundongtiao_mc.huakuai_mc._y = ychushiweizhi+pingjunxiangsu*(wenben_txt.scroll-1);
                trace("滑塊Y坐標(biāo)="+gundongtiao_mc.huakuai_mc._y);
            };
        };
        this.onRelease = function() {
            delete this.onEnterFrame;
        };
        this.onRollOut = function() {
            gundongtiao_mc.xiasanjiao_mc.shangse(jiluyuanshise);
        };
    };
    ///////////換用MOUSE對象的onMouseWheel方法結(jié)合偵聽器實現(xiàn)滑塊隨鼠標(biāo)滾球滾動
    mouseListener = new Object();
    Mouse.addListener(mouseListener);
    mouseListener.onMouseWheel = function(delta) {
        delta = 1;
        gundongtiao_mc.huakuai_mc._y = ychushiweizhi+pingjunxiangsu*(wenben_txt.scroll-1);
    };
    ///////////滑塊MC事件處理,當(dāng)鼠標(biāo)經(jīng)過或按下時
    gundongtiao_mc.huakuai_mc.onPress = function() {
        //開始拖動
        this.startDrag(false, this._x, ychushiweizhi, this._x, Math.round(gundongtiao_mc.xiafangkuai_mc._y-gundongtiao_mc.xiafangkuai_mc._height/2-gundongtiao_mc.huakuai_mc._height));
        //使文本隨滑塊滾動
        this.onEnterFrame = function() {
            //在滾動過程中即時獲得“滑塊所處位置”
            var xianzaiweizhi = Math.floor(this._y);
            trace("現(xiàn)在位置="+xianzaiweizhi);
            //使文本隨滾動條滾動,這里為什么要加1,可見scroll屬性值應(yīng)該是取正的,也就是說它會刪除小數(shù)部分,而非采用四舍五入制?
            wenben_txt.scroll = (xianzaiweizhi-ychushiweizhi)*pingjunhangshu+1;
            trace("scroll值="+Math.floor((xianzaiweizhi-ychushiweizhi)*pingjunhangshu+1));
            trace("初始位置="+ychushiweizhi);
            trace("現(xiàn)在位置="+xianzaiweizhi);
        };
    };
    //滑塊MC事件處理,鼠標(biāo)移出或釋放時
    gundongtiao_mc.huakuai_mc.onRollOut = gundongtiao_mc.huakuai_mc.onRelease=function () {
        // “滑塊”停止拖動
        this.stopDrag();
        // 停止文本隨滑塊滾動事件
        delete this.onEnterFrame;
    };
};

下面是XML文檔代碼:

<?xml version="1.0" encoding="UTF-8"?>
<滾動條>
<滾動條背景 背景色="#666666" 背景透明度="100" 邊框色="#666666" 邊框透明度="100" 邊框粗細(xì)="1" 寬="20"/>
<方塊 背景色="#000000" 背景透明度="100" 邊框色="#999999" 邊框透明度="100" 邊框粗細(xì)="0"/>
<三角 原始色="#ffff00" 活動色="#ff0000" 透明度="100"/>
<滑塊 背景色="#000000" 背景透明度="100" 邊框色="#999999" 邊框透明度="100" 邊框粗細(xì)="0"/>
</滾動條>

說明:

由于我這個滾動條是完全由AS寫成的,你只需要像在HTML網(wǎng)頁中插入JS腳本一樣,把上面的那段AS代碼插入你的文本域所在貞,運行后,就會自動繪制滾動條并吸附到你的文本框右邊了!
注意:
★你的文本域要命名為:wenben_txt。由于是練習(xí),我沒處理接口,不好意思:)
★你可以在XML中修改相應(yīng)的參數(shù)。
★這個滾動條基本具備了scrollbar組件的所有功能,包括精確定位,而且避免了在輸入文本時容易產(chǎn)生的滑塊跳動事件。當(dāng)然,最最關(guān)鍵的是:我這個滾動條只有2K多!
★這個作品純屬自娛自樂,挑戰(zhàn)自我。采用基于原型的AS1.0,代碼寫的比較亂,請前輩高手多多指教。

經(jīng)典論壇討論帖:
http://m.95time.cn/bbs/NewsDetail.asp?id=2497990

出處:藍(lán)色理想
責(zé)任編輯:moby

◎進(jìn)入論壇Flash專欄版塊參加討論

相關(guān)文章 更多相關(guān)鏈接
Flash Player 8.5 開始公測
Intel Mac 版 Flash Player 發(fā)布
Flash 與外部通訊的所有方法
Danger Video Player 1.0 發(fā)布
影響 ActiveX 內(nèi)容的 IE 升級包
關(guān)鍵字搜索 常規(guī)搜索 推薦文檔
熱門搜索:CSS Fireworks 設(shè)計比賽 網(wǎng)頁制作 web標(biāo)準(zhǔn) 用戶體驗 UE photoshop Dreamweaver Studio8 Flash 手繪 CG
站點最新 站點最新列表
周大福“敬•自然”設(shè)計大賽開啟
國際體驗設(shè)計大會7月將在京舉行
中國國防科技信息中心標(biāo)志征集
云計算如何讓安全問題可控
云計算是多數(shù)企業(yè)唯一擁抱互聯(lián)網(wǎng)的機會
阿里行云
云手機年終巨獻(xiàn),送禮標(biāo)配299起
阿里巴巴CTO王堅的"云和互聯(lián)網(wǎng)觀"
1499元買真八核 云OS雙蛋大促
首屆COCO桌面手機主題設(shè)計大賽
欄目最新 欄目最新列表
淺談JavaScript編程語言的編碼規(guī)范
如何在illustrator中繪制臺歷
Ps簡單繪制一個可愛的鉛筆圖標(biāo)
數(shù)據(jù)同步算法研究
用ps作簡單的作品展示頁面
CSS定位機制之一:普通流
25個最佳最閃亮的Eclipse開發(fā)項目
Illustrator中制作針線縫制文字效果
Photoshop制作印刷凹凸字體
VS2010中創(chuàng)建自定義SQL Rule

藍(lán)色理想版權(quán)申明:除部分特別聲明不要轉(zhuǎn)載,或者授權(quán)我站獨家播發(fā)的文章外,大家可以自由轉(zhuǎn)載我站點的原創(chuàng)文章,但原作者和來自我站的鏈接必須保留(非我站原創(chuàng)的,按照原來自一節(jié),自行鏈接)。文章版權(quán)歸我站和作者共有。

轉(zhuǎn)載要求:轉(zhuǎn)載之圖片、文件,鏈接請不要盜鏈到本站,且不準(zhǔn)打上各自站點的水印,亦不能抹去我站點水印。

特別注意:本站所提供的攝影照片,插畫,設(shè)計作品,如需使用,請與原作者聯(lián)系,版權(quán)歸原作者所有,文章若有侵犯作者版權(quán),請與我們聯(lián)系,我們將立即刪除修改。

您的評論
用戶名:  口令:
說明:輸入正確的用戶名和密碼才能參與評論。如果您不是本站會員,你可以注冊 為本站會員。
注意:文章中的鏈接、內(nèi)容等需要修改的錯誤,請用報告錯誤,以利文檔及時修改。
不評分 1 2 3 4 5
注意:請不要在評論中含與內(nèi)容無關(guān)的廣告鏈接,違者封ID
請您注意:
·不良評論請用報告管理員,以利管理員及時刪除。
·尊重網(wǎng)上道德,遵守中華人民共和國的各項有關(guān)法律法規(guī)
·承擔(dān)一切因您的行為而直接或間接導(dǎo)致的民事或刑事法律責(zé)任
·本站評論管理人員有權(quán)保留或刪除其管轄評論中的任意內(nèi)容
·您在本站發(fā)表的作品,本站有權(quán)在網(wǎng)站內(nèi)轉(zhuǎn)載或引用
·參與本評論即表明您已經(jīng)閱讀并接受上述條款
推薦文檔 | 打印文檔 | 評論文檔 | 報告錯誤  
專業(yè)書推薦 更多內(nèi)容
網(wǎng)站可用性測試及優(yōu)化指南
《寫給大家看的色彩書1》
《跟我去香港》
眾妙之門—網(wǎng)站UI 設(shè)計之道
《Flex 4.0 RIA開發(fā)寶典》
《贏在設(shè)計》
犀利開發(fā)—jQuery內(nèi)核詳解與實踐
作品集 更多內(nèi)容

雜⑦雜⑧ Gold NORMANA V2