Flex中如何通过buttonStyleName, fillColors和fillAlphas样式改变ButtonBar背景填充颜色的例子

By Minidxer | January 25, 2009

接下来的例子演示了Flex中如何通过buttonStyleName, fillColors和fillAlphas样式，改变ButtonBar背景填充颜色。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Style>
  8.         .allButtons2 {
  9.             /* Creates a gradient from red/orange when button is in the
  10.                "out" state. */
  11.             fillColors: red, haloOrange;
  12.         }
  13.  
  14.         .allButtons4 {
  15.             /* Creates a gradient from red/orange when button is in the
  16.                "out" state. Creates a gradient from green/blue when
  17.                button is in the "over" state. */
  18.             fillColors: red, haloOrange, haloGreen, haloBlue;
  19.         }
  20.  
  21.         .allButtonsSolid {
  22.             fillColors: red, red;
  23.         }
  24.  
  25.         .allButtonsSolidOpaque {
  26.             fillAlphas: 1.0, 1.0;
  27.             fillColors: red, red;
  28.         }
  29.     </mx:Style>
  30.  
  31.     <mx:ViewStack id="viewStack"
  32.             visible="false"
  33.             includeInLayout="false">
  34.         <mx:VBox label="One">
  35.             <mx:Label text="One" />
  36.         </mx:VBox>
  37.         <mx:VBox label="Two">
  38.             <mx:Label text="Two" />
  39.         </mx:VBox>
  40.         <mx:VBox label="Three">
  41.             <mx:Label text="Three" />
  42.         </mx:VBox>
  43.     </mx:ViewStack>
  44.  
  45.     <mx:Form>
  46.         <mx:FormItem label="2 fill colors defined:">
  47.             <mx:ButtonBar id="buttonBar2"
  48.                     buttonStyleName="allButtons2"
  49.                     dataProvider="{viewStack}" />
  50.         </mx:FormItem>
  51.         <mx:FormItem label="4 fill colors defined:">
  52.             <mx:ButtonBar id="buttonBar4"
  53.                     buttonStyleName="allButtons4"
  54.                     dataProvider="{viewStack}" />
  55.         </mx:FormItem>
  56.         <mx:FormItem label="solid fill:">
  57.             <mx:ButtonBar id="buttonBarSolid"
  58.                     buttonStyleName="allButtonsSolid"
  59.                     dataProvider="{viewStack}" />
  60.         </mx:FormItem>
  61.         <mx:FormItem label="solid opaque fill:">
  62.             <mx:ButtonBar id="buttonBarSolidOpaque"
  63.                     buttonStyleName="allButtonsSolidOpaque"
  64.                     dataProvider="{viewStack}" />
  65.         </mx:FormItem>
  66.     </mx:Form>
  67.  
  68. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: ButtonBar | 1 Comment » | Tags: , , ,

你可能还对下列文章感兴趣:

One comment | Add One

  1. moto - 12/8/2009 at 5:34 pm

    ? is there a problem,the swf doesn’t match to the code.

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll