---
title: "步骤 1. 创建展示付费墙数据的流程"
description: "在 Adapty 中设置功能标志操作流程，以个性化用户订阅旅程。"
---
:::important
使用 FlutterFlow 插件时，您无法使用在 Adapty 付费墙编辑工具中创建的付费墙。您必须在 FlutterFlow 中自行实现付费墙页面，并将其连接到 Adapty。
:::
将 Adapty 库作为依赖项添加到您的 FlutterFlow 项目后，接下来需要构建一个流程，用于**从 Adapty 获取付费墙和产品数据，并将其展示在您在 FlutterFlow 中设计的付费墙上**。
首先，我们需要从 Adapty 接收付费墙数据。我们将从请求 Adapty 付费墙开始，然后获取其关联产品，最后检查数据是否成功接收。如果成功，我们将在付费墙页面上显示产品标题和价格；否则，将显示错误消息。
在继续之前，请确保您已完成以下操作：
1. 在 Adapty 看板中[创建至少一个付费墙并向其添加至少一个产品](create-paywall)。
2. 在 Adapty 看板中[创建至少一个版位](create-placement)，并[将您的付费墙添加到该版位](add-audience-paywall-ab-test)。
让我们开始吧！
## 步骤 1.1. 请求 Adapty 付费墙 \{#step-11-request-adapty-paywall\}
如前所述，要在您的 FlutterFlow 付费墙中显示数据，我们首先需要从 Adapty 获取数据。第一步是获取 Adapty 付费墙本身。操作如下：
1. 打开您的付费墙屏幕，在右侧面板切换到 **Actions** 部分，然后打开 **Action Flow Editor**。
2. 在 **Select Action Trigger** 窗口中，选择 **On Page Load**。
3. 点击 **Add Action**，然后搜索 `getPaywall` 自定义操作并选择它。
4. 在 **Set Actions Arguments** 部分，输入您在 Adapty 看板中[创建的版位](create-placement)的真实 ID，该版位包含付费墙。在本示例中为 `monthly`。请务必使用您真实的版位 ID！
5. 如果您已在 Adapty 看板中对付费墙进行了[本地化](localizations-and-locale-codes)，还可以设置 **locale** 参数。
6. 在 **Action Output Variable Name** 中，创建一个新变量并将其命名为 `getPaywallResult`。我们将在下一步中使用它来引用 Adapty 付费墙并请求其产品。
## 步骤 1.2. 请求 Adapty 付费墙产品 \{#step-12-request-adapty-paywall-products\}
很好！我们已经获取了 Adapty 付费墙。现在，让我们获取与该付费墙关联的产品：
1. 点击已创建操作下方的 **+** 并选择 **Add Action**。此操作将接收 Adapty 付费墙产品。为此，搜索并选择 `getPaywallProducts`。
2. 在 **Set Actions Arguments** 部分，选择之前创建的 `getPaywallResult` 变量。
3. 按如下方式填写其他字段：
- **Available Options**：Data Structured Field
- **Select Field**：value
- **Available Options**：无需进一步更改
4. 点击 **Confirm**。
5. 在 **Action Output Variable Name** 中，创建一个新变量并将其命名为 `getPaywallProductsResult`。我们将使用它将您在 FlutterFlow 中设计的付费墙与 Adapty 付费墙数据进行映射。
## 步骤 1.3. 添加检查付费墙是否成功加载 \{#step-13-add-check-if-the-paywall-uploaded-successfully\}
在继续之前，让我们验证 Adapty 付费墙是否已成功接收。如果是，我们可以用产品数据更新付费墙；如果不是，我们将处理错误。以下是添加检查的方法：
1. 点击 **+** 并点击 **Add Conditional**。
2. 在 **Action Output** 部分，选择之前创建的操作输出变量（在本示例中为 `getPaywallResult`）。
3. 要验证 Adapty 付费墙是否已接收，请检查是否存在包含值的字段。按如下方式填写字段：
- **Available Options**：Has Field
- **Field (AdaptyGetPaywallResult)**：value
4. 点击 **Confirm** 以完成条件设置。
## 步骤 1.4. 记录付费墙查看事件 \{#step-14-log-the-paywall-review\}
为确保 Adapty 分析能够追踪付费墙查看事件，我们需要记录此事件。如果没有此步骤，该查看将不会被计入分析数据。操作如下：
1. 点击 **TRUE** 标签下方的 **+** 并点击 **Add Action**。
2. 在 **Select Action** 字段中，搜索并选择 **logShowPaywall**。
3. 在 **Set Action Arguments** 区域点击 **Value**，然后选择我们创建的 `getPaywallResult` 变量。该变量包含付费墙数据。
4. 按如下方式填写字段：
- **Available Options**：Data Structured Field
- **Select Field**：value
5. 点击 **Confirm**。
## 步骤 1.5. 如果未收到付费墙则显示错误 \{#step-15-show-error-if-paywall-not-received\}
如果未收到 Adapty 付费墙，您需要[处理错误](error-handling-on-flutter-react-native-unity#system-storekit-codes)。在本示例中，我们将简单地显示一条警告消息。
1. 向 **FALSE** 标签添加一个 **Informational Dialog** 操作。
2. 在 **Title** 字段中，添加您希望作为对话框标题显示的文本。在本示例中为 **Error**。
3. 点击 **Message** 框中的 **Value**。
4. 按如下方式填写字段：
- **Set Variable**：我们创建的 `getPaywallProductResult` 变量
- **Available Options**：Data Structure Field
- **Select Field**：error
- **Available Options**：Data Structure Field
- **Select Field**：errorMessage
5. 点击 **Confirm**。
6. 向 **FALSE** 流程添加一个 **Terminate action**。
7. 点击右上角的 **Close**。
恭喜！您已成功接收产品数据。现在，让我们[将其映射到您在 FlutterFlow 中设计的付费墙](ff-add-variables-to-paywalls)。