Présenter les onboardings dans le SDK Capacitor

Les onboardings sont dépréciés dans le SDK v4 et seront supprimés dans une prochaine version. Ils ne reçoivent plus de correctifs ni d’améliorations. Utilisez les flows à la place : contrairement aux onboardings, qui s’exécutent dans une WebView, les flows s’affichent nativement sur l’appareil — offrant des animations plus fluides, un aspect natif cohérent, des temps de chargement plus rapides et aucune dépendance à l’exécution WebView. Consultez Obtenir les flows et paywalls et Afficher les flows et paywalls pour commencer.

Si vous avez personnalisé un onboarding à l’aide du builder, vous n’avez pas à vous soucier de son rendu dans le code de votre application mobile pour l’afficher à l’utilisateur. Un tel onboarding contient à la fois ce qui doit être affiché et la façon dont cela doit l’être.

Avant de commencer, assurez-vous que :

Vous avez créé un onboarding.
Vous avez ajouté l’onboarding à un placement.

Présenter un onboarding

Pour afficher un onboarding, utilisez la méthode view.present() sur la view créée par la méthode createOnboardingView. Chaque view ne peut être utilisée qu’une seule fois. Si vous devez afficher à nouveau l’onboarding, appelez createOnboardingView une nouvelle fois pour créer une nouvelle instance de view.

Réutiliser la même view sans la recréer peut entraîner une erreur.


try {
  const view = await createOnboardingView(onboarding);
  
  view.setEventHandlers({
    onClose: (actionId, meta) => {
      console.log('Onboarding closed:', actionId);
      return true; // Allow the onboarding to close
    },
    onCustom: (actionId, meta) => {
      console.log('Custom action:', actionId);
      return false; // Don't close the onboarding
    }
  });
  
  await view.present();
  console.log('Onboarding presented successfully');
} catch (error) {
  console.error('Failed to present onboarding:', error);
}

Configurer le style de présentation iOS

Configurez la façon dont l’onboarding est présenté sur iOS en passant le paramètre iosPresentationStyle à la méthode present(). Ce paramètre accepte les valeurs 'full_screen' (par défaut) ou 'page_sheet'.

await view.present({ iosPresentationStyle: 'page_sheet' });

Personnaliser l’ouverture des liens dans les onboardings

La personnalisation de l’ouverture des liens dans les onboardings est prise en charge à partir du SDK Adapty v3.15.

Par défaut, les liens dans les onboardings s’ouvrent dans un navigateur intégré à l’application. Cela offre une expérience utilisateur fluide en affichant les pages web directement dans votre application, permettant aux utilisateurs de les consulter sans changer d’application.

Si vous préférez ouvrir les liens dans un navigateur externe, vous pouvez personnaliser ce comportement en définissant le paramètre openIn sur browser_out_app :

await view.present({ openIn: 'browser_out_app' }); // default — browser_in_app

Étapes suivantes

Une fois votre onboarding présenté, vous souhaiterez gérer les interactions utilisateur et les événements. Découvrez comment gérer les événements d’onboarding pour répondre aux actions des utilisateurs et suivre les analyses.