界面编辑器又称UIML设计器，是Tiny框架设计的编辑界面布局的开发工具，设计思路如下：
操作流程
界面设计是多角色，多步骤的一个开发过程：
- 界面组件设计人员：定义界面组件及布局的元数据文件(*.componenttype和*.layouttype)。
- 界面开发人员：导入相关组件、布局的元数据到业务工程，使用界面编辑器生成布局文件(*.uiml)。
- 一般开发人员：调用代码生成工具，根据布局文件生成对应平台的开发代码。
界面编辑器是所见即所得，支持各种常见的操作。
目前界面编辑器支持以下6种布局，布局之间是可以无限嵌套：
| 布局中文名 | 布局英文名 |
说明 |
| 边框布局 | BorderLayout | 边框布局包含下列五个区域：上、下、左、右、中。每个区域最多 只能包含一个组件，并通过相应的常量进行标识： TOP、BOTTOM、LEFT、RIGHT、CENTER。 |
| 卡片布局 | CardLayout | 卡片布局可以包含多个组件，但是每次只能看到一个组件。它允许 用户按顺序浏览这些组件或者显示指定组件。 |
| 多列布局 | ColumnsLayout | 多列布局每行组件数是固定的，超过的组件会自动布置到下一列。 容器每行被分成大小相等的矩形，一个矩形中放置一个组件。 |
| 表格布局 | GridLayout | 表格布局以矩形网格形式对容器的组件进行布置。容器被分成大小相 等的矩形，一个矩形中放置一个组件。可以理解为Html中的Table。 |
| 分页布局 | TabLayout | 分页布局可以包含多个分页，每个分页中放置一个组件。用户可以 通过操作分页来切换组件。 |
| 坐标布局 | XYLayout | 坐标布局以X，Y定位组件在容器内的坐标，以此来展示组件。 |
界面编辑器的插件效果如下：
QQ%E6%88%AA%E5%9B%BE20141223164105.jpg (20.13 KB, 下载次数: 0)
2015-5-27 13:41 上传
界面编辑器类似流程编辑器，也是分面板、属性栏和层次关系。
简介
- 面板提供图形化控件供用户选择，主要分三块区域：布局区域，用户操作都是所见即所得，非常直观；右侧的组件列表展示了用户可以使用的布局和组件列表。目前用户可以扩展组件。
- 属性栏提供用户配置布局、组件定义的属性。用户打开Eclipse的“Properties”视图即可看到。
- 对于比较复杂，层次嵌套很多的布局，层次关系就不够直观；界面编辑器提供了层次关系，以树的形式展示布局和组件的关系，用户打开Eclipse的“Outline”视图即可看到。
属性栏的示例图：
QQ%E6%88%AA%E5%9B%BE20141224100152.jpg (16.88 KB, 下载次数: 0)
2015-5-27 13:41 上传
层次关系的示例图：
QQ%E6%88%AA%E5%9B%BE20141224100343.jpg (10.42 KB, 下载次数: 0)
2015-5-27 13:41 上传
时间： 2024-10-03 17:44:13