Получение флоу и пейволов - Android

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

Перед началом работы

Вам понадобится:

• Продукты в дашборде Adapty: Создайте продукты.
• Флоу с продуктами: Создайте его в Flow & Paywall Builder и привяжите к нему продукты.
• Плейсмент: Создайте плейсмент и назначьте на него флоу.
• Установленный SDK: Следуйте руководству по установке Android SDK.

Получение флоу/пейвола

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

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

Для получения флоу или пейвола используйте метод getFlow:

...

Adapty.getFlow("YOUR_PLACEMENT_ID", loadTimeout = 10.seconds) { result ->
    when (result) {
        is AdaptyResult.Success -> {
            val flow = result.value
            // the requested flow/paywall
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

...

Adapty.getFlow("YOUR_PLACEMENT_ID", TimeInterval.seconds(10), result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyFlow flow = ((AdaptyResult.Success<AdaptyFlow>) result).getValue();
        // the requested flow/paywall

    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error

    }
});

Параметры:

Параметры ответа:

Получение конфигурации отображения

После получения флоу или пейвола проверьте, содержит ли он конфигурацию отображения, с помощью flow.hasViewConfiguration. Этот флаг показывает, каким способом плейсмент был создан в дашборде Adapty:

• true — плейсмент был создан в Flow & Paywall Builder (флоу) или в старом Paywall Builder (пейвол). Adapty самостоятельно отрисовывает интерфейс. Продолжайте выполнять шаги ниже, чтобы получить конфигурацию отображения и показать флоу или пейвол.
• false — плейсмент является пользовательским пейволом без интерфейса Builder. Обработайте его как пейвол с Remote Config.

if (!flow.hasViewConfiguration) {
    // use your custom logic
    return
}

AdaptyUI.getFlowConfiguration(flow, loadTimeout = 10.seconds) { result ->
    when(result) {
        is AdaptyResult.Success -> {
            val flowConfiguration = result.value
            // use loaded configuration
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

if (!flow.hasViewConfiguration()) {
    // use your custom logic
    return;
}

AdaptyUI.getFlowConfiguration(flow, TimeInterval.seconds(10), result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyUI.FlowConfiguration flowConfiguration =
          ((AdaptyResult.Success<AdaptyUI.FlowConfiguration>) result).getValue();
        // use loaded configuration
    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error
    }
});

После загрузки отобразите флоу или пейвол.

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

Как правило, флоу и пейволы загружаются почти мгновенно, поэтому беспокоиться об ускорении этого процесса не нужно. Однако если у вас много аудиторий и плейсментов, а пользователи работают при слабом интернет-соединении, загрузка флоу или пейвола может занять больше времени, чем хотелось бы. В таких случаях имеет смысл показывать флоу или пейвол для аудитории по умолчанию — это обеспечит плавный пользовательский опыт вместо пустого экрана.

Чтобы решить эту проблему, используйте метод getFlowForDefaultAudience, который получает флоу или пейвол указанного плейсмента для аудитории All Users. Однако важно понимать, что рекомендуемый подход — получать флоу или пейвол через метод getFlow, как описано в разделе Получение флоу/пейвола выше.

Adapty.getFlowForDefaultAudience("YOUR_PLACEMENT_ID") { result ->
    when (result) {
        is AdaptyResult.Success -> {
            val flow = result.value
            // the requested flow
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

Adapty.getFlowForDefaultAudience("YOUR_PLACEMENT_ID", result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyFlow flow = ((AdaptyResult.Success<AdaptyFlow>) result).getValue();
        // the requested flow

    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error

    }
});

Настройка ассетов

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

Главные изображения и видео имеют предопределённые идентификаторы: hero_image и hero_video. В бандле пользовательских ассетов вы обращаетесь к этим элементам по их идентификаторам и настраиваете их поведение.

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

Например, вы можете:

• Показывать разное изображение или видео отдельным пользователям.
• Показывать локальное превью-изображение, пока загружается основное удалённое изображение.
• Показывать превью-изображение перед запуском видео.

Вот пример того, как передавать пользовательские ресурсы через простой словарь:

val customAssets = AdaptyCustomAssets.of(
    "hero_image" to
            AdaptyCustomImageAsset.remote(
                url = "https://example.com/image.jpg",
                preview = AdaptyCustomImageAsset.file(
                    FileLocation.fromAsset("images/hero_image_preview.png"),
                )
            ),
    "hero_video" to
            AdaptyCustomVideoAsset.file(
                FileLocation.fromResId(requireContext(), R.raw.custom_video),
                preview = AdaptyCustomImageAsset.file(
                    FileLocation.fromResId(requireContext(), R.drawable.video_preview),
                ),
            ),
)

val flowView = AdaptyUI.getFlowView(
    activity,
    flowConfiguration,
    products,
    eventListener,
    insets,
    customAssets,
)

Для видео можно дополнительно передать resolution, чтобы заранее зарезервировать место в макете и задать соотношение сторон (width / height) до загрузки видео:

AdaptyCustomVideoAsset.file(
    FileLocation.fromResId(requireContext(), R.raw.custom_video),
    preview = AdaptyCustomImageAsset.file(
        FileLocation.fromResId(requireContext(), R.drawable.video_preview),
    ),
    resolution = AdaptyCustomVideoAsset.Resolution(width = 1080, height = 1920),
)

После того как вы разработали визуальную часть пейвола с помощью старого Paywall Builder в дашборде Adapty, его можно отобразить в мобильном приложении. Первый шаг — получить пейвол, связанный с плейсментом, и его конфигурацию отображения, как описано ниже.

Пожалуйста, обратите внимание, что эта тема посвящена пейволам, настроенным с помощью Paywall Builder. Если вы реализуете пейволы вручную, обратитесь к теме Получение пейволов и продуктов для Remote Config пейволов в вашем мобильном приложении.

Получение пейвола, созданного в Paywall Builder

Если вы создали пейвол с помощью Paywall Builder, вам не нужно беспокоиться о его отрисовке в коде мобильного приложения — пейвол уже содержит всю информацию о том, что и как должно отображаться. Тем не менее, вам нужно получить его ID через плейсмент, конфигурацию отображения, а затем показать пейвол в мобильном приложении.

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

Для получения пейвола используйте метод getPaywall:

...

Adapty.getPaywall("YOUR_PLACEMENT_ID", locale = "en", loadTimeout = 10.seconds) { result ->
    when (result) {
        is AdaptyResult.Success -> {
            val paywall = result.value
            // the requested paywall
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

...

Adapty.getPaywall("YOUR_PLACEMENT_ID", "en", TimeInterval.seconds(10), result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyPaywall paywall = ((AdaptyResult.Success<AdaptyPaywall>) result).getValue();
        // the requested paywall
      
    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error
      
    }
});

Параметры:

Параметры ответа:

Получение конфигурации отображения пейвола, созданного в Paywall Builder

После получения пейвола проверьте, содержит ли он ViewConfiguration — это означает, что он был создан с помощью Paywall Builder. Это подскажет вам, как отображать пейвол. Если ViewConfiguration присутствует, обработайте его как пейвол Paywall Builder; если нет — обработайте его как пейвол с Remote Config.

if (!paywall.hasViewConfiguration) {
    // use your custom logic
    return
}

AdaptyUI.getViewConfiguration(paywall, loadTimeout = 10.seconds) { result ->
    when(result) {
        is AdaptyResult.Success -> {
            val viewConfiguration = result.value
            // use loaded configuration
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

if (!paywall.hasViewConfiguration()) {
    // use your custom logic
    return;
}

AdaptyUI.getViewConfiguration(paywall, TimeInterval.seconds(10), result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyUI.LocalizedViewConfiguration viewConfiguration =
          ((AdaptyResult.Success<AdaptyUI.LocalizedViewConfiguration>) result).getValue();
        // use loaded configuration
    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error
    }
});

После загрузки отобразите пейвол.

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

Как правило, пейволы загружаются почти мгновенно, поэтому беспокоиться об ускорении этого процесса не нужно. Однако если у вас много аудиторий и пейволов, а пользователи работают при слабом интернет-соединении, загрузка пейвола может занять больше времени, чем хотелось бы. В таких случаях имеет смысл показывать пейвол по умолчанию — это обеспечит плавный пользовательский опыт вместо того, чтобы не показывать пейвол вовсе.

Чтобы решить эту проблему, можно использовать метод getPaywallForDefaultAudience, который получает пейвол указанного плейсмента для аудитории All Users. Однако важно понимать, что рекомендуемый подход — получать пейвол с помощью метода getPaywall, как описано в разделе Получение информации о пейволе выше.

Adapty.getPaywallForDefaultAudience("YOUR_PLACEMENT_ID", locale = "en") { result ->
    when (result) {
        is AdaptyResult.Success -> {
            val paywall = result.value
            // the requested paywall
        }
        is AdaptyResult.Error -> {
            val error = result.error
            // handle the error
        }
    }
}

Adapty.getPaywallForDefaultAudience("YOUR_PLACEMENT_ID", "en", result -> {
    if (result instanceof AdaptyResult.Success) {
        AdaptyPaywall paywall = ((AdaptyResult.Success<AdaptyPaywall>) result).getValue();
        // the requested paywall

    } else if (result instanceof AdaptyResult.Error) {
        AdaptyError error = ((AdaptyResult.Error) result).getError();
        // handle the error
      
    }
});

Настройка ассетов

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

У hero-изображений и видео есть предустановленные ID: hero_image и hero_video. В пакете кастомных ассетов вы обращаетесь к этим элементам по их ID и настраиваете их поведение.

Для остальных изображений и видео нужно задать кастомный ID в дашборде Adapty.

Например, вы можете:

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

Вот пример того, как можно передавать пользовательские ресурсы через простой словарь:

val customAssets = AdaptyCustomAssets.of(
    "hero_image" to
            AdaptyCustomImageAsset.remote(
                url = "https://example.com/image.jpg",
                preview = AdaptyCustomImageAsset.file(
                    FileLocation.fromAsset("images/hero_image_preview.png"),
                )
            ),
    "hero_video" to
            AdaptyCustomVideoAsset.file(
                FileLocation.fromResId(requireContext(), R.raw.custom_video),
                preview = AdaptyCustomImageAsset.file(
                    FileLocation.fromResId(requireContext(), R.drawable.video_preview),
                ),
            ),
)

val paywallView = AdaptyUI.getPaywallView(
    activity,
    viewConfiguration,
    products,
    eventListener,
    insets,
    customAssets,
)