本期重点内容:
可以通过复制的方法,快速将其他应用中的控件粘贴到另一个应用
通过 First 公式,可以获取到指定数据源中的第一个数据
Text 公式可以将其他内容转化为文本,配合 ShortDate 等格式可以快速转化为日期格式
通过设置控件的 OnSelect 属性,可以配置用户在点击控件时发生的行为
Navigate 公式可以用于导航操作,比如将 OnSelect 设置为 Navigate 可以让用户在点击控件时跳转到指定页面
Back 公式可以快速返回到上一个页面,通常和 Navigate 公式配合使用
通过更改控件的外观,可以实现意想不到的效果
上期我们讲到阿彪和老温他们一起完成了知识库和日程表的应用原型,今天阿彪将把已经完成的几个原型合并到一起,做一些最终的收尾工作。
阿彪在制作完预约日程表应用后,想要把预约日程表应用和之前的VA应用合并到一起。首先他进入了 Power Apps 的站点以编辑模式打开了最早完成的 VA 应用。
由于之前的日程表应用中有三个界面,所以阿彪要想把之前的合并过来,也需要在VA应用中创建三个界面。
于是他插入了3个空白的屏幕,并分别命名为BrowseAppointions,AppointmentDetails 和 EditAppointment
为了保障新页面合并过来后能找到数据源,阿彪在VA应用中添加了 OneDrive for Business 的数据源,并选择了 Appointments.xlsx 中的表格数据。
之后阿彪另外开启了一个 Power Apps 页面,从应用列表中找到了之前创建的预约日程表应用将其以编辑模式打开。另外为了保证它和VA应用的样式一致,阿彪把预约日程表应用的主题也切换为了“森林”。
在这一切完成以后。阿彪就开始依次把预约日程表中的每个屏幕的组件复制粘贴到 VA 屏幕中。
粘贴之后阿彪发现会出现标题部位的位置没对齐,他自己就手动调整了一下
当把所有屏幕都复制完成后,之前的预约日程表应用就没用了,阿彪就把他关上,专注于 VA 应用。
他依次对VA应用中的几个界面进行了重命名操作,因为阿杰提醒过他,对每个控件做好有意义的命名,这样有利于应用在后期修改时更好的被人理解
现在所有功能界面都在一个应用上了,最后阿彪想要添加一个首页,希望现场技术人员能在首页中直接看到最新的预约日程,并且可以有应用入口跳转到其他几个功能页面。
阿彪轻车熟路的添加了一个空白屏幕,然后重命名为 Home 。
之后他想把公司的 Logo 也放到首页,于是添加了一个图像控件,并把图像控件的位置和大小做了相应的调整。
位置调好以后,阿彪在图像中上传了 VA 公司的 Logo 。
有了 Logo ,接下来就是去显示预约日程信息,阿彪决定用文本标签控件来进行显示。于是他插入了四个文本标签控件。
之后阿彪修改第一行的文字内容为:“接下来的预约安排”,并设置字体大小为30,字体颜色改为了和Logo 一样的绿色。(看来阿彪偷偷学过设计,知道品牌主题色这个概念)
然后他希望第二行去显示最新预约的客户名字,这里阿彪用到了一个 First 公式:
First(Appointments).'Customer Name'
First 公式可以从指定数据源中返回第一个记录,这里相当于是返回了第一个预约日程,并把客户名称显示到了文本框。
用同样的方式阿彪将将第三行文字改为:
Text(First(Appointments).'Appointment Date',ShortDate)
这里除了读取第一个预约日程的日期以外,还将日期用 Text 公式转化为了更加友好的文本格式
再用相同方式将第四行更改为:
Text(First(Appointments).'Appointment Time',DateTimeFormat.LongTime24)
并将字号设置为30
然后阿彪在文字下方插入了一个矩形图标,并通过调整样式的方式,将它改成了一个分隔符的样式。
很多时候通过调整控件的样式,可以实现很多意想不到的效果。
在分隔符下面,阿彪打算添加三个按钮,用来作为三个不同功能的应用入口。
之后阿彪通过更改按钮控件的 OnSelect 属性,设置了用户在点击该控件时发生的事情。
这里通过
Navigate(BrowseAppointions ,ScreenTransition.Fade)
添加了导航操作,也就是在点击按钮时可以跳转到对应的应用界面。
同样的方式把另外2个按钮都添加上导航效果
再添加完导航效果以后,阿彪发现现在虽然可以跳转到每个功能页面了,但是一旦跳转过去以后,就无法返回。
于是他需要在每个功能页面中都添加一个返回的功能,这里阿彪使用图标控件,并设置 OnSelect = Back() 实现。
Back() 表示返回到上一页
最后为了让应用在启动后可以直接打开 Home 页面,阿彪选中了树状视图中的 App控件,然后将其 OnStart 属性设置为 Navigate(Home, ScreenTransition.Fade)
这表示在应用启动后,就跳转到首页。
这里还有另外一种方法可以跳转到首页,就是将 Home 页在树状视图中移动到第一个位置。
至此所有应用功能都全部完成,阿彪测试并保存了应用。
在整个低代码原型制作的过程中阿彪是主力军,原先只是库房经理的他通过这个简单的低代码原型实现了人生的第一个应用,这激起了他浓厚的兴趣,他希望接下来能为公司创造出更多的低代码应用。
在应用界面完成以后,下期我们将进入数据存储的部分,阿杰和阿彪就数据存储方案展开了激烈的讨论,最终是选择 Microsoft Dataverse 还是其他数据持久化方案,让我们下期揭晓。