VGroup : 추가/제거 할 때 새 요소를 부드럽게 표시하는 방법 (

Question

) VGroup에서 /로 요소를 추가/제거 할 때 항목이 부드럽게 움직 이도록해야합니다. 전환 효과를 사용해야한다고 생각합니다. 그러나 어떻게?

1. 항목 (요소) 레벨에서?
2. VGroup 수준?
3. 대신 DataGroup을 사용하고 ItemRenderer 레벨에서해야합니까?

나는 항목 수준에서 해보려고했지만 여전히 제대로 작동하지 못하고 어떻게 든 옳은 생각을하지 못합니다. 그것은 그것이 더 높은 차원에서 행해져 야하는 것처럼 느껴집니다.

예를 들어, 항목을 height = 0으로 크기를 조정하는 "죽음"상태를 정의했습니다. 그러나 그 후에 축소 된 후에 VGroup이 VGroup에서 제거되거나 제거되도록 VGroup에 알립니다. 그것은 불필요하게 복잡하다고 느낍니다.

내가 바라는 건 VGroup에서 항목을 삽입하고 제거하는 효과를 연결하는 것입니다. 어떤 아이디어? 나는 구성 요소 패널/컨테이너에 추가하는 경우에 대한 크기 조정 효과를 수행하는 (VGROUP에 대한 정확한 같은 것)을 HGroup에 다음 코드를 삽입 한

Answer 1

는 내가이 작업을 수행 할 수있는 적절한 방법을 찾을 생각합니다. 구성 요소가 VGroup의 자식으로 추가 될 때 호출되는 두 개의 이벤트 "addedEffect"및 "removedEffect"가 있습니다.

<?xml version="1.0" encoding="utf-8"?> 
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" 
     width="100%" 
     addedEffect="{addedEffect}" 
     removedEffect="{removedEffect}" 
     clipAndEnableScrolling="true" xmlns:gui="gui.*"> 

    <fx:Declarations> 

    <s:Sequence id="addedEffect" targets="{[this, callWindow]}"> 
     <s:Move duration="300" xTo="0" target="{callWindow}" /> 
    </s:Sequence> 

    <s:Sequence id="removedEffect" targets="{[this, callWindow]}"> 
     <s:Move duration="300" xFrom="0" xTo="300" target="{callWindow}" /> 
     <s:Scale target="{this}" 
       scaleYFrom="1.0" scaleYTo="0.0" 
       duration="300"/> 
    </s:Sequence> 

    </fx:Declarations> 

    <gui:CallWindow id="callWindow" 
        width="100%" minHeight="0" x="300" /> 

</s:Group> 

그래서 항목 수준에서 수행되지만 우아한 방법이 있습니다.

덕분에, 누누

Answer 2

사전에

감사합니다, 누누, 수 올바른 방향으로 가리 키세요. 당신은 그것이 다음 링크를 작업을 볼 수 있습니다

http://bbishop.org/blog/?p=448

public class ComboContainer extends HGroup 
    { 
     private var resizeEffect:Resize; 
     private var fadeEffect:Fade; 

     private var defaultHeight:int = 50; 

     public function ComboContainer() 
     { 
      super(); 
      this.height 0; 
      this.verticalAlign = flashx.textLayout.formats.VerticalAlign.MIDDLE;  
      this.addEventListener(FlexEvent.CREATION_COMPLETE, onCreationComplete); 
     } 

     private function onCreationComplete(event:Event):void{ 

      resizeEffect = new Resize(); 
      resizeEffect.heightFrom = 0; 
      resizeEffect.heightTo = defaultHeight; 
      resizeEffect.duration = 200; 

      fadeEffect = new Fade(); 
      fadeEffect.alphaFrom = 0; 
      fadeEffect.alphaTo = 1; 
      fadeEffect.duration = 200; 

      fadeEffect.play([this]); 
      resizeEffect.play([this]); 
     }