Presentar onboardings en el SDK de Kotlin Multiplatform

Los onboardings están obsoletos en SDK v4 y se eliminarán en una versión futura. Ya no reciben correcciones ni mejoras. Usa flows en su lugar: a diferencia de los onboardings, que se ejecutan dentro de un WebView, los flows se renderizan de forma nativa en el dispositivo, lo que ofrece animaciones más fluidas, una apariencia nativa consistente, tiempos de carga más rápidos y sin dependencia del runtime de WebView. Consulta Obtener flows y paywalls y Mostrar flows y paywalls para empezar.

Si has personalizado un onboarding con el builder, no necesitas preocuparte por renderizarlo en el código de tu app Kotlin Multiplatform para mostrárselo al usuario. Ese onboarding incluye tanto lo que debe mostrarse como la forma en que debe mostrarse.

Antes de empezar, asegúrate de que:

Tienes instalado el SDK de Adapty para Kotlin Multiplatform 3.16.1 o posterior.
Has creado un onboarding.
Has añadido el onboarding a un placement.

Adapty Kotlin Multiplatform SDK ofrece dos formas de mostrar onboardings:

Con Compose Multiplatform
Sin Compose Multiplatform

Con Compose Multiplatform

Para mostrar un onboarding, usa el método view.present() en el view creado por el método createOnboardingView. Cada view solo puede usarse una vez. Si necesitas mostrar el onboarding de nuevo, llama a createOnboardingView otra vez para crear una nueva instancia de view.

Reutilizar el mismo view sin recrearlo puede provocar un error.


viewModelScope.launch {
    AdaptyUI.createOnboardingView(onboarding = onboarding).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

Configurar el estilo de presentación en iOS

Configura cómo se presenta el onboarding en iOS pasando el parámetro iosPresentationStyle al método present(). El parámetro acepta los valores AdaptyUIIOSPresentationStyle.FULLSCREEN (predeterminado) o AdaptyUIIOSPresentationStyle.PAGESHEET.


viewModelScope.launch {
    val view = AdaptyUI.createOnboardingView(onboarding = onboarding).getOrNull()
    view?.present(iosPresentationStyle = AdaptyUIIOSPresentationStyle.PAGESHEET)
}

Personalizar cómo se abren los enlaces en los onboardings

Por defecto, los enlaces en los onboardings se abren en un navegador integrado en la app. Esto ofrece una experiencia fluida al mostrar las páginas web dentro de tu aplicación, sin que el usuario tenga que cambiar de app.

Si prefieres que los enlaces se abran en un navegador externo, puedes personalizar este comportamiento estableciendo el parámetro externalUrlsPresentation en AdaptyWebPresentation.EXTERNAL_BROWSER:


viewModelScope.launch {
    AdaptyUI.createOnboardingView(
        onboarding = onboarding,
        externalUrlsPresentation = AdaptyWebPresentation.EXTERNAL_BROWSER // default – IN_APP_BROWSER
    ).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

Sin Compose Multiplatform

createNativeOnboardingView forma parte del módulo principal io.adapty:adapty-kmp. Si tu proyecto no usa Compose Multiplatform, no necesitas la dependencia io.adapty:adapty-kmp-ui.

Para integrar un onboarding sin Compose Multiplatform, llama a createNativeOnboardingView. Devuelve un AdaptyNativeOnboardingView que puedes añadir a tu layout:


val nativeView = AdaptyUI.createNativeOnboardingView(
    context = context,
    viewModelStoreOwner = activity,
    onboarding = onboarding,
    observer = myOnboardingObserver,
)

// Embed in your Compose layout:
AndroidView(
    factory = { nativeView.view },
    modifier = Modifier.fillMaxSize()
)

Dado que los métodos por defecto de la interfaz KMP se convierten en @required en Swift, no puedes implementar AdaptyUIOnboardingsEventsObserver directamente desde Swift. Primero declara una clase base abierta en iosMain:

open class BaseOnboardingObserver : AdaptyUIOnboardingsEventsObserver

Luego crea una subclase en Swift, sobreescribiendo solo lo que necesites:

class MyOnboardingObserver: BaseOnboardingObserver {
    override func onboardingViewOnCloseAction(
        view: AdaptyUIOnboardingView,
        meta: AdaptyUIOnboardingMeta,
        actionId: String
    ) {
        // remove nativeView from your view hierarchy
    }
}

let nativeView = AdaptyUI.shared.createNativeOnboardingView(
    onboarding: onboarding,
    observer: MyOnboardingObserver()
)
// nativeView.viewController is a UIViewController.
// Add it to your SwiftUI view or UIKit hierarchy.

Liberar la vista

Llama a dispose() cuando elimines la vista de tu layout. Esto cancela el registro del listener de eventos y libera los recursos internos.

nativeView.dispose()