Получение флоу и пейволов — iOS

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

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

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

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

do {
    let flow = try await Adapty.getFlow(placementId: "YOUR_PLACEMENT_ID")
    // запрошенный флоу/пейвол
} catch {
    // обработка ошибки
}

Adapty.getFlow(placementId: "YOUR_PLACEMENT_ID") { result in
    switch result {
        case let .success(flow):
            // запрошенный флоу/пейвол
        case let .failure(error):
            // обработка ошибки
    }
}

Параметры:

Получение конфигурации представления

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

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

guard flow.hasViewConfiguration else {
    // handle as remote config paywall
    return
}

let flowConfiguration = try await AdaptyUI.getFlowConfiguration(forFlow: flow)

Параметры:

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

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

Adapty.getFlowForDefaultAudience(placementId: "YOUR_PLACEMENT_ID") { result in
    switch result {
        case let .success(flow):
            // the requested flow
        case let .failure(error):
            // handle the error
    }
}

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

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

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

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

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

• Показывать разные изображения или видео разным пользователям.
• Показывать локальное превью, пока загружается основное изображение с сервера.
• Показывать превью перед воспроизведением видео.
• Указать разрешение видео в пикселях, чтобы плеер заранее зарезервировал место в макете (соотношение сторон = width / height) до загрузки видео. Передайте nil, чтобы пропустить этот параметр.

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

let customAssets: [String: AdaptyCustomAsset] = [
    // Show a local image using a custom ID
    "custom_image": .image(
        .uiImage(value: UIImage(named: "image_name")!)
    ),

    // Show a local preview image while a remote main image is loading
    "hero_image": .image(
        .remote(
            url: URL(string: "https://example.com/image.jpg")!,
            preview: UIImage(named: "preview_image")
        )
    ),

    // Show a local video with a preview image and a known resolution
    "hero_video": .video(
        .file(
            url: Bundle.main.url(forResource: "custom_video", withExtension: "mp4")!,
            preview: .uiImage(value: UIImage(named: "video_preview")!),
            resolution: CGSize(width: 1080, height: 1920)
        )
    ),
]

let flowConfig = try await AdaptyUI.getFlowConfiguration(
    forFlow: flow,
    assetsResolver: customAssets
)

Настройка таймеров, заданных разработчиком

Чтобы использовать пользовательские таймеры в мобильном приложении, создайте объект, реализующий протокол AdaptyTimerResolver. Этот объект определяет, как должен отображаться каждый таймер. Если хотите, можно напрямую использовать словарь [String: Date] — он уже соответствует этому протоколу. Пример:

@MainActor
struct AdaptyTimerResolverImpl: AdaptyTimerResolver {
    func timerEndAtDate(for timerId: String) -> Date {
        switch timerId {
        case "CUSTOM_TIMER_6H":
            Date(timeIntervalSinceNow: 3600.0 * 6.0) // 6 hours
        case "CUSTOM_TIMER_NY":
            Calendar.current.date(from: DateComponents(year: 2025, month: 1, day: 1)) ?? Date(timeIntervalSinceNow: 3600.0)
        default:
            Date(timeIntervalSinceNow: 3600.0) // 1 hour
        }
    }
}

В этом примере CUSTOM_TIMER_NY и CUSTOM_TIMER_6H — это Timer ID пользовательских таймеров, заданных вами в дашборде Adapty. timerResolver гарантирует, что приложение динамически обновляет каждый таймер правильным значением. Например:

• CUSTOM_TIMER_NY: время, оставшееся до окончания таймера, например до Нового года.
• CUSTOM_TIMER_6H: время, оставшееся в 6-часовом периоде, который начался, когда пользователь открыл пейвол.

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

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

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

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

Чтобы получить пейвол, используйте метод getPaywall:

do {
    let paywall = try await Adapty.getPaywall("YOUR_PLACEMENT_ID")
    // the requested paywall
} catch {
    // handle the error
}

Adapty.getPaywall(placementId: "YOUR_PLACEMENT_ID", locale: "en") { result in
    switch result {
        case let .success(paywall):
            // the requested paywall
        case let .failure(error):
            // handle the error
    }
}

Параметры:

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

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

guard paywall.hasViewConfiguration else {
    //  use your custom logic
    return
}

do {
    let paywallConfiguration = try await AdaptyUI.getPaywallConfiguration(
            forPaywall: paywall,
            products: products
    )
    // use loaded configuration
} catch {
    // handle the error
}

Параметры:

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

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

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

Adapty.getPaywallForDefaultAudience(placementId: "YOUR_PLACEMENT_ID", locale: "en") { result in
    switch result {
        case let .success(paywall):
            // the requested paywall
        case let .failure(error):
            // handle the error
    }
}

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

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

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

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

Например, можно:

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

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

let customAssets: [String: AdaptyCustomAsset] = [
    // Показать локальное изображение с пользовательским ID
    "custom_image": .image(
        .uiImage(value: UIImage(named: "image_name")!)
    ),

    // Показать локальное превью, пока загружается основное изображение
    "hero_image": .image(
        .remote(
            url: URL(string: "https://example.com/image.jpg")!,
            preview: UIImage(named: "preview_image")
        )
    ),

    // Показать локальное видео с превью-изображением
    "hero_video": .video(
        .file(
            url: Bundle.main.url(forResource: "custom_video", withExtension: "mp4")!,
            preview: .uiImage(value: UIImage(named: "video_preview")!)
        )
    ),
]

let paywallConfig = try await AdaptyUI.getPaywallConfiguration(
    forPaywall: paywall,
    assetsResolver: customAssets
)

Настройка таймеров, определённых разработчиком

Чтобы использовать пользовательские таймеры в мобильном приложении, создайте объект, реализующий протокол AdaptyTimerResolver. Этот объект определяет, как должен отображаться каждый таймер. Если хотите, можно напрямую использовать словарь [String: Date] — он уже соответствует этому протоколу. Пример:

@MainActor
struct AdaptyTimerResolverImpl: AdaptyTimerResolver {
    func timerEndAtDate(for timerId: String) -> Date {
        switch timerId {
        case "CUSTOM_TIMER_6H":
            Date(timeIntervalSinceNow: 3600.0 * 6.0) // 6 часов
        case "CUSTOM_TIMER_NY":
            Calendar.current.date(from: DateComponents(year: 2025, month: 1, day: 1)) ?? Date(timeIntervalSinceNow: 3600.0)
        default:
            Date(timeIntervalSinceNow: 3600.0) // 1 час
        }
    }
}

В этом примере CUSTOM_TIMER_NY и CUSTOM_TIMER_6H — это Timer ID таймеров, заданных разработчиком в дашборде Adapty. timerResolver гарантирует, что приложение динамически обновляет каждый таймер нужным значением. Например:

• CUSTOM_TIMER_NY: время, оставшееся до окончания таймера, например до Нового года.
• CUSTOM_TIMER_6H: время, оставшееся в 6-часовом периоде, который начался, когда пользователь открыл пейвол.