Adım 1. Paywall verilerini göstermek için flow oluşturma

FlutterFlow eklentisini kullanırken, Adapty Paywall Builder’da oluşturulan paywallları kullanamazsınız. FlutterFlow’da kendi paywall sayfanızı uygulamanız ve bunu Adapty’ye bağlamanız gerekir.

Adapty kütüphanesini FlutterFlow projenize bağımlılık olarak ekledikten sonra, sıra Adapty paywall ve ürün verilerini alan ve FlutterFlow’da tasarladığınız paywall üzerinde gösteren flow’u oluşturmaya geldi.

Önce Adapty’den paywall verisini almamız gerekiyor. Önce Adapty paywall’unu, ardından bu paywall’a bağlı ürünleri isteyeceğiz ve son olarak verinin başarıyla alınıp alınmadığını kontrol edeceğiz. Başarılıysa ürün başlığını ve fiyatını paywall sayfasında göstereceğiz; değilse bir hata mesajı göstereceğiz.

Devam etmeden önce aşağıdakileri yaptığınızdan emin olun:

  1. Adapty Kontrol Paneli’nde en az bir paywall oluşturduğunuzu ve buna en az bir ürün eklediğinizi doğrulayın.
  2. Adapty Kontrol Paneli’nde en az bir placement oluşturduğunuzu ve paywall’ınızı buna eklediğinizi doğrulayın.

Haydi başlayalım!

Adım 1.1. Adapty paywall’ını isteyin

Daha önce belirtildiği gibi, FlutterFlow paywall’ınızda veri görüntülemek için önce Adapty’den veri almamız gerekiyor. İlk adım, Adapty paywall’ının kendisini almaktır. Nasıl yapılacağı aşağıda açıklanmaktadır:

  1. Paywall ekranınızı açın ve sağ panelde Actions bölümüne geçin. Ardından Action Flow Editor’ı açın.
ff_action_flow.webp
  1. Select Action Trigger penceresinde On Page Load seçeneğini seçin.
ff_action_trigger.webp
  1. Add Action seçeneğine tıklayın. Ardından getPaywall özel eylemini arayın ve seçin.
ff_getpaywall.webp
  1. Set Actions Arguments bölümünde, paywall’ı içeren Adapty Kontrol Paneli’nde oluşturduğunuz placement’ın gerçek kimliğini girin. Bu örnekte monthly olarak belirtilmiştir. Kendi gerçek placement kimliğinizi kullandığınızdan emin olun!
ff_placementid.webp
  1. Adapty kontrol panelinde paywallınızı yerelleştirdiyseniz, locale argümanını da ayarlayabilirsiniz.

  2. Action Output Variable Name alanında yeni bir değişken oluşturun ve adını getPaywallResult olarak belirleyin. Bir sonraki adımda Adapty paywall’una başvurmak ve ürünlerini talep etmek için bunu kullanacağız.

ff_getpaywallresult.webp

Adım 1.2. Adapty paywall ürünlerini isteyin

Harika! Adapty paywallını aldık. Şimdi bu paywalla ilişkili ürünleri alalım:

  1. Oluşturulan eylemin altındaki + simgesine tıklayın ve Add Action’ı seçin. Bu eylem Adapty paywall ürünlerini alacak. Bunun için getPaywallProducts eylemini arayın ve seçin.

  2. Set Actions Arguments bölümünde, daha önce oluşturulan getPaywallResult değişkenini seçin.

ff_getpaywallproduct.webp
  1. Diğer alanları aşağıdaki gibi doldurun:
  • Available Options: Data Structured Field
  • Select Field: value
  • Available Options: No further changes
ff_getpaywallresult2.webp
  1. Confirm’e tıklayın.
  2. Action Output Variable Name alanında yeni bir değişken oluşturun ve getPaywallProductsResult olarak adlandırın. Bunu, FlutterFlow’da tasarladığınız paywallı Adapty paywall verileriyle eşleştirmek için kullanacağız.
ff_getpaywallproductsresult.webp

Adım 1.3. Paywallın başarıyla yüklenip yüklenmediğini kontrol edin

Devam etmeden önce Adapty paywallının başarıyla alındığını doğrulayalım. Alındıysa paywallı ürün verileriyle güncelleyebiliriz. Alınmadıysa hatayı ele alacağız. Kontrolü şu şekilde ekleyebilirsiniz:

  1. + simgesine tıklayın ve Add Conditional’a tıklayın.
ff-add-conditional.webp
  1. Action Output bölümünde, daha önce oluşturulan eylem çıktı değişkenini seçin (örneğimizde getPaywallResult).
ff-getpaywallresult.webp
  1. Adapty paywallının alındığını doğrulamak için bir değere sahip bir alanın varlığını kontrol edin. Alanları aşağıdaki gibi doldurun:
  • Available Options: Has Field
  • Field (AdaptyGetPaywallResult): value
  1. Koşulu sonlandırmak için Confirm’e tıklayın.

Adım 1.4. Paywall görüntülemesini kaydedin

Adapty analitiğinin paywall görüntülemesini takip etmesini sağlamak için bu olayı kaydetmemiz gerekiyor. Bu adım olmadan görüntüleme analitikte sayılmayacaktır. İşte nasıl yapılacağı:

  1. TRUE etiketi altındaki + simgesine tıklayın ve Add Action’a tıklayın.
  2. Select Action alanında logShowPaywall eylemini arayın ve seçin.
ff-logshowpaywall.webp
  1. Set Action Arguments alanında Value’ya tıklayın ve oluşturduğumuz getPaywallResult değişkenini seçin. Bu değişken paywall verilerini içerir.
  2. Alanları aşağıdaki gibi doldurun:
  • Available Options: Data Structured Field
  • Select Field: value
  1. Confirm’e tıklayın.
ff-lohsgowpaywallresult.webp

Adım 1.5. Paywall alınamazsa hata gösterin

Adapty paywallı alınamazsa hatayı ele almanız gerekir. Bu örnekte sadece bir uyarı mesajı görüntüleyeceğiz.

  1. FALSE etiketine bir Informational Dialog eylemi ekleyin.

  2. Title alanına, iletişim kutusu başlığı olarak görmek istediğiniz metni ekleyin. Bu örnekte Error.

  3. Message kutusunda Value’ya tıklayın.

  4. Alanları aşağıdaki gibi doldurun:

  • Set Variable: Oluşturduğumuz getPaywallProductResult değişkeni
  • Available Options: Data Structure Field
  • Select Field: error
  • Available Options: Data Structure Field
  • Select Field: errorMessage
ff-error.webp
  1. Confirm’e tıklayın.
  2. FALSE akışına bir Terminate action ekleyin.
ff-terminate.webp
  1. Sağ üst köşedeki Close’a tıklayın.

Tebrikler! Ürün verilerini başarıyla aldınız. Şimdi bunu FlutterFlow’da tasarladığınız paywalla eşleştirelim.