如何在flex中創建垂直漸變

我目前有什麼是一個水平的顏色漸變。它的工作正常。但我無法弄清楚我應該怎麼讓它垂直（這ofcourse是要求）我使用的styleName =「chatWindowLeftGradient」

<mx:VBox id="chatTabBarVBox" height="100%" styleName="chatWindowLeftGradient"> 

</mx:VBox>

而且樣式表如下所示：

<mx:Style> 
     .chatWindowLeftGradient{       
      backgroundImage: ClassReference("custom.GradientBackground"); 
      backgroundSize: "100%"; 
      fillColors: #6db263, #a4d9a1; 
      fillAlphas: 1, 1;       
     } 

    </mx:Style>

這給出從上到下的漸變。我怎麼能從左到右？

問候 Zeeshan

來源

2010-04-02 Zeeshan Rang

在Flex 3中，對元素應用漸變的最簡單方法是使用Degrafa及其出色的CSSSkin類。其靈活性的一些很好的例子在這裏：Nice and Easy Gradients with CSSSkin

來源

2011-02-04 04:42:39

你可以用一個綱領性的皮膚做。

創建一個從Border繼承的新類。
改寫用的updateDisplayList是這樣的：

super.updateDisplayList（W，H）;
var g：Graphics = this.graphics;

g.clear（）;

var m：Matrix = new Matrix（）; m.createGradientBox（w，h）; g.lineStyle（0,0,0）; （GradientType.LINEAR，[color1，color2]，[alpha1，alpha2]，[0,0xFF]，m）; g.drawRect（0,0，w，h）; g.endFill（）;
在style部分使用ClassReference引用這個類作爲你的皮膚。

來源

2010-04-03 04:15:47 Glenn

這將不只是插入到你的CSS，但在Flex的MXML 4垂直梯度是這樣的：

<s:Rect right="0" top="0" width="170" bottom="0"> 
    <s:fill> 
     <mx:LinearGradient rotation="90"> 
      <mx:entries> 
       <mx:GradientEntry color="#64574A"/> 
       <mx:GradientEntry color="#FFFFCC"/> 
      </mx:entries> 
     </mx:LinearGradient> 
    </s:fill> 
</s:Rect>

您是否嘗試過加入了旋轉=「90」到你的風格？

來源

2010-04-04 21:10:52 Andrew

正是我一直在尋找！謝謝！ – DaTroop 2011-07-19 14:43:56

如何在flex中創建垂直漸變

回答

相關問題