Power Apps for Professional Developers 2: 如何构建 Power Apps

这是三篇文章中的第二篇，旨在向开发人员和技术用户展示他们为什么应该关心 Teams 中的 Power Apps。在第一篇文章中，我们概述了 Power Apps 及其在 Teams 中的集成。希望现在您已经试用了一些现成的演示应用，并熟悉了 Power Apps 的功能。

在下一篇文章中，我们将介绍如何在 Teams 中启用 PowerApps，并从头开始逐步创建简单的单页表单应用程序。我们将通过定义数据并创建用于存储输入值的表来完成此操作，然后构建表单。我们可以完全在 PowerApps 界面中完成所有操作，而无需离开 Teams。我们还将添加一些代码，使表单能够提交用户数据。让我们直接开始。

在 Teams 中添加 Power Apps

对于我们的第一个应用程序，让我们来看一个典型的业务问题。假设您需要设置一个在家办公预订应用程序。Teams 中的 Power Apps 是一个自然的选择，因为所有员工都已经在使用 Microsoft Teams，因此访问和部署应该很简单。尽管此应用程序是用于在家办公的请求，但您可以将其扩展到需要员工获得经理批准的其他情况，例如休假或病假。

让我们看看如何使用 Teams 中的 Power Apps 来构建此应用程序。首先，确保您的 Microsoft Teams 已准备就绪。如果您尚未安装 Teams，可以查看一些允许您免费试用的开发者预览选项。这为您提供了一个评估 Teams 中 Power Apps 的机会，并以最低的成本向您的组织推销您的计划。

首先，我们将 Power Apps 添加到我们的 Teams 环境中。打开 Teams，然后在左侧栏中，单击“更多已添加的应用”选项（三个点），然后选择“更多应用”。搜索 Power Apps 并安装它。

安装完成后，打开 Power Apps 并单击“创建应用”。您需要将应用程序添加到您有权访问的有效团队。单击“创建”并为您的应用程序命名为“在家办公请求”。

此过程将启动一个新的应用程序，显示默认的应用程序设计器屏幕，以便我们可以开始构建。

设置数据

我们将通过创建一个新表来设置我们的数据。

我们将表命名为“WFHDetail”，它将存储我们创建的用于从用户收集数据的表单的所有组件。使用 + 按钮向此表添加几个列，并提供名称和类型。PowerApps 支持几种专门的数据类型，但大多数情况下，文本或数字就足够了。为“请求编号”、“员工姓名”、“经理姓名”、“开始日期”、“联系电话”、“安全评估”和“批准”创建几个列。

创建新表单

一旦我们创建了数据元素，我们就可以创建用户将填写的表单。如果我们切换到“树状视图”（三个堆叠的纸张），我们可以看到新项目的默认屏幕（screen1）。

让我们从头开始，删除附加到此屏幕的所有元素，并将其重命名为“WFH 表单”。

在选中屏幕的情况下，切换到“插入”视图（“树状视图”下的 + 图标），然后单击“标签”。标签提供静态信息，可用于标题或说明。为了快速轻松地添加我们的表，我们可以插入一个“编辑表单”元素。这将把表的所有列直接放入屏幕上的表单中。

右侧边栏中的“属性”菜单允许我们修改表单的整体外观和感觉。对于我们的表单，我们希望将“默认模式”从“编辑”更改为“新建”，因为我们希望使用该表单来填写新的在家办公请求。

您还可以单击各个元素来修改它们的属性。例如，在此阶段我们将删除“批准”数据元素，因为我们不希望员工填写该字段。

我们还可以使用许多函数使表单更易于填写。双击右侧边栏“高级”选项卡下的“员工姓名”文本框，然后单击“解锁”以更改属性。当您选中一个元素时，您可以将该元素绑定到一个函数。

对于员工姓名，让我们将其绑定到函数 User().FullName。这将允许我们使用登录 Teams 的用户的姓名来填充表单，因此用户无需手动填写姓名。

提交数据

要提交表单，我们还需要创建一个按钮，用户完成后可以单击该按钮。确保未选中“编辑表单”，然后插入一个新按钮。将按钮移到表单下方，然后双击它以将标签更改为“提交请求”。

在函数屏幕旁边有一个下拉菜单，允许您更改与表单元素相关的不同事件。我们可以使用 OnSelect 事件将函数添加到“提交请求”按钮。在函数文本框中，键入 SubmitForm(‘表单名称’)。您会注意到函数文本框具有文本预测功能，您可以使用它来自动完成函数。

我们还应该在表单成功提交后通知用户，然后清除表单。为此，我们将输入以下代码到表单的 OnSuccess 事件中

NewForm(‘FormName’); Notify("Work from home request
submitted",NotificationType.Success);

当表单成功创建时，此函数执行两项操作。首先，它使用 NewForm 创建表单的新实例。然后，它使用 Notify 方法在应用程序顶部创建一个通知横幅。保存您的 Power App 并单击“预览”按钮以查看您的表单并输入一些数据。

您会注意到，打开表单时，员工姓名会自动填充。如果您填写其他字段并单击“提交请求”，表单应该会清除，并且成功横幅应显示在顶部。如果我们返回数据源，您会看到表单已将数据提交到我们创建的表中。

后续步骤

使用 Power Apps 设置一个简单的应用程序来直接在 Teams 中记录数据相当简单。使用非常有限的代码且无需额外基础结构，我们创建了一个简单的单表单应用程序，允许用户将请求提交到中央数据存储。

在下一篇文章中，我们将为该应用程序添加一些润色，使其成为您可以在自己的环境中使用的东西。为此，我们将添加一个使用客户端 Teams 环境设置的菜单/门户系统。然后，我们将发布应用程序并导出完成的解决方案。

查看我们的低代码应用开发 7 步指南，即可立即开始使用 Power Apps。