如何在 MXML 视图中遍历子项？答案

【问题标题】：How to loop through children in MXML View?如何在 MXML 视图中遍历子项？
【发布时间】：2011-07-09 09:06:15
【问题描述】：

我有 mxml 组件，并希望遍历它的所有子组件，我在其中创建了这些子组件，而不是更深入。例如我有这样的观点：

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"
         xmlns:chat="org.mirapolis.virtualroom.chat.*"
         height="100%" width="100%" 
         initialize="init()" >
    <fx:Script>
        <![CDATA[                   
            import org.mirapolis.virtualroom.chat.ChatModule;

            private function init() : void{
                setDisplayStrategy(this);
            }
            private function setDisplayStrategy(element :  UIComponent) : void{
                for(var i : int = 0; i < element.numChildren; i++){
                    var child : UIComponent = element.getChildAt(i) as UIComponent;
                    if (child != null && child.descriptor != null){
                        trace(child);
                        setDisplayStrategy(child);
                    }
                }
            }

        ]]>
    </fx:Script>
    <mx:VBox>
        <mx:Form>
            <mx:FormItem label="email">
                <s:TextInput id="email" />
            </mx:FormItem>
            <mx:FormItem>
                <s:Button
                    label="submit" />
            </mx:FormItem>
        </mx:Form>
    </mx:VBox>
    <chat:ChatView id="id1" />
    <chat:ChatView id="id2" />
</mx:VBox>

trace 会给我这个

videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem10
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem10.email
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem16
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem16.Button17
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2

这正是我所需要的。但是，如果我在视图中添加任何火花元素，child.descriptor 将给出null，整个事情就会崩溃。如果没有child.descriptor，请检查此代码将在所有组件中更深入，这是绝对不需要的。

所以我的问题是 - 是否有可能获取所有已添加到 mxml 视图的子项？

统一更新： 现在效果更好了：

public static function setDisplayStrategy(element : UIComponent) : void{
            trace(element);
            if (element is IVisualElementContainer){
                for(var i : int = 0; i < (element as IVisualElementContainer).numElements; i++){
                    var child : UIComponent = (element as IVisualElementContainer).getElementAt(i) as UIComponent;
                    if (child){
                        setDisplayStrategy(child);
                    }
                }
            }
        }

但仍然需要太多的深度：

videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem10
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem10.email
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem16
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.VBox8.Form9.FormItem16.Button17
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1.chatWrapper
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1.chatWrapper.ScrollerSkin28.Group24
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1.chatWrapper.ScrollerSkin28.Group24.chatArea
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1.userMessage
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id1.send
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2.chatWrapper
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2.chatWrapper.ScrollerSkin105.Group101
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2.chatWrapper.ScrollerSkin105.Group101.chatArea
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2.userMessage
videoconference.ApplicationSkin2._ApplicationSkin_Group1.contentGroup.MainView7.id2.send

在我的示例中是否可以在 MainView7.id1 和 MainView7.id2 上停止？

【问题讨论】：

标签： actionscript-3 flash apache-flex mxml flex-spark

【解决方案1】：

我认为您需要遍历 numElement 属性。

但是，我建议您阅读这篇出色的帖子here

【讨论】：

谢谢！ numElements 帮助我避免了大部分不需要的元素，但我的主要问题是查看当前 mxml 中的所有元素（请参阅我的更新）。