如何判断元素何时最终显示在屏幕上?

时间:2012-09-27 17:33:34

标签: flex

我在向容器添加大量自定义元素时显示“正在加载”对话框。当调用最后添加的元素的creationCompleteHandler时,我将对话框设置为消失,但是在屏幕上显示所有元素之前对话框消失(导致非常大的延迟)。

以下是我正在做的一个例子:

for (var i:int = 0; i < 100; i++) {
    var elem:MyElement = new MyElement();
    elem.name = "elem" + i;
    container.addElement(elem);

    if (i == 99) {
        elem.creationComplete = function():void {
            PopUpManager.removePopUp(loadingDialog);
        };
    }
}

正如我所说,在屏幕上显示所有元素之前,对话框会消失。有没有办法告诉我们何时添加了所有自定义元素并且当前正在屏幕上显示?

更新:为了澄清,elem.creationComplete只是一个自定义属性函数,在调用元素的creationCompleteHandler时会调用它。

2 个答案:

答案 0 :(得分:1)

元素,即使它们按正确的顺序添加,也不会按顺序创建:

        private function doStuff():void {
            PopUpManager.addPopUp(myPopup, this);
            for (var i:int = 0; i < 10; i++) {
                var elem:MyElement = new MyElement();
                elem.name = "elem" + i;
                container.addElement(elem);

                elem.addEventListener(FlexEvent.CREATION_COMPLETE, function(e:FlexEvent):void {
                    trace("i'm done " + e.target.name);
                });

                if (i == 9) {
                    elem.addEventListener(FlexEvent.CREATION_COMPLETE, function():void {
                        trace("i'll remove the popup " + elem.name);
                        PopUpManager.removePopUp(myPopup);
                    });
                }
            }
        }

给出:

i'm done elem5
i'm done elem7
i'm done elem0
i'm done elem8
i'm done elem6
i'm done elem3
i'm done elem9
i'll remove the popup elem9
i'm done elem1
i'm done elem4
i'm done elem2

您需要添加一个全局变量来检查是否实际创建了所有元素:

public var created:int = 0;

        private function doStuff():void {
            PopUpManager.addPopUp(myPopup, this);

            for (var i:int = 0; i < 10; i++) {
                var elem:MyElement = new MyElement();
                elem.name = "elem" + i;
                container.addElement(elem);
                created++; // <--- increment with each new element

                elem.addEventListener(FlexEvent.CREATION_COMPLETE, function(e:FlexEvent):void {
                    created--;  // <--- decrement when element is created
                    trace("i'm done ", e.target.name);
                    if (created == 0) {
                        trace("i'll remove it ", e.target.name);
                        PopUpManager.removePopUp(myPopup);
                    }
                });
            }
        }

结果是:

i'm done  elem5
i'm done  elem7
i'm done  elem0
i'm done  elem8
i'm done  elem6
i'm done  elem3
i'm done  elem9
i'm done  elem1
i'm done  elem4
i'm done  elem2
i'll remove it  elem2

答案 1 :(得分:1)

为了解决这个问题,我遵循了jidma的回答,除了我收听了PropertyChanged事件,并在容器上更改contentHeight属性时递减。仅当容器的高度受添加的元素影响时才会减少,这似乎有效。