步骤 2. 向付费墙页面添加数据
在获取所有必要的产品数据之后，是时候将其映射到您在 FlutterFlow 中设计的精美付费墙上了。在本示例中，我们将映射产品标题及其价格。
步骤 2.1. 向付费墙页面添加产品标题
- 双击付费墙页面上的产品文本。在 Set from Variable 窗口中，搜索
getPaywallProductResult变量并选择它。
- 按如下方式填写字段：
- Available Options：Data Structured Field
- Select Field：value
- Available Options：Item at Index
- List Index Options：First
- Available Options：Data Structured Field
- Select Field：localizedTitle
- Default Variable Value：null
- UI Builder Display Value：任意内容，本示例中为
product.title
- 点击 Confirm 保存更改。
步骤 2.2. 向付费墙页面添加价格文本
按照步骤 2.1 中的操作，对价格文本重复以下步骤：
- 双击付费墙页面上的价格文本。在 Set from Variable 窗口中，搜索
getPaywallProductResult变量并选择它。
- 按如下方式填写字段：
- Available Options：Data Structured Field
- Select Field：value
- Available Options：Item at Index
- List Index Options：First
- Available Options：Data Structured Field
- Select Field：price
- Default Variable Value：null
- UI Builder Display Value：任意内容，本示例中为
product.price
- 点击 Confirm 按钮保存更改。
向付费墙页面添加本地货币价格
-
双击付费墙页面上的价格。在 Set from Variable 窗口中，搜索
getPaywallProductResult变量并选择它。 -
按如下方式填写字段：
- Available Options：Data Structured Field
- Select Field：value
- Available Options：Item at Index
- List Index Options：First
- Available Options：Data Structured Field
- Select Field：price
- Available Options：Data Structured Field
- Select Field：amount
- Available Options：Decimal
- Decimal Type：Automatic
- Default Variable Value：null
- UI Builder Display Value：任意内容，本示例中为
price.amount
- 点击 Confirm 保存更改。
大功告成！现在，当您启动应用时，它将直接在付费墙页面上展示来自 Adapty 付费墙的产品数据！ 接下来，是时候让用户购买该产品了。