可折叠面板
支持您展开或折叠某个包含多个视图的部分。
“可折叠面板”可以包含其他视图，如文本框或其他可折叠面板。 当组中包含多个可折叠面板时，父面板中每次只能展开一个嵌套面板，而其他面板处于折叠状态。
配置属性
在“配置”下，设置或修改视图的外观和行为属性。
- 屏幕大小
- 在属性名称旁边具有 "屏幕大小" 图标
的配置属性对于每个屏幕大小可以具有不同的值。 如果您未设置值，那么屏幕大小会继承下一个更大的屏幕大小值来作为其缺省值。
- 主题定义
- 主题定义指定视图的颜色和样式，并确定视图的外观。 您可以在主题编辑器中预览视图的外观。 请参阅 主题。
下表中列出了“可折叠面板”的外观配置属性：
| 外观配置属性 | 描述 | 数据类型 |
|---|---|---|
| 颜色样式 | 指定可折叠面板的颜色样式。 颜色与所指定主题中的变量相对应。 | String |
| 宽度 |
指定可折叠面板的宽度。 可以 px（像素）、%（百分比）或 em 为单位来指定该宽度。 例如， 50px， 20%或 0.4em。 如果未指定单位类型，那么将使用 px。 | String |
| 高度 |
指定可折叠面板的高度，以 px（像素）或 em 为单位。 如果未指定单位类型，那么将使用 px。 | String |
下表中列出了“可折叠面板”的行为配置属性：
| 行为配置属性 | 描述 | 数据类型 |
|---|---|---|
| 最初折叠 | 指定在装入页面时该部分是否处于折叠状态。 | Boolean |
| 面板组名称 | 指定可折叠面板组的名称。 在同一个组中，每次只能展开一个面板，而其他面板处于折叠状态。 | String |
示例
要在 UI 页面中创建可折叠部分，请向页面布局中添加“可折叠面板”视图。 在“配置”属性中，在行为下将最初处于折叠状态属性设置为 false，然后输入面板组名，如 G1。 在 外观下，将 颜色样式 设置为 Info，将 宽度 设置为 50%，将 高度 设置为 0.4em。 保存您所做的更改。 在运行时，生成的可折叠部分显示为已展开，并且其标题为浅蓝色。 要折叠该部分，请单击该部分标题右上角的小减号 (-) 图标。
事件
在“事件”属性中设置或修改该视图的事件处理程序。 可以将事件设置为以编程方式或在用户与该视图交互时触发。 有关如何定义和编码事件的信息，请参阅 用户定义的事件。
“可折叠面板”具有以下类型的事件处理程序：
- On load：页面装入时激活。 例如：
if(me.isExpand()){me.collapse();} - On expand: 在展开部分时激活。 例如：
me.setColorStyle("S")其中，
"S"（表示Success）必须在"me.setColorStyle("S")"中进行定义。 - On collapse: 在折叠部分时激活。 例如：
me.setColorStyle("");${CollapsiblePanel1}.expand()
根据特定事件，您可以使用 JavaScript 逻辑来修改视图的效果。 可在 用户定义的事件主题中找到有关将事件与视图配合使用的更多信息。
方法
有关可折叠面板的可用方法的详细信息，请参阅 可折叠面板 JavaScript API 。
其他资源
有关如何创建 Coach 或页面的信息，请参阅 构建 Coach。
有关标准属性 (常规， 配置， 定位， 可视性和 HTML 属性) 的信息，请参阅 查看属性。