组装控件的来由

在很多项目的开发中，我们会发现，在很多页面我们都使用了几个相同的控件组合,我们就希望能由这几个控件组合而成，形成一个新控件，另外还有可能是一个具有相同特性的控件在重复使用，它们具有相同的特性,如某些属性设定，或css风格(如Label的字体颜色，字体大小)等。但是这种特性又不是整个系统具有的相同特性，只是出现的几率比较大。我们就可以认为这是具有特殊业务特征的控件使用方式，这种特征在很多场景下因为客户临时的一个小调整会引起大量的页面代码的维护工作，如Panel中增加一个退回按钮,或把按钮的字体由绿色改为蓝色。

在很多控件型框架的开发过程中，遇到这种情况就会被告知:利用我们的扩展技术做一个新的控件吧！但是大量的实践告诉我们这意味着两件事：

太高的技术要求，导致我们很难开发出一个好用的新控件，且无法保证控件的代码品质;
如果技术不够，我们就需要向原厂商求助，让原厂商的技术力量介入，协助我们完成这个控件的开发工作，这种情况就要求原厂商有较高的响应效率，但在现实情况下我们知道资源都是有限的，这个套用流行术语"我懂的!"。另外特殊情况下还需要商务介入，这种事情对于项目开发人员而言实在是太麻烦了；

以上两种情况总的结果是:开发一个新控件的成本太高。这导致我们无法很好的做业务控件的积累，这就意味着我们必须进行大量简单而重复的低效劳动:耐着性子干吧!而无法以一种享受的心态来编程，这种日子真的很疼苦，我们总是希望能改变现状，让痛苦的事变得稍稍简单和有趣一些。

为此Dorado中专门提供了两种类型的组件扩展技术：

配置型组装控件
对象型组装控件

这两种控件都是使用现有控件做扩展的一种技术,并利用Dorado中特有的扩展技术进一步减低编程技术要求，例如：

我是一个普通的技术编程人员，我对面向对象和模式都没有真正了解，我对java和spring也仅仅是简单应用而已;
我是一个项目经理，我的主要工作是规划系统的实施，协调资源，通过管理提供项目的品质，并及时交付系统;
是的，似乎我也是这种人，但我有改进项目品质的愿望，我也想写高品质的代码，那么好，我们可以利用这两种扩展技术。

配置型组装控件:
1.首先我们定义一个普通的视图，添加各种想要公用的控件，并为它们定义相关的属性；
2.在dorado的控件配置文件中申明1中的那些控件作为项目的业务控件;
3.在业务View中引用这个新的控件,这个时候业务View中的控件就具有1中定义控件的所有默认属性;
通过以上原理,我们就可以把通用的控件特性提取出来定义到1中对应的控件中，这样我们在业务View中只要引用一下就可以，而不用重复定义那些特性，这样将来用户有需求变更时我们只用调整1中控件的特性即可。
装配型控件的好处是，控件开发人员不需要Java编码就可以完成一个新控件的开发。

对象型控件：
与配置型控件的唯一不同之处就在于第一步，对象型控件不定义在View中，而是用Java类来定义一个控件，并在dorado的控件配置文件中申明.与配置型组装控件相比它的优势是可以结合Java代码做更灵活的控制，例如:根据数据库的持久化信息初始化控件等.

下面我们根据sample-center中的范例详细看配置型组装控件的开发定义步骤,对应的范例URL:http://dorado.bstek.com/sample-center/com.bstek.dorado.sample.widget.customize.XmlAssembledComponent.d

组装控件的声明

首先在一个普通视图中(本例为:com.bstek.dorado.sample.component.AssembledComponents)添加任意的dorado控件，如本例：Button(id为ToggleButton)和Panel(id为ButtonPanel)对象。

<?xml version="1.0" encoding="UTF-8"?>
<ViewConfig>
    <View>
        <Button id="ToggleButton" toggleable="true" />

        <Panel id="ButtonPanel" layout="regionPadding:8">
            <Container layout="Anchor" layoutConstraint="bottom height:28">
                <Button caption="${virtualProperty.buttonCaption}" layoutConstraint="left:50%">
                    <ClientEvent name="onClick"><![CDATA[
dorado.MessageBox.alert("您点击了" + self.get("caption") + "按钮.");
                    ]]></ClientEvent>
                </Button>
            </Container>
        </Panel>
    </View>
</ViewConfig>

我们设置了:

ToggleButton的toggleable属性为true,该属性表示按钮是否可以按下
ButtonPanel内部我们添加了一个Container布局容器,且在内部添加了一个含单击事件的Button按钮,caption的值后面再解释

组装控件的注册

假如我们希望在其它页面中,通过组装控件技术重复使用上面的两个控件对象，则我们就需要在dorado-home文件夹的控件配置文件components-context.xml中做如下声明：

<bean parent="dorado.assembledComponentTypeRegister">
	<property name="name" value="ToggleButton" />
	<property name="src" value="com.bstek.dorado.sample.component.AssembledComponents#ToggleButton" />
</bean>
<bean parent="dorado.assembledComponentTypeRegister">
	<property name="name" value="ButtonPanel" />
	<property name="src" value="com.bstek.dorado.sample.component.AssembledComponents#ButtonPanel" />
</bean>

parent属性值是组装控件默认的：
name属性设置的目的是为了在IDE的控件列表显示控件对象时使用,如下图:

src属性表示该组装控件定义的出处,如:ButtonPanel对应的src含义表示引用com.bstek.dorado.sample.component.AssembledComponents视图中的ButtonPanel控件

通过以上方式我们已经在工程的环境中注册了自己的组装控件。

注意执行更新Dorado配置规则,便于IDE的ToolBox中可以看到自定义的控件对象。

组装控件的引用

之后我们就可以自己的业务view中引入之前在视图AssembledComponents中申明的组装控件,如图:

查看XML代码有:

<?xml version="1.0" encoding="UTF-8"?>
<ViewConfig>
  <View layout="Anchor padding:40" title="配置型组装控件">
    <ToggleButton caption="这是一个名为ToggleButton的组装控件"/>
    <ButtonPanel layoutConstraint="anchorTop:previous; top:30" height="200" width="500" caption="这是一个名为ButtonPanel的组装控件" collapseable="true" buttonCaption="确定">
      <Property name="buttonCaption">我的自定义按钮属性</Property>
      <Children>
        <TextArea/>
      </Children>
    </ButtonPanel>
    <ButtonPanel layout="form">
      <Property name="buttonCaption">AAAAAAAAAAA</Property>
      <Property name="width">300</Property>
      <Property name="height">300</Property>
      <Property name="caption">WWWWW</Property>
      <Children>
        <TextEditor/>
        <TextEditor/>
      </Children>
    </ButtonPanel>
  </View>
</ViewConfig>

注意其中XML元素的标记名称:<ToggleButton>和<ButtonPanel>,其分别为components-context.xml中对应的name属性.
通过以上方式，我们就相当于引用了另一个视图的某个控件的配置，进行复用。

组装控件属性的定义

修改原有的控件属性，实现差异化.

在很多情况下我们可能还需要在引用控件的基础上,对控件的属性进行设定,从而覆盖原先的定义，实现差异化：

<?xml version="1.0" encoding="UTF-8"?>
<ViewConfig>
    <View title="配置型组装控件" layout="Anchor padding:40">
        <ToggleButton caption="我的自定义属性" />

        <ButtonPanel caption="我的自定义按钮面板" collapseable="true" buttonCaption="确定" width="500" height="200"
            layoutConstraint="anchorTop:previous; top:30">
            <TextArea />
        </ButtonPanel>
    </View>
</ViewConfig>

其中，我们对控件的属性进行了定义，如ButtonPanel中的collapseable和buttonCaption以及width和height等的设定。另外我们也在ButtonPanel的内部添加了一个<TextArea>元素。

虚拟属性

组装控件技术允许我们在注册组装控件时申明虚拟属性，从而可以在原有控件的基础上增加更多的属性配置，如范例中控件声明视图:

<Panel id="ButtonPanel" layout="regionPadding:8">
            <Container layout="Anchor" layoutConstraint="bottom height:28">
                <Button caption="${virtualProperty.buttonCaption}" layoutConstraint="left:50%">
                    <ClientEvent name="onClick"><![CDATA[
dorado.MessageBox.alert("您点击了" + self.get("caption") + "按钮.");
                    ]]></ClientEvent>
                </Button>
            </Container>
        </Panel>

其中${virtualProperty.buttonCaption}是一个引用虚拟属性的动态表达式，表示引用虚拟属性buttonCaption,之后我们在注册ButtonPanel控件的时候，利用d:virtual-property进行了虚拟属性buttonCaption的声明，如下:

<bean id="dorado.assembledComponent.ButtonPanel" parent="dorado.assembledComponentTypeRegister">
	<property name="name" value="ButtonPanel" />
	<property name="src" value="com.bstek.dorado.sample.component.AssembledComponents#ButtonPanel" />
	<d:virtual-property name="buttonCaption" />
</bean>

其中buttonCaption是原始ButtonPanel对象不存在的属性。这样我们在业务视图中就可以按如下的方式定义新的控件,从而达到为控件内部按钮的caption赋值的效果:

<ButtonPanel caption="这是一个名为ButtonPanel的组装控件" collapseable="true" buttonCaption="确定" width="500" height="200"
            layoutConstraint="anchorTop:previous; top:30">

Dorado 9 : 配置型组装控件(sample-center)