配置具有多个部分的画面

您可以使用多个可调窗口窗格创建类似于应用程序用户界面的画面。

通过隐现动画切换布局对象的显示/折叠后，内容显示对象和开关对象的大小和位置将由停靠面板自动调整，窗格显示也将随之改变。

有关用于配置由多个窗格组成的画面的功能的信息，请参阅以下内容。

停靠面板

什么是动画？

设置了隐现动画时的操作

示例操作

触摸停靠面板上的开关可折叠布局对象 (左窗格)；随后对齐的内容显示对象 (主窗格) 将展开以填充该空间。再次触摸开关以显示布局对象。

设置工作流程

添加变量
添加画面
添加内容
设置布局对象/部件

添加变量

添加一个变量，存储布局对象的 [隐现] 属性。

工程浏览器: [变量] → [全部变量]

添加以下变量。

变量属性

[名称]	[数据类型]
Var1	[INT]

添加画面

工程浏览器: [画面设计] → [画面]

添加以下画面。

画面属性

[画面 Id]	[画面类型]
2	[停靠面板]

工程浏览器: [画面设计] → [画面] → [Screen2]

要定义颜色等画面设置，在文档视图中，单击绘制区域并在属性窗口中定义设置。

停靠面板属性

标签	属性			值
[基本]	[填充]	[颜色]	[值]	ID: 14

工程浏览器: [系统架构] → [Target01]

设置以下属性。

Target01 属性

标签	Sub	属性		值
[功能]	[基本]	[偏好]	[初始画面 ID]	2

注：该属性将本设置示例中配置的画面 (画面 ID: 2) 设置为启动运行时后首先显示。

添加内容

工程浏览器: [画面设计] → [内容]

添加以下内容。

内容属性

[内容 ID]	[画面类型]
1	[滚动画布]

工程浏览器: [画面设计] → [内容] → [Content1]

要定义颜色等内容设置，在文档视图中，单击绘制区域并在属性窗口中定义设置。

注：使用 ID 指定颜色时，显示的颜色将根据 [工具箱] 中的 [颜色集] 而变化。
颜色集

滚动画布属性

标签	属性			值
[基本]	[填充]	[颜色]	[值]	ID: 25

设置布局对象/部件

工程浏览器: [画面设计] → [画面] → [Screen2]

将以下对象从[工具箱]拖放到画面上。

注：可以使用 [对象列表] 更改对象对齐顺序。

布局对象 - 画布 (名称：Canvas1)
布局对象 - 堆栈面板 (名称: StackPanel1)
开关对象 (名称: Switch1)
内容显示 (名称：ContentDisplay1)

注：对齐对象时，请将它们拖放到布局对象的外部或画面区域之外，以防止它们重叠。请注意，当画面上没有选择任何对象时，也可以通过双击 [工具箱] 中的相关对象来对齐它们而不重叠。

布局对象 - 画布 (名称: Canvas1) 属性

标签	属性			值
[基本]	[位置]	[停靠]		[顶部对齐]
	[高度]			80
	[填充]	[颜色]	[值]	ID: 14

布局对象 - 堆栈面板 (名称: StackPanel1) 属性

标签	属性			值
[基本]	[方向]			[垂直]
	[位置]	[停靠]		[左]
	[宽度]			250
	[填充]	[颜色]	[值]	ID: 11
	[隐现]			[变量] [名称]: Var1

注：在堆栈面板中安装折叠菜单。有关折叠菜单的信息，请参阅以下内容。
配置折叠菜单

开关对象（名称: Switch1）属性

此开关更改窗格显示。触摸开关后，布局对象 - 堆栈面板 (名称: StackPanel1) 的 [隐现] 属性将变为 0 (显示) 或 2 (折叠)。

标签	子选项卡	属性	值	标签
[功能]	[触摸]	[操作]	[类型]	[字]
			[操作]	[XOR]
			[源]	2
			[目标]	[变量] [名称]: Var1
[形状]	[尺寸/位置]	[位置]	[停靠]	[左]
		[宽度]		25
		[尺寸高度]		50

内容显示 (名称: ContentDisplay1) 属性

标签	子选项卡	属性	值
[功能]	[基本]	[内容 ID]	1