Question

在VGroup中添加/删除元素时，我需要顺利进行，调整项目大小。我相信我必须使用过渡效果。但是如何？

在item（元素）级别？
在VGroup级别？
我应该使用DataGroup而是在ItemRenderer级别执行吗？

我一直在尝试在项目级别进行，但我仍然没有设法让它工作，不知怎的，它感觉不对。感觉它应该在更高的层次上完成。

例如，我定义了一个“死亡”状态，它将项目的大小调整为height = 0。但是，在缩小之后，它必须以某种方式通知VGroup，以便将其从VGroup中移除或移除。感觉不必要的复杂。

我希望将一种效果与从VGroup插入和删除项目相关联的方法是什么？有什么想法吗？

提前致谢，努诺

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

我已将以下代码放在HGroup中（对VGroup来说完全相同），以便在将组件添加到面板/容器时执行调整大小效果，可以指向正确的方向。您可以看到它正在运行以下链接：

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]);
        }

VGroup：如何在添加/删除时平滑地显示新元素（调整大小）

2 个答案: