首先，明确声明一下：Flex 2.0 是绝对不支持模板的，但是这篇文章将会告诉你一个方法让它看起来好像支持模板一样。
一个“模板”（Templates）不同于一个自定义组件（custom component）。一个模板会定义一些公开的可以被置换的部分。我所认为的模板是纯粹用MXML写的，但是组件可以100%用ActionScript或者用AS和MXML结合来写。Dreamweaver用regions可以实现模板。（译者注：由于对Dreamweaver不了解，这里regions一词不便翻译。）
注：在文章的末尾有一个例子提供下载。
面板（Panel） 模板
假设你想创建一个有固定外观的Panel，并且要在你的应用程序中频繁使用它。可能这个Panel有一个控制栏（ControlBar），控制栏里有两个按钮：“搜索”和“帮助”。你希望这个Panel总是有控制栏和按钮，但是你却想随时改变Panel中的内容。一个叫做SearchPanel.mxml的模板，可以像这样帮你达到目的：
<mx:Panel xmlns:mx="...." layout="absolute">
<mx:Metadata>
[Event("search")]
[Event("help")]
</mx:Metedata>
<!-- put children here -->
<mx:ControlBar>
<mx:Button label="Search" click="dispatchEvent(new Event('search'))" />
<mx:Button label="Help" click="dispatchEvent(new Event('help'))" />
</mx:ControlBar>
</mx:Panel>
你可以这样使用它：
<SearchPanel title="Employee Search" search="findEmployees()">
<mx:Form left="10" top="10" right="10" bottom="10">
... form items here ...
</mx:Form>
</SearchPanel>
如果你现在这样在Flex中实现，将会得到一个编译错误，它会提示你SearchPanel已经有了子组件。你不能从组件外面为它添加更多的子组件。如果你不在SearchPanel中添加控制栏（ControlBar）的话，它将会运行。但是这样的话每个SearchPanel就不会自动有一个控制栏了。
解决办法之一是把它写成一个用ActionScript创建控制栏和按钮的自定义组件。在这里我不会那样做，因为我有更好的办法去实现它。
创建这个“模板”（Templates）
让我们回到SearchPanel.mxml，保持其它部分不变添加下面的脚本代码块：
<mx:Script>
<[[CDATA
private var _components:Array;
public function set subComponents( a:Array ) : void
{
_components = a;
}
private function addComponents() : void
removeAllChildren();
for(var i:int=0; i < _components.length; i++) {
addChild( _components[i] );
}
}
]]>
</mx:Script>
并更改根标签：
<mx:Panel xmlns:mx="...." layout="absolute" creationComplete="addComponents()">
现在这样在程序中使用：
<SearchPanel title="Employee Search" search="findEmployees()">
<subComponents>
<mx:Form left="10" top="10" right="10" bottom="10">
... form items here
</mx:Form>
</subComponents>
</SearchPanel>
注意这个表单，或者其它你想要添加到面板中的子组件，都是在<subComponents>属性中定义的。在这个SearchPanel的脚本代码中，subComponents是一个接收数组的 set 方法。这个数组可以是在MXML定义的一个或者多个组件。在这个例子中，这个数组是一个<mx:Form>。注意哪个简单的循环（就是脚本中那个addComponents方法。译者注。），它把数组中的每个元素添加到Panel中。
现在你已经有了一个“模板”了！
默认属性（Default Property）
但是请等一下——还有更多。这确实是一个很酷的部分。让我们重新回到SearchPanel.mxml，把下面的一行代码添加到 <mx:Metadata> 中 [Event("help")] 的后面：
[DefaultProperty("subComponents")]
现在轻微改变一下主程序：把<subComponents>去掉：
<SearchPanel title="Employee Search" search="findEmployees()">
<mx:Form left="10" top="10" right="10" bottom="10">
... form items here
</mx:Form>
</SearchPanel>
注意把<subComponents>去掉之后它现在看起来像一个真正的容器（Container）了。因为有了DefaultProperty这个元数据（metadata），它也能顺利运行。你把SearchPanel的默认属性设置成了 "subComponents"，它可以自动把<mx:Form>放到子组件数组里。
总结
虽然在Flex中不支持真正的模板，但是你可以很漂亮地做到让它看起来好像支持一样。因为Flex2.0种创建组件的方法（用new 运算符）和DefaultProperty元数据使做到它变为可能。
范例下载
这个例子和上面描述的这个很像。在这个例子中，组件是一个被Canvas封装的Panel。这样做可以使最大化和最小化按钮“浮在”Panel 的标题栏上。
[文章热度:]
上一页：聊聊Flex的Event对象
