English 中文TürkçeРусскийFrançaisTiếng ViệtEspañol日本語

Étape 2. Ajouter des données à la page paywall

Une fois que vous avez récupéré toutes les données produit nécessaires, il est temps de les mapper sur le paywall que vous avez conçu dans FlutterFlow. Dans cet exemple, nous allons mapper le titre du produit et son prix.

Étape 2.1. Ajouter le titre du produit à la page paywall

  1. Double-cliquez sur le texte du produit sur votre page paywall. Dans la fenêtre Set from Variable, recherchez la variable getPaywallProductResult et sélectionnez-la.
ff-paywall-text.webp
  1. Remplissez les champs comme suit :
  • Available Options : Data Structured Field
  • Select Field : value
  • Available Options : Item at Index
  • List Index Options : First
  • Available Options : Data Structured Field
  • Select Field : localizedTitle
  • Default Variable Value : null
  • UI Builder Display Value : N’importe quoi, dans l’exemple c’est product.title
ff-product.webp
  1. Cliquez sur Confirm pour enregistrer les modifications.

Étape 2.2. Ajouter le texte du prix à la page paywall

Répétez les étapes de l’Étape 2.1 pour le texte du prix comme indiqué ci-dessous :

  1. Double-cliquez sur le texte du prix dans votre page paywall. Dans la fenêtre Set from Variable, recherchez la variable getPaywallProductResult et sélectionnez-la.
ff-price.webp
  1. Remplissez les champs comme suit :
  • Available Options : Data Structured Field
  • Select Field : value
  • Available Options : Item at Index
  • List Index Options : First
  • Available Options : Data Structured Field
  • Select Field : price
  • Default Variable Value : null
  • UI Builder Display Value : Anything, in the example, it’s product.price
  1. Cliquez sur le bouton Confirm pour enregistrer les modifications.

Ajouter le prix en devise locale à la page paywall

  1. Double-cliquez sur le prix de votre page paywall. Dans la fenêtre Set from Variable, recherchez la variable getPaywallProductResult et sélectionnez-la.

  2. Remplissez les champs comme suit :

  • Available Options : Data Structured Field
  • Select Field : value
  • Available Options : Item at Index
  • List Index Options : First
  • Available Options : Data Structured Field
  • Select Field : price
  • Available Options : Data Structured Field
  • Select Field : amount
  • Available Options : Decimal
  • Decimal Type : Automatic
  • Default Variable Value : null
  • UI Builder Display Value : Anything, dans l’exemple, c’est price.amount
  1. Cliquez sur Confirm pour enregistrer les modifications.

Et voilà ! Maintenant, quand vous lancez votre application, elle affiche les données produit depuis le paywall Adapty directement sur votre page de paywall ! C’est le moment de laisser vos utilisateurs acheter ce produit.