0

这里真的需要一点帮助...也许一些演练或阐明如何解决它..我确实用纯动作脚本为我的动作栏蒙皮只是我不知道如何删除导航内容之间的分段边框，动作内容和titleDisplay..也许一些视觉会描述更多细节..希望有人能帮我解决这个问题..thaks in Advanced

删除 ActionBar 段边框

这是我的动作脚本代码尝试

package skins{

import mx.core.DPIClassification;
import spark.skins.mobile.ActionBarSkin;


public class ActionBarCusSkin extends ActionBarSkin{




    public function ActionBarCusSkin(){
        super();


        borderClass = null;

    }

    override protected function drawBackground(unscaledWidth:Number, unscaledHeight:Number):void {
        var chromeColor:uint = getStyle("chromeColor");

        var backgroundAlphaValue:Number = getStyle("backgroundAlpha");



        // border size is twice as big on 320

        var borderSize:int = 1;

        if (applicationDPI == DPIClassification.DPI_320)

            borderSize = 2;



        graphics.beginFill(chromeColor, backgroundAlphaValue);

        graphics.drawRect(0, borderSize, unscaledWidth, unscaledHeight - (borderSize * 2));

        graphics.endFill();
    }



}

}

4

1 回答 1

1

您要从 Actionbar 中删除的边框属于出现在 actionGroup(actionContent) 或 navigationGroup(navigationContent) 内的 Button。它由两个皮肤 upBorderSkin 和 downBorderSkin 控制（这些是 spark.skins.assets.mobile 包内的 2 个 fxg 文件）。我在我的情况下所做的删除它的是，我从 upBorderSkin (spark.skins.assets.mobile.TransparentNavigation_up.fxg 复制了源代码，并在包 assets.mobile.BorderLessNavigationButtonSkin 中创建了一个文件 BorderLessNavigationButtonSkin。 fxg 如下（有一个 Rect 分隔符 dark 显示垂直边框，我只是将 alpha 属性设置为 0 ）

<?xml 版本="1.0" 编码="UTF-8"?>

<图形版本="2.0" xmlns="http://ns.adobe.com/fxg/2008" scaleGridTop="1" scaleGridBottom="64" scaleGridLeft="1" scaleGridRight="79" >

<!-- highlight border right -->
<Rect x="79" y="1" width="1" height="63">
    <fill>
        <LinearGradient x="0" scaleX="63" rotation="90">
            <GradientEntry color="#ffffff" ratio="0" alpha=".15"/>
            <GradientEntry color="#ffffff" ratio="1" alpha=".1"/>
        </LinearGradient>
    </fill>
</Rect>

<!-- separator dark -->
<Rect x="80" y="0" width="1" height="65">
    <fill>
        <SolidColor color="#000000" alpha="0.0"/><!--this alpha attribute was set to 0 in order not to appear -->
    </fill>
</Rect>

<!-- highlight border trailing -->
<Rect x="81" y="1" width="1" height="63">
    <fill>
        <LinearGradient x="0" scaleX="63" rotation="90">
            <GradientEntry color="#ffffff" ratio="0" alpha=".15"/>
            <GradientEntry color="#ffffff" ratio="1" alpha=".1"/>
        </LinearGradient>
    </fill>
</Rect>

<!-- invisible fix for scaling -->
<Rect x="0" y="0" width="82" height="65">
    <fill>
        <SolidColor color="#ffffff" alpha="0"/>
    </fill>
</Rect>

</图形>

然后我创建了一个新的按钮皮肤，它使用以下代码扩展了透明导航按钮皮肤

包皮肤 { 导入 assets.mobile.BorderlessNavigationButtonSkin;

import mx.core.mx_internal;

import spark.skins.mobile.TransparentNavigationButtonSkin;

use namespace mx_internal;


public class NavigationButtonSkin extends TransparentNavigationButtonSkin
{
    public function NavigationButtonSkin()
    {
        super();
        upBorderSkin = assets.mobile.BorderlessNavigationButtonSkin;
        downBorderSkin = assets.mobile.BorderlessNavigationButtonSkin;
    }

    override mx_internal function layoutBorder(unscaledWidth:Number, unscaledHeight:Number):void
    {
        // trailing vertical separator is outside the right bounds of the button
        //setElementSize(border, unscaledWidth + layoutBorderSize, unscaledHeight);
        //setElementPosition(border, 0, 0);

        setElementSize(border, 0, 0 );
        setElementPosition(border, 0, 0);
    }

    override protected function getBorderClassForCurrentState():Class
    {

        if (currentState == "down") 
            return downBorderSkin;
        else
            return upBorderSkin;

    }
}

}

最后是应用程序级别的全局css样式，用于actionGroup或navigationGroup ActionBar内的按钮

s|ActionBar s|Group#navigationGroup s|Button { skinClass: ClassReference("skins.NavigationButtonSkin"); }

我确信通过在 css 类中设置 upBorderSkin 和 downBorderSkin 以及仅 fxg 文件有一种更简单的方法，但在我的情况下，我还创建了一个自定义 ActionBar，因为我不想要背景渐变以及顶部和底部边界，它变得有点复杂

于 2013-10-13T18:13:02.647 回答