MXML 类的子元素未出现

Question

我正在开发一个简单的任务/日历工具，可以将任务动态添加到画布中。这是 Main.mxml 中定义的主应用程序，它本质上只是一个 Canvas 和一个用于添加任务的按钮：

    <?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Canvas id="MainCanvas" borderStyle="solid" width="300" height="300">
        <mx:Button click="CreateTask();"  label="create task" />
    </mx:Canvas>
    <mx:Script>
    <![CDATA[
        import Task;
        private function CreateTask(  ) : void
        {
            // create the task object
            var thisTask:Task = new Task();
            // add the task to the canvas
            var taskUI : DisplayObject = MainCanvas.addChild( thisTask );
            // position the task ui
            taskUI.y = 50;
        }
    ]]>
    </mx:Script>
</mx:Application>

我希望我的任务是带有标签和按钮的 BorderContainers，在外部 mxml 中定义，可以简单地是在 Main.mxml 中实例化并添加到画布。这是 Tasks.mxml：

<?xml version="1.0" encoding="utf-8"?>
<s:BorderContainer xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:s="library://ns.adobe.com/flex/spark" cornerRadius="10">
    <s:layout>
        <s:HorizontalLayout/>
    </s:layout>
    <s:Label id="NameLabel" text="task name" />
    <s:Button label="Button 1"/>
</s:BorderContainer>

问题是，当我将任务实例添加到画布时，子项（按钮和标签）不会出现。我尝试在 Canvas 和 BorderContainer 上设置creationPolicy =“all”，但它仍然不起作用。我读过很多关于人们在类完全加载之前访问类成员时遇到问题的帖子，但我想做的就是看到 Label 和 Button 显示在 BorderContainer 内。

谢谢。

Answer 1

如果您想将 mx 和 Spark 控件混合在一起，您需要从 flex 3 mx 命名空间移至较新的命名空间。

这是您的 main.mxml ，其中包含新的 mx 命名空间 (library://ns.adobe.com/flex/mx)，并且添加了 fx 命名空间来处理脚本块：

<?xml version="1.0" encoding="utf-8"?>
  <mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" >
  <fx:Script>
  <![CDATA[
      import Task;
      private function CreateTask(  ) : void
      {
          // create the task object
          var thisTask:Task = new Task();
          // add the task to the canvas
          var taskUI : DisplayObject = MainCanvas.addChild( thisTask );
          // position the task ui
          taskUI.y = 50;
      }
  ]]>
  </fx:Script>
  <mx:Canvas id="MainCanvas" borderStyle="solid" width="300" height="300">
      <mx:Button click="CreateTask();"  label="create task" />
  </mx:Canvas>
</mx:Application>

尽管正如其他人评论的那样，您可以将所有内容移过去激发 - 如果您这样做，请务必将 addChild 调用更改为 addElement。

Answer 2

看来，将 Spark 组件添加到 mx:canvas 永远不会触发创建 Spark 组件的子组件所需的代码。这是一个适合您的解决方法：

<?xml version = "1.0" encoding = "utf-8"?>
<s:BorderContainer 
    xmlns:mx = "http://www.adobe.com/2006/mxml"
    xmlns:s = "library://ns.adobe.com/flex/spark"
    cornerRadius = "10"
    creationComplete = "{addElement(poorUseOfContainers)}">

    <s:HGroup id = "poorUseOfContainers"
        width = "100%" height = "100%">
        <s:Label id = "NameLabel"
            text = "task name" />
        <s:Button label = "Button 1" />
    </s:HGroup>

</s:BorderContainer>