플렉스에서 수직 그래디언트를 만드는 방법

Question

플렉스에서 수직 그래디언트를 만드는 방법.

현재 수평 색 그라데이션이 있습니다. 그리고 잘 작동합니다. 하지만 내가해야 방법을 알아낼 수없는 나는 그것을 수직

I 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은

Answer 1

Flex 3에서는 요소에 그라디언트를 적용하는 가장 쉬운 방법은 Degrafa와 우수한 CSSSkin 클래스를 사용하는 것입니다. 그 유연성의 좋은 예가 여기에 있습니다 : Nice and Easy Gradients with CSSSkin

Answer 2

당신은 프로그램 스킨과 그것을 할 수 있습니다.

1. 테두리에서 상속하는 새 클래스를 만듭니다. 이 같은 뭔가

2. 재정의 updateDisplayList :

   super.updateDisplayList (W, H);
   var g : 그래픽 = this.graphics;

   g.clear();

   varm : Matrix = new Matrix(); m.createGradientBox (w, h); g.lineStyle (0,0,0); g.beginGradientFill (GradientType.LINEAR, [color1, color2], [alpha1, alpha2], [0,0xFF], m); g.drawRect (0,0, w, h); g.endFill();

3. 스타일 섹션의 ClassReference를 사용하여이 클래스를 스킨으로 참조하십시오.

Answer 3

이 당신의 CSS에 연결되지 않지만 플렉스 4 MXML에서 수직 방향의 그라데이션은 다음과 같습니다

<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"을 추가 시도?