2011-04-25 65 views
0

你怎么在ctrl按钮上放一个简单的渐变? 我一直在寻找,我根本不感兴趣,看起来很奇怪,所有的脏代码只有一个简单的渐变。如何在Flex 4中的按钮栏的按钮中放置一个简单的渐变?

这是我的CSS

.my_ButtonBar{ 
    buttonStyleName: "buttonBarButton"; 
    firstButtonStyleName: "firstButtonBarButton"; 
    lastButtonStyleName: "lastButtonBarButton"; 
} 

.buttonBarButton 
{ 
    fillColors: red, red; 
} 

这是我的MXML

<s:ButtonBar dataProvider="{viewstack}" width="200" top="0" left="0" styleName="main_ButtonBar"> 
    <s:layout> 
     <s:TileLayout columnWidth="200" rowHeight="50" 
       horizontalGap="-1" verticalGap="-1" /> 
    </s:layout> 
</s:ButtonBar> 

user700284的回复我创建基础上,按钮栏类的新的skinClass后。

<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" 
     alpha.disabled="0.5"> 

    <fx:Metadata> 
    <![CDATA[ 
     /** 
     * @copy spark.skins.spark.ApplicationSkin#hostComponent 
     */ 
     [HostComponent("spark.components.ButtonBar")] 
    ]]> 
    </fx:Metadata> 

    <s:states> 
     <s:State name="normal" /> 
     <s:State name="disabled" /> 
    </s:states> 

    <fx:Declarations> 
     <fx:Component id="firstButton"> 
      <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarFirstButtonSkin" /> 
     </fx:Component> 

     <fx:Component id="middleButton" > 
      <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarMiddleButtonSkin" /> 
     </fx:Component> 

     <fx:Component id="lastButton" > 
      <s:ButtonBarButton skinClass="spark.skins.spark.ButtonBarLastButtonSkin" /> 
     </fx:Component> 
    </fx:Declarations> 

    <s:DataGroup id="dataGroup" width="100%" height="100%"> 
     <s:layout> 
     <s:TileLayout columnWidth="200" rowHeight="50" 
      horizontalGap="-1" verticalGap="-1" /> 
     </s:layout> 
    </s:DataGroup> 
</s:Skin> 

如果我添加rect填充它将填满整个buttonbar而不是单独的每个按钮。我怎么才能在按钮上放一个简单的渐变?????

回答

0

有是修改默认的颜色火花风格“chromeColor的”。 FTQuest