Предпросмотр флоу

Есть два способа просмотреть флоу на разных типах экранов:

Предпросмотр на устройствах: проверьте, как выглядит флоу на реальных устройствах на любом этапе разработки.
Предпросмотр в дашборде Adapty: просматривайте флоу прямо в процессе разработки.

Предпросмотр на устройствах

Чтобы просмотреть флоу на реальном устройстве:

Скачайте мобильное приложение Adapty для iOS или Android и войдите с аккаунтом Adapty, который вы используете в дашборде.
В Flow & Paywall Builder нажмите Test on device.

Кнопка Test on device в Flow & Paywall Builder

Выберите локаль флоу.
Отсканируйте QR-код камерой устройства или откройте ссылку. Это откроет ваш флоу в мобильном приложении Adapty.

Note

Превью флоу в мобильном приложении Adapty показывает примерные цены, так как не имеет доступа к вашим продуктам в сторах. Также оно не передаёт значения для кастомных тегов, поэтому вместо них отображается начальное значение каждого тега.

Locale selector and QR code in the Test on device dialog

Устранение неполадок

Если флоу не открывается в превью, как правило, причина в незавершённом действии, пустом экране или непривязанном продукте. Полный список см. в разделе Частые проблемы.

Если превью завершается ошибкой HTTP 401, значит мобильное приложение Adapty не авторизовано. Войдите в аккаунт Adapty, который используете в дашборде, и снова отсканируйте QR-код.

Предпросмотр в дашборде Adapty

Tip

Чтобы убедиться, что флоу готов к публикации, проверьте его на реальном устройстве и убедитесь, что он отображается без ошибок.

Вы можете просматривать флоу на разных типах экранов с помощью области предпросмотра во Flow & Paywall Builder. Это помогает убедиться, что флоу хорошо выглядит на различных устройствах и размерах экранов.

С помощью элементов управления предпросмотром под областью просмотра вы можете:

Выбрать устройство для предпросмотра флоу.
Переключаться между горизонтальным и вертикальным режимами предпросмотра.
Переключаться между светлым и тёмным режимами.
Переключаться между языковыми настройками.

Tip

Всегда проверяйте предпросмотр для разных локалей: в разных языках слова имеют разную длину, и макет экрана может выглядеть по-разному.
В области предпросмотра билдера каждая кастомная переменная отображает своё начальное значение, например Jane Doe для переменной name. Для кастомного тега не вводите тестовые данные: пользователи видят его начальное значение как фолбэк, когда приложение не передаёт никакого значения. Введите слово, подходящее любому пользователю, например друг в «С возвращением, друг!»

Предварительный просмотр продуктов и предложений

Предварительный просмотр читает переменные продуктов из вашего каталога Adapty, что охватывает лишь часть того, что устройство получает при разрешении:

prod_title отображает название продукта в том виде, в каком оно хранится в Adapty. prod_price и переменные prod_price_per_* показывают цену из Adapty в долларах США — пользователи видят локализованную цену из стора.
offer_price, offer_billing_period и offer_full_duration остаются неразрешёнными, поэтому в превью отображается имя переменной в фигурных скобках — например, {{products.selectedProduct.offer_price}}. Эти значения передаются во флоу, когда SDK рендерит его в вашем приложении.
is_free_trial, is_pay_up_front и is_pay_as_you_go зависят от оффера, выбранного на карточке продукта. Если оффер не выбран, все три равны false. Если оффер выбран, превью считает его pay-as-you-go.

Условия на тип оффера переключаются в превью, но по умолчанию отображается только ветка pay-as-you-go. Чтобы увидеть остальные ветки, смоделируйте режим оплаты:

На холсте выберите карточку продукта с оффером.
На правой панели в разделе Product откройте выпадающий список офферов.
В разделе Preview as выберите Free trial, Pay up front или Pay as you go. Эта настройка применяется только к текущей карточке.