解析Power Apps 自动生成的App - 2 - 浏览页面

接上文，本节将解析浏览页面（BrowseScreen1）的构成、控件的维护及控件的运行逻辑。

首先来看页面构成，下图用不同颜色表示出各个控件在App页面上所对应的位置。

各个控件的简介如下：

• BrowseGallery1: 用来以列表方式显示Sharepoint list 里存储的数据条目
• Rectangel2: 搜索框TextSearchBox1和条目展示区域BrowseGallery1的分割线
• SearchIcon1: 搜索按钮
• TextSearchBox1: 条目搜索文本输入框
• IconNewItem1: 新建列表条目按钮，点击后会跳转到EditScreen1
• IconSortUpDown1: 条目排序按钮
• IconRefresh1: 刷新条目按钮
• LblAppName1: 页面的标题
• RectQuickActionBar: 标题栏区域框

常用的控件维护操作都可以在鼠标右键的上下文菜单里找到，比如删除、重命名、排序、对齐方式等，如下图：

另外，要更细致精确的控制控件在页面上所展示的样式及布局等，最好还是通过右侧的属性栏来调整，比如控件的位置、颜色、字体大小等。

各控件的逻辑：

1. 从哪里获取的数据？

上面提到BrowseGallery1是用来显示 Sharepoint List 里的数据条目的，它是怎么关联到 List 的呢？点选中BrowseGallery1，有两个地方（下图红框标出的位置）可以看到数据源。一个是在右侧属性栏的Data source属性里, 另一个是在上面的 Items 属性里。这里的 Purchasing 就是存储在 Sharepoint list 里的一个列表名。 

2. 如何决定所显示的列表条目？

在了解了数据源是如何关联到页面之后，进一步的问题就是如何在页面上显示数据源里的特定条目。

选择BrowseGaller1后，在右侧的属性栏里点Fields的 Edit按钮，可以看到当前选中了 List 里的三个字段 item、ID 和 Title(Title字段是创建SharePoint list 时自动生成的主字段)， 这三个字段分别对应了BrowseGallery1下的三个Label 子控件，名称依次为Body1、Subtitle1 和 Title1。

上面三个时App在自动生成时默认添加进来的，如果要添加其它字段进来，可以在BrowseGallery1下面添加新的控件来关联。比如，选中Title1控件，然后在Insert菜单里选择Label。可以看到系统会自动选择List里的一个字段进行关联（这里关联的是列表里的 price 字段），并将其数值显示在BrowseGallery1里。如想将其它字段关联给新加的Lable 控件，可以点击Fields的Edit 按钮，然后在 Label1的下拉列表里进行选择。

3. 新建按钮是如何工作的？

点中 + 图标，可以看到它的OnSelect 属性的设置，如下：

OnSelect表示点选按钮后要执行的动作，也就是点中按钮后，会执行 = 右边的函数命令。上面的OnSelect 设置为 = NewForm(EditForm1); Navigate(EditScreen1, None) 。从这个函数命令内容就能看出，点击 + 图标后，它会新建一个名为EditForm1的表单，然后跳转（Navigate）到EditScreen1这个页面。

提示: 两个命令之间用“ ；”隔开。

提示: 下拉列表会列出当前所选控件的所有可用属性，粗体部分通常表示该属性进行了自定义设置。非粗体的属性则为系统默认值。

4. 其它的一些运行逻辑

• 点中BrowseGallery1里的一个条目后，跳转到该条目的详情页面

提示: 这个OnSelect属性是设置在BrowseGallery这个控件上的，无需对其下面的具体数据条目进行设置。

• 刷新按钮刷新数据

• 排序按钮对列表条目进行排序

• 搜索按钮： 实际测试下来发现没有实现搜索功能。但在搜索文本框里输入文字时，系统会自动实现过滤功能。

这个过滤功能不是通过点击搜索按钮来实现，而是在上面提到的关联数据源时那个Items属性里，通过Filter函数来实现的。回头来看这个Items属性，= SortByColumns(Filter([@Purchasing], StartsWith(Title, TextSearchBox1.Text)), "Title", If(SortDescending1, Descending, Ascending))， 也就是通过对Purchasing这个列表的 Title 列进行筛选，然后对Title 列进行排序。

如果改成= SortByColumns(Filter([@Purchasing], StartsWith(price, TextSearchBox1.Text)), "qty", If(SortDescending1, Descending, Ascending))，就成了通过对Purchasing这个列表的 price 列进行筛选，然后对qty 列进行排序。

未完。。。下节解析DetailScreen

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！