Présenter des flows en mode Observateur - Kotlin Multiplatform

Si vous utilisez le mode Observateur, vous êtes responsable de votre propre logique d’achat. Mais vous pouvez déléguer l’interface du paywall au Flow & Paywall Builder.

Concevez l’écran dans le builder, et le SDK Adapty le rend nativement. Modifiez le contenu, la mise en page et les tarifs quand vous le souhaitez, sans soumettre de mise à jour.

Ce guide explique comment afficher un flow et gérer les callbacks d’achat. Si Adapty gère les achats à votre place, consultez Afficher les flows et paywalls à la place.

Avant de commencer

Vous avez besoin de :

• Adapty Kotlin Multiplatform SDK 4.0 (bêta) ou version ultérieure : Les versions antérieures ne peuvent pas afficher les flows. Pour migrer une application existante, consultez le guide de migration.
• withObserverMode(true) appelé dans le builder de configuration : Consultez le guide d’installation du SDK Kotlin Multiplatform.
• Intégration initiale avec le store : Configurez Adapty avec l’App Store et avec Google Play.
• Un flow publié avec des produits : Créez-le dans le Flow & Paywall Builder et assignez-lui des produits.
• Un placement pour le flow : Créez un placement et assignez-lui votre flow.
• Le flow récupéré dans votre application : Récupérez le flow et sa configuration avant de l’afficher.

Implémentation

En mode Observer, le SDK n’effectue pas les achats à votre place. Lorsqu’un utilisateur appuie sur le bouton d’achat ou de restauration dans un flow affiché par Adapty, le SDK appelle votre AdaptyUIObserverModeResolver à la place — effectuez l’achat ou la restauration avec votre propre code à cet endroit.

1. Implémentez l’interface AdaptyUIObserverModeResolver :

   import com.adapty.kmp.AdaptyUIObserverModeResolver
   import com.adapty.kmp.models.AdaptyPaywallProduct
   import com.adapty.kmp.models.AdaptyUIFlowView
   
   class MyObserverModeResolver : AdaptyUIObserverModeResolver {
       override fun observerModeDidInitiatePurchase(
           view: AdaptyUIFlowView,
           product: AdaptyPaywallProduct,
           onStartPurchase: () -> Unit,
           onFinishPurchase: () -> Unit
       ) {
           onStartPurchase() // the view shows its loading indicator
           // make the purchase with your own code,
           // then report the transaction to Adapty and call:
           onFinishPurchase() // the view hides the loading indicator
       }
   
       override fun observerModeDidInitiateRestore(
           view: AdaptyUIFlowView,
           onStartRestore: () -> Unit,
           onFinishRestore: () -> Unit
       ) {
           onStartRestore()
           // restore purchases with your own code, then:
           onFinishRestore()
       }
   }

Le callback observerModeDidInitiatePurchase vous informe que l’utilisateur a initié un achat, et observerModeDidInitiateRestore — que l’utilisateur a initié une restauration. Déclenchez votre flow d’achat ou de restauration personnalisé en réponse.

N’oubliez pas non plus d’appeler les callbacks suivants pour notifier AdaptyUI de l’avancement de l’achat ou de la restauration. Cela est nécessaire pour le bon fonctionnement du flow, notamment pour afficher le loader :

Le flow reste ouvert pendant que votre code s’exécute — fermez-le vous-même après un achat ou une restauration réussie.

2. Enregistrez le resolver avant d’afficher n’importe quel écran :

   import com.adapty.kmp.AdaptyUI
   
   AdaptyUI.setObserverModeResolver(MyObserverModeResolver())

   Sans resolver enregistré, la vue du flow n’a aucun moyen de transmettre l’achat à votre code, et rien ne se passe lorsque l’utilisateur appuie sur le bouton d’achat.

3. Créez et présentez la vue du flow comme d’habitude : récupérez le flow et créez sa vue, puis présentez-la. Aucun paramètre supplémentaire n’est nécessaire — une fois le resolver enregistré, chaque flow rendu par Adapty achemine les achats et les restaurations à travers lui.