Шаг 1. Создайте флоу для отображения данных пейвола

После добавления библиотеки Adapty в качестве зависимости в ваш проект FlutterFlow, пора выстроить флоу, который получает данные пейвола и продуктов из Adapty и отображает их на пейволе, созданном в FlutterFlow.

Для начала нужно получить данные пейвола из Adapty. Сначала мы запросим пейвол Adapty, затем связанные с ним продукты, и наконец проверим, были ли данные успешно получены. Если да — отобразим название продукта и цену на странице пейвола. В противном случае покажем сообщение об ошибке.

Перед тем как продолжить, убедитесь, что вы выполнили следующее:

1. Создайте хотя бы один пейвол и добавьте в него хотя бы один продукт в дашборде Adapty.
2. Создайте хотя бы один плейсмент и добавьте в него свой пейвол в дашборде Adapty.

Начнём!

Шаг 1.1. Запрос пейвола Adapty

Как уже говорилось, чтобы отобразить данные на пейволе FlutterFlow, сначала нужно получить их из Adapty. Первый шаг — получить сам пейвол Adapty. Вот как это сделать:

1. Откройте экран пейвола и перейдите в раздел Actions на правой панели. Там откройте Action Flow Editor.

2. В окне Select Action Trigger выберите On Page Load.

3. Нажмите Add Action. Затем найдите кастомное действие getPaywall и выберите его.

4. В разделе Set Actions Arguments введите реальный ID плейсмента, который вы создали в дашборде Adapty и который включает пейвол. В данном примере это monthly. Обязательно используйте реальный ID вашего плейсмента!

5. Если вы локализовали ваш пейвол в дашборде Adapty, вы также можете указать аргумент locale.

6. В поле Action Output Variable Name создайте новую переменную и назовите её getPaywallResult. Мы используем её на следующем шаге, чтобы обратиться к пейволу Adapty и запросить его продукты.

Шаг 1.2. Запрос продуктов пейвола Adapty

Отлично! Мы получили пейвол 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. Добавление проверки успешной загрузки пейвола

Прежде чем двигаться дальше, проверим, что пейвол Adapty был получен успешно. Если да — обновим пейвол данными продуктов. Если нет — обработаем ошибку. Вот как добавить эту проверку:

1. Нажмите + и выберите Add Conditional.

2. В разделе Action Output выберите созданную ранее переменную результата действия (getPaywallResult в нашем примере).

3. Чтобы проверить, что пейвол Adapty получен, убедитесь в наличии поля со значением. Заполните поля следующим образом:

• Available Options: Has Field
• Field (AdaptyGetPaywallResult): value

4. Нажмите Confirm, чтобы завершить создание условия.

Шаг 1.4. Логирование просмотра пейвола

Чтобы аналитика Adapty фиксировала просмотры пейвола, нужно залогировать это событие. Без этого шага просмотр не будет учтён в аналитике. Вот как это сделать:

1. Нажмите + под меткой TRUE и выберите Add Action.
2. В поле Select Action найдите и выберите logShowPaywall.

3. Нажмите Value в области Set Action Arguments и выберите созданную переменную getPaywallResult. Эта переменная содержит данные пейвола.
4. Заполните поля следующим образом:

• Available Options: Data Structured Field
• Select Field: value

5. Нажмите Confirm.

Шаг 1.5. Отображение ошибки при неполучении пейвола

Если пейвол Adapty не получен, необходимо обработать ошибку. В этом примере мы просто покажем диалоговое окно с сообщением.

1. Добавьте действие Informational Dialog к метке FALSE.

2. В поле Title введите текст, который хотите видеть в качестве заголовка диалога. В этом примере — Error.

3. Нажмите Value в поле Message.

4. Заполните поля следующим образом:

• Set Variable: переменная getPaywallProductResult, которую мы создали
• Available Options: Data Structure Field
• Select Field: error
• Available Options: Data Structure Field
• Select Field: errorMessage

5. Нажмите Confirm.
6. Добавьте действие Terminate action во флоу FALSE.

7. Нажмите Close в правом верхнем углу.

Поздравляем! Вы успешно получили данные продуктов. Теперь давайте свяжем их с пейволом, разработанным в FlutterFlow.