Flutter'da RevenueCat ile Uygulama İçi Satın Alma İşlemleri

Bugün sizlere, uygulama içi satın alımlarınızı (IAP) Flutter uygulamanıza nasıl entegre edebileceğinizi anlatmaya çalışacağım. Bu yazıyı hazırlamamdaki en büyük sebeplerden birisi, bu konuda Türkçe kaynağın yok denecek kadar az olması ve çalıştığım şirkette RevenueCat servisini entegre ederken edindiğim deneyimleri sizlere aktarmak. Umarım keyifli bir okuma olur. Hazırsanız başlayalım:



IAP Nedir


Uygulama içi satın alımlar (IAP), kullanıcılarınıza uygulama içerisinden satın aldırabileceğiniz abonelikler, yeni özellikler, tek seferlik ürünler gibi çeşitleri içerikler kapsamında kullanılabilir.


IOS ve Android'de IAP Ayarları


Uygulamanızda uygulama içi satın alımları kullanabilmeniz için öncelikle bunları kullanacağınız işletim sistemine göre bazı ayarlar yapmanız gerekiyor. Bu cidden ayrı bir yazı konusu olabilir. Bu yazının uzamaması adına o süreçleri Flutter Community tarafından hazırlanmış güzel bir makaleden takip edebilirsiniz. Devam etmeden önce bu makaledeki adımları tamamladığınızdan emin olun.



Flutter ve RevenueCat


Artık eğlenceli bölüme başlayabiliriz. Öncelikle IAP için tek çözüm RevenueCat değil. RevenueCat'i tercih etmemin sebebi, aylık gelirinizin 10.000 $ altında olduğu sürece ücretsiz olmasıdır. Bunun çoğu geliştiriciye yetecek durumda olduğunu düşünüyorum. Eğer aylık gelirinizin bu miktarın üzerindeyse de çok küçük bir miktar istiyorlar. Bu gerçekten çok önemli. Bunun dışında çok iyi bir dökümantasyonun olması. Her adımı güzel bir şekilde açıklıyorlar. Örnek senaryolarda Flutter kodlarının olması da başka bir artısı. Son olarak güzel bir panel sayesinde satım alım geçmişleriniz, aylık geliriniz gibi verilerinizi detaylı bir şekilde inceleyebilmeniz.


Artık gerçekten başlayabiliriz :)



Öncelikle RevenueCat'in uygulamanıza bağlanabilmesi için erişim izni vermeniz gerekir. Play Console'da Ayarlar -> API Erişimi adımını izleyerek hizmet hesabı oluşturacağız. Daha önce bir hesap oluşturmadıysanız şöyle gözükmesi gerekir:



Burada "Hizmet Hesabı Oluştur" dediğinizde karşınıza bir diyalog çıkacak ve GCP Hizmet hesaplarından yeni hizmet hesabı oluşturmanızı isteyecektir.


Burada hizmet hesaplarınızın listesini göreceksiniz. Muhtemelen burası da boş olacaktır.



Hizmet Hesabı Oluştur'a tıklayarak yeni bir hesap oluşturmanız gerekiyor. İlk adımda hizmet hesabının adını gireceksiniz. Ben burada revenuecat ismini verdim. İsterseniz açıklama kısmını da girebilirsiniz. İkinci adıma geçtiğinizde ise bu hesaba "Sahip" rolünü vermeniz gerekmektedir.



3. Kısıma geçtiğinizde "Bitti" diyerek bu adımı tamamlayabilirsiniz. Yeni hesabınızın artık listede görünüyor olması gerekiyor :



Ardından anahtar oluşturmak için "İşlemler" kısmındaki üç noktaya tıklayarak "Anahtar Oluştur" u seçin. JSON formatında yeni bir anahtar oluşturmanız gerekiyor :



"Oluştur" dediğinizde JSON formatında bir dosya bilgisayarınıza inecektir. Bu dosyayı daha sonra kullanacağız. Nereye indirdiğinizi unutmayın. Tekrardan Play Console'a dönüp ekrandaki diyalogu kapatabiliriz. Artık hesabınızınızı burada görebilirsiniz.



Bu hesaba erişim vererek devam ediyoruz. "Erişim Ver" butonuna tıklayın. Açılan sayfada Rol kısmını "Finans" olarak seçtiğinizden emin olun "Uygulama Bilgilerini Görüntüle" ve "Finansal Bilgileri Görüntüle" kısımlarının seçili olmasına dikkat edin. Son olarak "Kullanıcı Ekle" diyerek Kullanıcılar ve "İzinler" sayfasına geçin. Burada eklediğiniz kullanıcıyı göreceksiniz:



Artık bu kısımla işimiz bitti :)




RevenueCat Hesabı Oluşturma


Sırada RevenueCat hesabı oluşturup ürünlerimizi eklemek var. Bunun için öncelikle RevenueCat'e ücretsiz bir şekilde üye oluyoruz.



Kayıt olduktan sonra sizi uygulama ekleme ekranı karşılayacak. Bu ekranda uygulamamızın bilgilerini girmemiz gerekiyor.

App-Specific Shared Secret'ı şuradaki adımları izleyerek hızlıca edinebilirsiniz. Daha önce indirdiğimiz Google service account json dosyamızı herhangi bir editörde açtıktan sonra kopyalayıp ilgili yere yapıştırabilirsiniz.



Add diyerek uygulamamızı RevenueCat'e ekleme işlemini tamamlıyoruz.


Devam etmeden önce RevenueCat ile ilgili bazı şeyleri anlamak gerekiyor. Bunlar Entitlements (Haklar) , Products (Ürünler) ve Offerings (Teklifler).


  • Entitlements : Yetkiler, kullanıcınızın uygulamanızda sahip olabileceği şeylerdir. Örneğin Premium (tüm özelliklere erişim), Pro (bazı özelliklere erişim) gibi.

  • Products : Ürünler aboneliğin kendisini temsil eder. Her platform için (Android, iOS) ürününüzün olması gerekir.

  • Offerings : Teklifler, kullanıcıya ödeme ekranınızda hangi ürünlerin göstereceğini barındırır.


Öncelikle yeni bir yetki oluşturarak devam ediyoruz. Bunun için "New" butonuna tıklıyoruz.



Bir tanımlayıcı ve açıklama belirleyerek yeni bir "Yetki" oluşturma işlemimizi tamamlıyoruz.



Şimdi bir "Teklif" oluşturmamız gerekiyor. Offerings kısmından "New" diyerek bu işlemi gerçekleştirebiliriz.



Ekledikten sonra "0 Packages" e tıklayalım.

Ardından tekrar "New" butonuna tıklayarak yeni bir aylık paket oluşturuyoruz.



Default adlı teklifimize paketimizi eklemiş olduk.



Son olarak Products sekmesine geçelim.



Burada, oluşturduğumuz her paket için 1 Android 1 iOS ürünü eklememiz gerekiyor. Yeni ürün eklerken vereceğimiz tanımlayıcılar, Play Store ve App Store Connect üzerinden oluşturacağımız abonelikler ile aynı olmak zorundadır. Benim için bunlar, Apple için apple_monthly, Google için google_monthly.


NOT: Play Console'da Abonelik eklemek için en az alfa kanalına bir sürüm yüklemiş olmanız gerekiyor. Bu sürümü yüklerken BILLING iznini verdiğinizi unutmayın.




Her abonelik için bir ürün oluşturalım.



Şu an iki ürünün de gözüküyor olması gerekiyor.



Sıradaki işlemimiz ise bu ürünlerimizi yetkiler ve haklar ile ilişkilendirmek. Bunun için Entitlements sekmesine geçip 0 products'a tıklıyoruz.



Ardından Attach'a tıklıyoruz.



İki ürünümüzü de ekliyoruz.



İki ürünün de Associated Products altında gözükmesi gerekiyor.



Şimdi ise Offerings sekmesine geçiyoruz ve 1 package'e tıklıyoruz.



Burada daha önce oluşturduğumuz Monthly Subscription'ı görüyor olmamız gerekiyor. 0 products'a tıklayarak ürünlerimizi bağlamamız gerekiyor.



Ardından Attach'e tıklıyoruz.



Burada ürünlerimizi seçip ekleme işlemini tamamlıyoruz.



Artık ürünlerin teklif altında listelendiğini göreceksiniz.



Tebrikler! RevenueCat kurulumunu tamamlamış olduk.



Flutter Uygulamanıza Gerekli Kodu Ekleme


Sancılı süreci atlattığımıza göre artık kodumuzu ekleyebiliriz. Bu, sürecin en kolay kısmıdır.


iOS:

RevenueCat en az iOS 9 sürümünü destekliyor. Bu yüzden ios/Podfile üzerinde aşağıdaki satırın olduğundan emin olun.


platform :ios, '9.0'

Ardından, Xcode üzerinden projemize IAP Capability'i eklememiz gerekiyor. Buradan nasıl ekleyeceğinizi takip edebilirsiniz.


Flutter kodumuzda kullanacağımız RevenueCat'in paketine buradan ulaşabilirsiniz.


  purchases_flutter: ^1.4.3

pubspec.yaml dosyamıza ekledikten sonra paketimizi kuruyoruz.


  flutter pub get

Ardından projemizi çalıştıralım. Boş bir counter uygulaması bizi karşılayacak.



Yazının çok uzamaması adına tasarım ile çok uğraşmayacağım. Siz kendi uygulamanıza göre gerekli uyarlamaları yaparsınız. Bu uygulamada yapacağımız senaryo, kullanıcının hazırladığımız premium sayfaya geçebilmesi için Aylık Abonelik paketine sahip olması. Sahip değilse satın alma işlemi yaptıracağız. Öncelikle premium sayfasını basit bir şekilde kodlayalım.


premium.dart



Şimdi Home sayfamızı düzenleyelim.


home.dart



Sayfalarımız tamam. Home sayfasındaki "Go to premium page" butonuna tıkladığımızda eğer kullanıcının Premium yetkisi var ise premium sayfasına geçiş yapacak, yoksa bir uyarı verecek.


RevenueCat ile ilgili kodları kullanmadan önce yapmamız gereken ilk şey RevenueCat'i bize özel API Key ile başlatmak ve IAP bilgilerini almaktır.


RevenueCat'in ayarlar sekmesinden API Key'inizi alabilirsiniz.


Home sayfamızın initState'inde RevenueCat'i aldığımız API Key ile başlatıp, ilk bilgileri çekiyoruz. setDebugLogsEnabled ile IAP loglarını etkinleştirebiliriz.


PurchaserInfo purchaserInfo;
 @override
 void initState() {
  super.initState();
  initPlatformState();
 }

 Future<void> initPlatformState() async {
  await Purchases.setDebugLogsEnabled(true);
  await Purchases.setup("public_sdk_key");
  purchaserInfo = await Purchases.getPurchaserInfo();
 }
 

Uygulamayı çalıştırdığımızda Debug Console'da RevenueCat panelinden ayarladığımız "Hak" ve "Ürünler"i göreceğiz.



Süper gidiyoruz. Neredeyse bitti.


Sırada butona tıkladığımızda kullanıcının premium hakkına sahip olup olmadığını kontrol etmek var. Buna göre premium sayfasına yönlendireceğiz.


bool userIsPremium() {
  return purchaserInfo.entitlements.all["premium"] != null &&                                     purchaserInfo.entitlements.all["premium"].isActive;
}

Not: Buradaki premium RevenueCat panelinde Entitlements kısmında eklediğiniz hakkın tanımlayıcısıdır. Siz eklediğiniz veya kontrol etmek istediğiniz hakkın tanımlayıcısını girebilirsiniz.


Ardından butonumuzun onPressed özelliğine şu kodları ekliyoruz.


RaisedButton(
 onPressed: () async {
if (userIsPremium()) {
 Navigator.of(context).push(MaterialPageRoute(builder: (context) =>    PremiumScreen()));
} else {
   Scaffold.of(context).showSnackBar(
   SnackBar(content: Text("You aren't premium user")));
 }
   },
  child: Text('Go to premium page')),

Sırada FAB'a tıkladığımızda AlertDialog içerisinde ürünümüzün bilgilerini göstermek ve satın alma işlemini gerçekleştirmek var. Bunun için RevenueCat panelinden hazırladığımız mevcut teklifi çekmemiz gerekecek.


await Purchases.getOfferings();

Bu kod ile tekliflerimizi çekiyoruz. Biz panelden bir tane teklif eklediğimiz için şu an tek bir teklif gelecek. Bu teklifimizde de bir adet (Monthly) ürün var. Birden fazla ürün ekleyerek (6 Aylık / 1 Yıllık) seçenekleri arttırabilirsiniz.


Aşağıdaki method sayesinde güncel teklifiminin içerisindeki aylık ürününün bilgilerini ekranda gösteriyorum.


Future<void> showPaywall() async {
Offerings offerings = await Purchases.getOfferings();
if (offerings.current != null && offerings.current.monthly != null)   {
   final currentMonthlyProduct = offerings.current.monthly.product;
   showDialog(
          context: context,
          builder: (_) => AlertDialog(
                title: Text(currentMonthlyProduct.description),
                content: Row(
                  children: [Text(currentMonthlyProduct.priceString)],
                ),
                actions: [RaisedButton(onPressed: () {}, child:   Text('Buy'))],
));
  }
}

Ekran çıktımız ise şu şekilde :



Şimdi ise satın alma işlemini gerçekleştireceğiz. Aşağıdaki method ile bu işlemi gerçekleştirebiliriz.


 Future<void> makePurchases(Package package) async {
 try {
   purchaserInfo = await Purchases.purchasePackage(package);
 } on PlatformException catch (e) {
   var errorCode = PurchasesErrorHelper.getErrorCode(e);
   if (errorCode != PurchasesErrorCode.purchaseCancelledError) {
   Scaffold.of(context).showSnackBar(SnackBar(content: Text(e.message)));
      }
    }
  }

Ardıdan Buy butonumuzun onPressed özelliğinde bu metodu Monthly paketimiz ile çağıralım.


RaisedButton( onPressed: () async {
await makePurchases(offerings.current.monthly);},
child: Text('Buy'))

Ve tamam! Üyeliğimizi satın almış olduk. Mail adresimize üyelik ile ilgili bir mailin gelmiş olması gerekiyor.



İşlemlerimiz RevenueCat paneline de düşecektir.



Ardından, premium hakkına sahip olduğumuz için artık premium sayfamıza geçiş yapabiliyoruz.




Sonuç


Yazının bu noktasına kadar geldiyseniz, uygulamanıza IAP ekleme sürecinin en zor yanının Play Console ve Apple Connect ayarlamalarının olduğunu görmüşsünüzdür. Yazılacak kod en kolay kısmıdır. Eğer hatalar ile karşılaşırsanız RevenueCat dökümantasyonu bu konuda gerçekten açıklayıcı.


Umarım faydalı ve güzel bir yazı olmuştur. Tüm kodlara buradan ulaşabilirsiniz. Aklınıza takılan bir soru olursa bana Twitter ve Linkedin üzerinden ulaşabilirsiniz. Bir başka yazıda görüşmek üzere!



Github: https://github.com/bugragoksu/revenuecat_test


Kaynaklar


https://flutter.dev/docs

https://www.revenuecat.com/

https://docs.revenuecat.com/docs/getting-started

https://cloud.google.com/


#revenuecat #flutter #iap


0 yorum

Komünite

Platform

Mobiler.dev Anasayfa
  • Twitter
  • Instagram
  • development_düzenlendi_düzenlendi
  • Youtube
  • slack-icon-black_edited_edited_edited
  • Gri LinkedIn Simge
imageedit_2_9667998092.png
JetBrains Hakkında Detaylı Bilgi Alın

© 2020 by mobiler.dev

Kurumsal Yazar Hesapları

adesso.png
mobilerdevLogo.jpg
Yazarlık Başvurusu Hakkında Bilgi Alın, Başvuru Yapın.
Topluluk Yazarlarını Tanıyın