Part 2: Display and process Product purchases on the Store

Tram Ho

1. Set up the Product list on the Store:

In this series of articles I will for example a Consumable item named Test Diamond for both Android and Ios stores

1. Google Play Store :

Go to Google Play Store -> Selected App -> Store Presence -> In-app Products -> Managed products.

Then, click “Create managed product” , then fill in the basic information as shown below:

Click Saved ,

2. Apple Store :

First, go to the App Store Connect page -> Selected App -> Select the Features Tab -> In-App Purchases as shown below

Then, select Create Consumable Product , then fill in the basic information as shown below:

(Note: “Product ID” you create at 2 stores must be identical)

2. Demo of In App Purchase Flutter:

The set up for each of the above platforms is very complicated, but you must make sure to complete the steps above to think of the Flutter code. If you have finished the set up, congratulations to you guys starting coding in Flutter thui ✌️

2.1 Get a list of current and purchased Products on the Store:

Once the App is initialized, you must perform the following steps:

  1. Check Connect to Store.
  2. Get the current Product list.
  3. Get the list of Products purchased.
  4. In case your listing has a Consumable product, you should check under your backend whether the User has purchased that product.

2.2 Handle New Purchases:

  1. Allow the User to make a Product purchase.
  2. Create 1 Stream to listen to purchases.

2.3 Build UI in Flutter:

In the example interface that I have code when running up, it will look like the image below, please check the settings if you cannot fetch the product list on the Store.

Android

Proceed to order only !!!

When a user purchases a product, I call func buyProduct () to handle the purchase, because within this article I demo the Consumable product, so I only handle this case.

Enter the password and pay only !!!

IOS

Android

Tutorial here is the end. If you have any questions or difficulties, comment below let me know !!!

Share the news now

Source : Viblo