创建购物清单卡片

在本教程中，您将创建一个显示购物清单并允许您添加商品的卡。 您将使用卡设计器、变量和 Power Fx。

在本教程结束时，您的购物清单卡应如以下示例所示：

先决条件

• Power Apps 帐户

创建卡片

1. 登录 Power Apps，然后选择您的环境。

2. 在左侧窗格中选择卡片。 如果项目不在侧面板窗格中，请选择 …更多，然后选择所需项目。

3. 选择 + 创建卡片。

4. 在卡名称下，键入 SimpleShoppingCard，然后选择创建。

5. 选择文本您的卡标题显示在此处。 在文本标签属性窗格中，将 Text 设置为 Shopping List。

6. 选择文本添加和删除元素以自定义新卡。 在文本标签属性窗格中，将 Text 设置为 Use the box below to add items to the list。

添加变量

购物清单将在单独的文本行中保留各个商品。 它看起来像一个只有一列的表，每行是一个食品杂货。 这表示您需要创建一个表变量来存储清单。

1. 在左侧窗格中，选择变量。

2. 选择 + 新建变量。

3. 在新建变量窗口中，在名称下输入 MyGroceryList。 将类型设置为表。

4. 选择默认值右侧的花括号，然后在括号之间输入 ""。 这表明我们的表在隐式名为值的列中保留文本值

5. 选择保存。

   

将列表添加到卡中

1. 在左侧窗格上，选择插入。

2. 在工具窗格中，选择显示展开类别，然后选择文本标签。

3. 在文本标签属性窗格中，选择高级选项卡。

4. 将 Repeat for every 设置为 MyGroceryList。

   

   设置文本标签的 Repeat for every 属性将为指定表中的每个项目重复文本标签。 在此示例中，表 MyGroceryList 是您创建的变量。 换言之，将在卡中为杂货清单中的每一个商品创建一个单独的文本标签。

5. 选择属性选项卡。将 Text 设置为 ThisItem.Value。

   将系统定义的变量 ThisItem.Value 分配给文本标签会将 MyGroceryList 数组中当前项的值显示为标签文本。 数组是表变量的另一个术语。 您可以在公式栏或属性窗格中输入变量名称。

   

添加输入框

您创建的列表是空的，因此在最后一步中，您将为用户提供添加项目的能力。

1. 在左侧窗格上，选择插入。

2. 在工具窗格中，选择输入展开类别，然后选择文本输入。

3. 在文本输入属性窗格中，将 Name 设置为 NewItem，将 Label 设置为 New Item:。

   

   Name 属性允许您引用 Power Fx 表达式中的控件。 它必须是一个字词，没有空格或特殊字符。 Label 属性显示在卡中。 控件的名称和标签不必像这里一样相似，但使用相似的名称可以更容易地跟踪控件。

添加 Power Fx 按钮

1. 在左侧窗格上，选择插入。

2. 在工具窗格中，选择输入展开类别，然后选择按钮。

3. 在按钮属性窗格中，将 Title 设置为 Add Item。

4. 在属性窗格中，选择 PowerFx 将光标放在公式栏中。

5. 在公式栏中键入以下 Power Fx 表达式：Collect(MyGroceryList, {Value: NewItem})

   此表达式使用 Power Fx 函数 Collect 将用户输入的值 NewItem 追加到隐式值列中的 MyGroceryList 表变量中。 由于表达式绑定到按钮的 OnSelect 属性，因此当用户选择按钮时，它将运行。

   

测试卡片

您应始终在播放卡之前保存所做的更改。 选择保存，然后选择播放。

通过在杂货清单中添加一些商品来测试您的卡。

后续步骤

了解如何使用 Microsoft Dataverse 连接器制作更复杂的卡。