tion %> 山东麻将规则和牌
當前位置:首頁 > 建站知識

為水平和垂直滾動條交匯處的白塊添加樣式

更新時間:2009.06.22 瀏覽次數:

aihanzi提了很多建議,非常感謝 :)

對于容器中出現水平和垂直滾動條時,兩條滾動條交匯處會生成一個純白色的矩形,目前并無樣式支持。對FLEX theme的編寫多少有些影響。

綜合aihanzi的建議和網上的資料,修改了mx.core.Container類,添加了三個基本的樣式屬性:

whiteBoxColor - 顏色(明明是white box,還要設置顏色 -_-!!!)
whiteBoxAlpha - 透明度
whiteBoxVisible - 是否可見


先看示例: Demo

接下來正式開工:

我們首先進入到FLEX SDK(本文適用sdk 3.2.0版)中:

sdks/3.2.0/frameworks/projects/framework/src/mx/core

將Container.as,Version.as復制到當前項目中,包路徑也要相同,就是說復制到項目中mx/core文件夾下。

然后再用相同的方法將SDK中的mx.styles.metadata下面的:

    BarColorStyle.as
    BorderStyles.as
    PaddingStyles.as
    TextStyles.as

復制到項目中。最后結構如圖:

 

然后打開Container.as,找到createOrDestroyScrollbars方法(4401行),然后定位到4540行,
可以看到下面幾行代碼是設置whiteBox的。

我們修改生成whiteBox的代碼部分,加入支持的樣式,最后代碼如下:
            if (!whiteBox)
            {
                whiteBox = new FlexShape();
                whiteBox.name = "whiteBox";

                var g:Graphics = whiteBox.graphics;
               
                var wbc:Number = StyleManager.getColorName(getStyle("whiteBoxColor"));
                var wba:Number = Number(getStyle("whiteBoxAlpha"));
                isNaN(wbc) ? wbc = 0xFFFFFF : null;
                isNaN(wba) ? wba = 1.0 : null;
                g.beginFill(wbc, wba);
               
                g.drawRect(0, 0, verticalScrollBar.minWidth, horizontalScrollBar.minHeight);
                g.endFill()

                rawChildren.addChild(whiteBox);
               
                var wbv:Boolean = getStyle("whiteBoxVisible").toString().toLowerCase()!="false";
                whiteBox.visible = wbv;
            }

上面是生成whiteBox的代碼,那么若樣式在運行時修改呢?
別急,我們再定位到2987行的styleChanged方法。

我們在方法尾部加入:
if (allStyles ||
            styleProp == "whiteBoxColor" ||
            styleProp == "whiteBoxAlpha" ||
            styleProp == "whiteBoxVisible")
        {
            if (whiteBox)
            {
                var wbv:Boolean = getStyle("whiteBoxVisible").toString().toLowerCase()!="false";
                whiteBox.visible = wbv;
               
                var g:Graphics = whiteBox.graphics;
                g.clear();
               
                var wbc:uint = StyleManager.getColorName(getStyle("whiteBoxColor"));
                var wba:Number = Number(getStyle("whiteBoxAlpha"));
               
                isNaN(wbc) ? wbc = 0xFFFFFF : null;
                isNaN(wba) ? wba = 1.0 : null;
                g.beginFill(wbc, wba);
               
                g.drawRect(0, 0, verticalScrollBar.minWidth, horizontalScrollBar.minHeight);
                g.endFill();
            }
        }

當相關樣式發生改變時whiteBox將重新繪制。

回到主程序,加入樣式表:

<mx:Style>
        Canvas
        {
            whiteBoxColor:#000000;
            whiteBoxAlpha:1.0;
            whiteBoxVisible:true;
        }
    </mx:Style>


然后拖入一個Canvas到Application中,將水平和垂直滾動條打開。編譯運行便可發現原來的白塊變成黑色的了。若運行時動態改變色彩,可以使用以下語句:

var css:CSSStyleDeclaration = StyleManager.getStyleDeclaration("mx.core.Canvas");
if(css)
    css.setStyle("whiteBoxColor", color);


源代碼: Source


參考資料:

AIRIA BBS:Edison.sl

flex-using-custom-scrollbar-skins-youll-run-into-this-problem

改了標題了,通俗一些 :)
本文原標題: 為Container的whiteBox添加樣式

烟台麻将规则 北京麻将规则 l篮球比分网 上海快3 竞彩竞彩比分直播 山东11选5开奖统 好友局麻将app下载 安卓单机美女麻将app 3d的试机号是多少 泽考英龙华 3d历史试机号 ds足球比分app下载 苹果 cba比分结果今 广东11选5精准* 排列三试机号开奖助 甘肃麻将游戏下载安装 陕西快乐十分