플렉스 : 전환 된 상태 변경 후 내용이 올바르게 렌더링되지 않음

Question

2 개의 상태가있는 구성 요소가 있고 2 개의 다른 대상에 2 개의 이동 영향이 적용되는 상태를 전환하기위한 전환이 추가되었습니다. 그러나 첫 번째 상태에서 두 번째 상태로의 전환이 완료되면 두 번째 상태가 올바르게 렌더링되지 않습니다. 여기에는 보이지 않는 TextInput 컨트롤과 때로는 표시되고 사용자가 클릭하면 사라지는 사용자 정의 스킨이있는 Button이 있습니다. 두 번째 상태를로드 한 후에 invalidateDisplayList() 및 validateNow()를 호출했지만 아무것도 수행하지 않았습니다. 나는 또한 VBox에 cornerRadius 속성이 설정되어있다. 이상하게도 더 이상 적용되지 않는 것처럼 보이고 모서리가 정사각형으로 표시되어 전환을 추가하기 전에 올바르게 표시된다.

감사합니다. 변수는 마스크로 설정되는

<mx:Canvas id="freeStateCanvas" 
      width="100%"> 

    <mx:VBox width="100%" 
      horizontalAlign="center" 
      top="0" 
      mask="{_useForFreeMask}"> 

     <mx:VBox id="freeBox" 
       includeIn="useForFree"> 
      <s:Label text="some text"/> 
      <s:Spacer height="20"/> 
      <s:Image source="image path"/> 
      <s:Spacer height="20"/> 
      <mx:Button id="connectBtn"/> 
      <s:Spacer height="10"/> 
      <mx:HBox > 
       <s:Label text="some text"/>/> 
      </mx:HBox> 
     </mx:VBox> 

     <s:Label text="some text" 
       includeIn="useForFree"/>   
    </mx:VBox> 

     <mx:Button id="enterLicenceBtn" 
        includeIn="useForFree"/> 

</mx:Canvas> 

<!-- enter licence state --> 

<mx:Canvas id="enterLicenceStateCanvas" 
      width="100%"> 

     <mx:VBox id="enterLicenceBox"      
       mask="{_enterLicenceMask}" 
       includeIn="enterLicence"> 

      <s:Label text="some text"/> 
      <s:Spacer height="20"/> 
      <s:TextInput id="licenceInput" 
         width="200" 
         height="30"/> 
      <s:Spacer height="20"/> 
      <mx:Button id="registerBtn"/> 
      <s:Spacer height="10"/> 
      <mx:HBox> 
       <s:Label text="some text"/> 
       <s:Label text="some more text"/> 
      </mx:HBox> 
     </mx:VBox> 

     <mx:Button id="freeBtn" 
        includeIn="enterLicence"/> 

</mx:Canvas> 

가 UIComponent를 인스턴스 : 여기

<!-- different states of this component --> 
<mx:states> 
    <s:State name="useForFree" 
      enterState="renderState()"/> 
    <s:State name="enterLicence" 
      enterState="renderState()"/> 
</mx:states> 


<!-- transitions between different states --> 
<mx:transitions> 

    <!-- transition from useForFree to enterLicence state --> 
    <s:Transition id="toEnterLicence" 
        fromState="useForFree" 
        toState="enterLicence"> 
     <s:Parallel id="p1" 
        targets="{[freeBtn, _enterLicenceMask]}">    
      <s:Move yFrom="250" 
        yTo="0" 
        duration="500" 
        targets="{[freeBtn]}"/> 
      <s:Move yFrom="289" 
        yTo="39" 
        duration="500" 
        targets="{[_enterLicenceMask]}"/> 
     </s:Parallel>  
    </s:Transition> 

    <!-- transition from enterLicence to useForFree state --> 
    <s:Transition id="toUseForFree" 
        fromState="enterLicence" 
        toState="useForFree"> 
     <s:Parallel id="p2" 
        targets="{[enterLicenceBtn, _useForFreeMask]}">    
      <s:Move yFrom="0" 
        yTo="240" 
        duration="500" 
        targets="{[enterLicenceBtn]}"/> 
      <s:Move yFrom="-250" 
        yTo="0" 
        duration="500" 
        targets="{[_useForFreeMask]}"/> 
     </s:Parallel>  
    </s:Transition> 
</mx:transitions> 

내 레이아웃에 대한 코드입니다 : 여기

내 상태와 자신의 전환을위한 코드가 여기서 그래픽 속성을 사용하여 사각형을 그립니다.

Answer 1

좋아요, 그래서 문제가 무엇인지 알았지 만, 샤우 후센을 도와 주심에 감사드립니다.

내 코드에는 "freeBox"및 "enterLicenceBox"라는 2 개의 VBox 컨테이너가 있으며 실제로는 흰색 배경과 둥근 모서리가 있고 DropShadowFilter가 적용되어 있습니다 (코드를 배치 할 때이 속성을 제거했습니다. 나는 그들이 무관하다고 느꼈으므로, 그것은 실수였다.)

이 DropShadowFilter가 내 모든 문제의 원인이었으며 제거시 전환 효과가 좋았으며 모든 콘텐츠가 올바르게 렌더링되었습니다. 나는 이것이 이상한 플렉스 버그라고 가정하고, 해결 방법을 찾지 못했고, 나는 이미지를 상자 모양의 배경으로 사용하여 빠른 수정을했습니다.