# 创建视图 使用华为云Astro轻应用零代码平台创建应用表单时，会默认为表单生成一个**全部**表格视图，该视图会显示表单中的所有数据。您也可以根据不同的使用场景和需求自定义新的视图，以便更有效地展示和管理表单数据。 #### 前提条件 - 已完成零代码应用的创建，具体操作请参见[使用华为云Astro轻应用创建零代码应用](https://support.huaweicloud.com/usermanualnocode-astrozero/astrozero_05_1404.html)。 - 已完成表单的创建，具体操作请参见[创建工作表/工作流](https://support.huaweicloud.com/usermanualnocode-astrozero/astrozero_05_1632.html)。 #### 为表单添加视图 **一个表单中可以包含多个视图，同一个表单中的所有视图共享一组数据，如果数据被修改，则该数据所在的所有视图显示均会更新。** 1. 参考[登录华为云Astro轻应用零代码工作台](https://support.huaweicloud.com/usermanualnocode-astrozero/astrozero_05_1450.html)中操作，登录零代码应用开发工作台。 2. 在全部应用中，单击应用后的"..."，选择"编辑"，进入编辑应用页面。 3. 为表单添加个人视图。 1. 选中对应的表单，单击"全部"视图右侧的"+"，选择"表格视图 \> 个人视图"，进入视图开发页面。 图1选择个人视图 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002287825564.png "点击放大") 2. 在页面左上角，删除默认视图的名称，输入修改后的视图名称。 建议视图的名称能够清晰地表达视图的功能或内容，避免歧义，且同一表单中的视图名称不得重复。 图2设置视图的名称 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312507054.png "点击放大") 3. 在中间区域上方，选择终端视图类型。 为适应不同终端、操作习惯及使用场景，零代码平台提供了**电脑端** 和**移动端**两种终端视图类型，确保用户在不同设备上均能获得最佳的交互体验。 4. 根据需要从左侧选择组件拖拽到中间区域，并设置组件的属性。 例如，从"通用组件"中拖拽一个"标题"组件到画布最上方，修改组件的"显示名称"为"2025年年度考核视图"、"标题大小"设置为"大"、"标题位置"设置为"居中"，效果如[图3]。更多组件功能及属性的介绍，请参见[设置表单页面组件属性](https://support.huaweicloud.com/usermanualnocode-astrozero/astrozero_05_1409.html)。 图3设计个人视图 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356835629.png "点击放大") 5. 单击页面左上方的"保存"，完成视图的创建。 4. 设置视图中展示的数据内容。 1. 在右侧菜单栏中，选择"数据范围"，进入视图数据设置页面。 2. 选择"隐藏字段"，自定义视图显示和隐藏的字段，**默认显示所有字段** 。 图4视图显示字段设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356839093.png "点击放大") 图5调整字段显示顺序 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356841865.png "点击放大") 表1隐藏字段参数说明 | 参数 | 说明 | |:---|:---| | 视图列顺序与表单字段保持一致 | 勾选后，视图中字段的显示顺序和表单中字段的显示顺序保持一致。 | | 自定义视图列顺序 | 根据自身需求和使用习惯，调整视图中列字段的显示顺序。 开启后，可以在"显示字段"中通过拖拽字段后的![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312486568.png)，来调整字段的顺序。例如，将"公司类型"显示在视图中的第一列，如[图5]。 | | 显示全部 | 勾选后，表单中的所有字段均显示在视图中。 | | 隐藏全部 | 勾选后，表单中的所有字段在视图中均不显示。 | 3. 选择"过滤"，设置过滤条件按需展示数据。 例如，显示"创建人"是"当前用户"，且"公司类型"为"上市公司"的数据，过滤后显示的数据如下图。 图6过滤条件设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002323254908.png "点击放大") 4. 选择"排序"，对视图中的数据进行排序。 例如，视图中的数据按照"公司类型"的字母顺序（从A-\>Z）进行排序，效果如图所示。 图7排序设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002322768654.png "点击放大") 5. 设置视图的外观样式。 1. 在右侧菜单栏中，选择"显示设置"，进入视图显示设置页面。 2. 选择"基本"，设置视图操作模式、行高等。 图8基本设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002346605341.png "点击放大") 表2基本设置参数说明 | 参数 | 说明 | |:---|:---| | 操作模式 | 设置对视图表格的操作模式。 - 编辑：可以新建、导出或删除视图表格数据。 - 只读：只可读取视图表格中的数据。 - 勾选：可以勾选视图表格中的数据。 | | 表格显示 | 视图表格显示设置。 - 表头：是否展示表头。 - 序号：是否展示行号。勾选后，表格首列显示当前行号，分页时行号累加上前一页依次显示。序号支持按顺序或倒序进行排序。 - 单选：勾选后，每行前有单选按钮，可选择行数据且只能单选。 - 多选：勾选后，每行前有多选按钮，可选择多行数据。 | | 行高 | 设置视图表格的行高，如紧凑、中等、高、很高和自适应。 | 3. 选择"分页"，设置视图表格分页的风格、显示记录数等。 图9视图分页设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002347019953.png "点击放大") 例如，将分页风格设置为"完整"，默认分页记录数为"5"条，设置后效果如下图所示。 图10分页设置效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002322770506.png "点击放大") 表3分页参数说明 | 参数 | 说明 | |:---|:---| | 分页 | 视图表格中数据是否分页显示。 | | 风格 | 设置分页的风格，支持**简洁** 和**完整**两种风格。 | | 默认分页记录数 | 设置分页的记录数，即每页中显示的数据条数。 取值范围：\[1, 100\]。 | 4. 选择"移动端显示"，设置视图表格在移动端显示的样式。 图11公司名称折叠显示效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356772177.png "点击放大") 图12公司名称设置为主标题效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356773193.png "点击放大") 图13公司名称为副标题效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356894097.png "点击放大") 6. 为视图添加操作按钮。 1. 在右侧菜单栏中，选择"操作设置"，进入视图操作设置页面。 2. 选择"按钮栏"，设置视图操作栏显示的按钮。 图14设置按钮栏 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356868045.png "点击放大") 3. 选择"工具栏"，设置视图中显示的工具。 图15视图工具栏设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312486580.png "点击放大") 图16视图工具栏设置效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356869029.png "点击放大") 4. 选择"记录操作"，设置视图中数据行的操作按钮。 图17设置视图中显示的操作按钮 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312644880.png "点击放大") 图18操作按钮设置效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356870389.png "点击放大") 7. 视图操作权限配置。 1. 在右侧菜单栏中，选择"权限设置"，进入视图权限设置页面。 2. 设置视图表格的可见权限。 例如，勾选"部分角色可见"，选中企业成员角色，即仅企业成员角色的用户可以查看到视图。 图19视图表格可见权限设置 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002346605357.png "点击放大") 表4权限设置参数说明 | 参数 | 说明 | |:---|:---| | 所有角色可见 | 华为云Astro轻应用业务配置中心的所有角色均可查看到该视图表单，包括**系统预置角色** 和**自定义角色** 。关于角色的详细介绍，请参见[配置应用角色权限](https://support.huaweicloud.com/usermanualnocode-astrozero/astrozero_05_1506.html)。 | | 部分角色可见 | 仅指定的角色才可以查看到该视图表单。 | 3. 设置完成后，单击页面上方的"保存"，保存视图。 8. 验证视图是否符合预期。 1. 单击页面左上方的![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312490276.png "点击放大")，返回应用开发页面，可查看到已创建的视图。 图20查看创建的视图 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002357226065.png "点击放大") 2. 单击视图中的操作按钮，可执行对应的操作。 3. 单击应用名称后的![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002346612633.png)，选择"分享应用"，进入应用分享页面。 图21选择分享应用 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002312653068.png) 4. 复制应用的访问链接，将该链接发给角色权限为**企业成员** 的用户（如张三），该用户打开链接后，显示"供应商年度考核视图"。 图22复制应用的访问链接 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002317278244.png "点击放大") 图23显示供应商年度考核视图 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002323024352.png "点击放大") 5. 在应用开发页面，单击"供应商年度考核视图"后的![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002356996381.png)，选择"分享视图"，获取视图的访问地址并将其分享给业务用户。 图24选择分享视图 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002323036576.png "点击放大") 图25获取访问地址 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002323045504.png "点击放大") 6. 业务用户收到分享链接后，通过浏览器打开该地址，可查看到考核视图，效果如[图26]所示。 图26业务用户查看到的视图效果 ![](https://support.huaweicloud.com/usermanualnocode-astrozero/zh-cn_image_0000002357108637.png "点击放大")