Activer les achats dans votre paywall personnalisé avec le SDK Flutter

Ce guide explique comment intégrer Adapty dans vos paywalls personnalisés. Gardez le contrôle total sur l’implémentation de vos paywalls, pendant que le SDK Adapty récupère les produits, gère les nouveaux achats et restaure les précédents. Ce guide utilise les APIs du SDK Adapty Flutter v4 — si vous utilisez la v3, consultez le guide de migration pour les noms de méthodes correspondants.

Avant de commencer

Configurer les produits

Pour activer les achats intégrés, vous devez comprendre trois concepts clés :

• Produits – tout ce que les utilisateurs peuvent acheter (abonnements, consommables, accès à vie)
• Paywalls – configurations qui définissent quels produits proposer. Dans Adapty, les paywalls sont le seul moyen de récupérer des produits, mais cette approche vous permet de modifier les produits, les prix et les offres sans toucher au code de votre application. Dans le SDK v4, les variantes de paywall pour un placement sont portées par un objet flow — vous récupérez un flow et interrogez ses produits.
• Placements – où et quand vous affichez les paywalls dans votre application (par exemple main, onboarding, settings). Vous configurez les paywalls pour les placements dans le tableau de bord, puis vous les demandez par ID de placement dans votre code. Cela facilite la mise en place de tests A/B et l’affichage de paywalls différents selon les utilisateurs.

Assurez-vous de bien comprendre ces concepts, même si vous utilisez un paywall personnalisé. En résumé, ce sont simplement les outils qui vous permettent de gérer les produits que vous vendez dans votre application.

Pour implémenter votre paywall personnalisé, vous devrez créer un paywall et l’ajouter à un placement. Cette configuration vous permet de récupérer vos produits. Pour savoir ce que vous devez faire dans le tableau de bord, suivez le guide de démarrage rapide ici.

Gérer les utilisateurs

Vous pouvez travailler avec ou sans authentification backend de votre côté.

Cependant, le SDK Adapty gère différemment les utilisateurs anonymes et identifiés. Lisez le guide de démarrage rapide sur l’identification pour en comprendre les spécificités et vous assurer de bien gérer vos utilisateurs.

Étape 1. Récupérer les produits

Pour récupérer les produits de votre paywall personnalisé, vous devez :

1. Obtenir l’objet flow en passant l’ID du placement à la méthode getFlow.
2. Obtenir le tableau de produits pour ce flow avec la méthode getPaywallProducts.

Future<void> loadPaywall() async {
  try {
    final flow = await Adapty().getFlow(placementId: 'YOUR_PLACEMENT_ID');
    final products = await Adapty().getPaywallProducts(flow: flow);
    
    // Use products to build your custom paywall UI
  } on AdaptyError catch (adaptyError) {
    // Handle the error
  } catch (e) {
    // Handle the error
  }
}

Étape 2. Accepter les achats

Lorsqu’un utilisateur appuie sur un produit dans votre paywall personnalisé, appelez la méthode makePurchase avec le produit sélectionné. Cela gère le flux d’achat et retourne le profil mis à jour.

Future<void> purchaseProduct(AdaptyPaywallProduct product) async {
  try {
    final purchaseResult = await Adapty().makePurchase(product: product);
    
    switch (purchaseResult) {
      case AdaptyPurchaseResultSuccess(profile: final profile):
        // Purchase successful, profile updated
        break;
      case AdaptyPurchaseResultUserCancelled():
        // User canceled the purchase
        break;
      case AdaptyPurchaseResultPending():
        // Purchase is pending (e.g., user will pay offline with cash)
        break;
    }
  } on AdaptyError catch (adaptyError) {
    // Handle the error
  } catch (e) {
    // Handle the error
  }
}

Étape 3. Restaurer les achats

Les stores exigent que toutes les applications proposant des abonnements offrent un moyen de restaurer les achats.

Appelez la méthode restorePurchases lorsque l’utilisateur appuie sur le bouton de restauration. Cela synchronisera son historique d’achats avec Adapty et renverra le profil mis à jour.

Future<void> restorePurchases() async {
  try {
    final profile = await Adapty().restorePurchases();
    // Restore successful, profile updated
  } on AdaptyError catch (adaptyError) {
    // Handle the error
  } catch (e) {
    // Handle the error
  }
}

Étape 4. Vérifier le statut de l’abonnement

Après un achat ou une restauration, vérifiez le niveau d’accès de l’utilisateur pour décider d’afficher le paywall ou de débloquer les fonctionnalités payantes. Les méthodes makePurchase et restorePurchases renvoient déjà le profil mis à jour ; pour connaître le statut actuel ailleurs dans l’application, utilisez la méthode getProfile :

Future<bool> hasPremiumAccess() async {
  try {
    final profile = await Adapty().getProfile();
    return profile.accessLevels['premium']?.isActive ?? false;
  } on AdaptyError catch (adaptyError) {
    // Handle the error
  } catch (e) {
    // Handle the error
  }
  return false;
}

Pour d’autres façons de vérifier et surveiller le statut de l’abonnement, notamment en écoutant les mises à jour en temps réel, consultez Vérifier le statut de l’abonnement.

Étapes suivantes

Votre paywall est prêt à être affiché dans l’application. Testez vos achats dans le sandbox de l’App Store ou dans le Google Play Store pour vous assurer de pouvoir effectuer un achat test depuis le paywall. Pour voir comment cela fonctionne dans une implémentation prête pour la production, consultez le PurchasesObserver dans notre exemple d’application, qui illustre la gestion des achats avec une gestion appropriée des erreurs, des observateurs d’interface utilisateur et une intégration complète du SDK.