Flex 移动应用程序中的 iOS 7 操作栏外观

Question

如何在 flex 移动应用程序中获得 iOS 7 操作栏外观，我希望我的操作栏完全平坦和半透明，我看到的帖子很少；那些谈论通过自定义皮肤使操作栏平坦但没有人谈论透明度......任何帮助或指向正确的方向将不胜感激....

Answer 1

您需要做的就是设置 alpha自定义皮肤上的属性:

来自 Adob​​e 的 help documentation :

我为按钮的背景/边框添加了透明填充 <s:Rect>

<?xml version="1.0" encoding="utf-8"?>
<!-- SparkSkinning/GlobalVariableAccessorExample.mxml -->
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark">

    <fx:Script>
        public var myLabelString:String = "Hello World";
    </fx:Script>

    <s:Button skinClass="mySkins.GlobalVariableAccessorSkin"/>

</s:Application>



<?xml version="1.0" encoding="utf-8"?>
<!-- SparkSkinning\mySkins\GlobalVariableAccessorSkin.mxml -->
<s:Skin 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    minWidth="21" minHeight="21">

    <fx:Metadata>
        [HostComponent("spark.components.Button")]
    </fx:Metadata> 

    <fx:Script>
        import mx.core.FlexGlobals;        

        [Bindable]
        private var localString:String = FlexGlobals.topLevelApplication.myLabelString;
    </fx:Script>

    <!-- Specify one state for each SkinState metadata in the host component's class -->
    <s:states>
        <s:State name="up"/>
        <s:State name="over"/>
        <s:State name="down"/>
        <s:State name="disabled"/>
    </s:states>

    <s:Rect 
        left="0" right="0" 
        top="0" bottom="0" 
        width="69" height="20" 
        radiusX="2" radiusY="2">
        <s:stroke>
            <s:SolidColorStroke color="0x000000" weight="1"/>
        </s:stroke>
        <!--
          This section added to demonstrate
        -->
        <s:fill>
            <s:SolidColor color="0x999999" alpha="0.5"/>
        </s:fill>
        <!--  ----------------------- -->
    </s:Rect>

    <s:Label id="labelDisplay" 
        text="{localString}"
        horizontalCenter="0" verticalCenter="1"
        left="10" right="10" top="2" bottom="2">
    </s:Label>
</s:Skin>