Kotlin Multiplatform SDKでFlowとPaywall Builderを使ってアプリ内課金を有効にする
このガイドでは、Adapty Kotlin Multiplatform SDK v4(ベータ版)の API を使用しています。v3 をお使いの場合は、対応するメソッド名について移行ガイドを参照してください。
アプリ内課金を有効にするには、3 つの重要な概念を理解する必要があります:
- プロダクト – ユーザーが購入できるもの(サブスクリプション、消耗型アイテム、永続アクセス)
- フロー – ノーコードのフロー&ペイウォールビルダーで作成した、プロダクトをユーザーに提示する画面シーケンス。SDKは
getFlowを通じてフローを取得します。自分のコードでUIを構築したい場合はペイウォールを使用してください — ペイウォールを手動で実装するを参照。 - プレースメント – アプリ内でフローを表示する場所とタイミング(
main、onboarding、settingsなど)。ダッシュボードでプレースメントにフローを紐付け、コード内でプレースメントIDを指定してリクエストします。これにより、A/B テストの実施や、ユーザーごとに異なるフローの表示が簡単に行えます。
Adapty では、アプリで購入を有効にする方法を3つ提供しています。アプリの要件に応じて、いずれかを選択してください。
| 実装方法 | 複雑さ | 使用する場面 |
|---|---|---|
| Adapty フロー & ペイウォールビルダー | ✅ 簡単 | ノーコードビルダーで購入可能な完全なフローを作成します。Adapty が自動でレンダリングし、複雑な購入フロー・レシート検証・サブスクリプション管理をすべて裏側で処理します。 |
| 手動で作成するペイウォール | 🟡 中程度 | アプリのコードでペイウォール UI を自分で実装しますが、プロダクト提供の柔軟性を維持するために Adapty からフローオブジェクトを取得します。ガイドを参照してください。 |
| オブザーバーモード | 🔴 難しい | すでに独自の購入処理インフラを持っており、それを引き続き使用したい場合に選択します。なお、オブザーバーモードには Adapty における制限事項があります。記事を参照してください。 |
以下の手順は、Adapty Flow & Paywall Builderで作成したフローの実装方法を示しています。
ペイウォールのUIを自分でビルドする場合は、ペイウォールを手動で実装するを参照してください。
Adapty Flow & Paywall Builderで作成したフローをアプリに表示するには、アプリのコードで以下の操作を行うだけです。
- フローを取得する: Adaptyからフローを取得します。
- 表示する(購入処理はAdaptyが担当): アプリ内でビューを表示します。
- ボタンのアクションを処理する: ユーザーの操作に対するアプリの応答を紐付けます。たとえば、ユーザーがボタンをタップしたときにリンクを開いたり、フローを閉じたりします。
始める前に
始める前に、以下の手順を完了してください。
- Adapty ダッシュボードでアプリを App Store および/または Google Play に接続する。
- Adapty でプロダクトを作成する。
- フローを作成し、プロダクトを追加する。
- プレースメントを作成し、フローを追加する。
- アプリのコードに Adapty SDK をインストールして有効化する。
これらの手順を最も素早く完了するには、クイックスタートガイドに従うか、Developer CLIを使用してフローとプレースメントを作成してください。
1. フローを取得する
フローは、ダッシュボードで設定されたプレースメントに関連付けられています。プレースメントを使うと、オーディエンスごとに異なるフローを表示したり、A/B テストを実行したりできます。
Adapty のフロー & ペイウォールビルダーで作成したフローを取得するには、次の手順を実行します。
-
getFlowメソッドを使用して、プレースメント ID でflowオブジェクトを取得します。 -
createFlowViewメソッドを使用してフロービューを作成します。このビューには、フローを表示するために必要な UI 要素とスタイリングが含まれています。フローにビューが設定されていない場合、createFlowViewはエラーを返します。onErrorでエラーを処理してください。
ビューを取得するには、フローを公開してください。未公開の編集がある場合、フローのステータスは Dirty となり、そのプレースメントは最後に公開されたバージョンを引き続き配信します。
Adapty.getFlow("YOUR_PLACEMENT_ID")
.onSuccess { flow ->
AdaptyUI.createFlowView(flow)
.onSuccess { view ->
view.present()
}
.onError { error ->
// the flow has no view configured, or view creation failed
}
}
.onError { error ->
// handle the error
}
2. フローを表示する
フローを取得したら、数行のコードを追加するだけで表示できます。
デバイス画面にビジュアルフローを表示するには、まずビューを作成する必要があります。そのために、AdaptyUI.createFlowView() メソッドを呼び出します:
AdaptyUI.createFlowView(flow)
.onSuccess { view ->
view.present()
}
.onError { error ->
// handle the error
}
ビューが正常に作成されたら、デバイスの画面に表示できます。各ビューは一度しか使用できません。dismiss() を呼び出した後、再度フローを表示するには createFlowView を呼び出してください。
フローの表示方法の詳細については、ガイドをご覧ください。
3. ボタンアクションを処理する
ユーザーがフロー内のボタンをクリックすると、Kotlin Multiplatform SDK は購入、復元、フローのクローズ、リンクの開封を自動的に処理します。
ただし、カスタムまたは事前定義された ID を持つボタンは、コードでアクションを処理する必要があります。また、デフォルトの動作を上書きしたい場合もあります。
例えば、以下はクローズボタンのデフォルト動作です。コードに追加する必要はありませんが、必要な場合にどのように実装するかを確認できます。
デフォルトでは、購入が完了してもフローは開いたままになります。購入完了後にフローを閉じたい場合は、flowViewDidFinishPurchase コールバック内でビューを閉じてください。
AdaptyUI.setFlowsEventsObserver(object : AdaptyUIFlowsEventsObserver {
override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
when (action) {
is AdaptyUIAction.CloseAction -> mainUiScope.launch { view.dismiss() }
else -> Unit
}
}
override fun flowViewDidFinishPurchase(
view: AdaptyUIFlowView,
product: AdaptyPaywallProduct,
purchaseResult: AdaptyPurchaseResult
) {
if (purchaseResult !is AdaptyPurchaseResult.UserCanceled) {
mainUiScope.launch { view.dismiss() }
}
}
})
次のステップ
ペイウォールをアプリに表示する準備ができました。App StoreサンドボックスまたはGoogle Play Storeでテスト購入を行い、ペイウォールからテスト購入が完了できることを確認してください。
次に、ユーザーのアクセスレベルを確認して、適切なユーザーにペイウォールを表示したり、有料機能へのアクセスを付与したりするようにしてください。
完全な例
以下は、これらのステップをアプリにまとめて統合する方法です。
// Set up the observer for handling flow events
AdaptyUI.setFlowsEventsObserver(object : AdaptyUIFlowsEventsObserver {
override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
when (action) {
is AdaptyUIAction.CloseAction -> mainUiScope.launch { view.dismiss() }
else -> Unit
}
}
override fun flowViewDidFinishPurchase(
view: AdaptyUIFlowView,
product: AdaptyPaywallProduct,
purchaseResult: AdaptyPurchaseResult
) {
if (purchaseResult !is AdaptyPurchaseResult.UserCanceled) {
mainUiScope.launch { view.dismiss() }
}
}
})
// Get and display the flow
Adapty.getFlow("YOUR_PLACEMENT_ID")
.onSuccess { flow ->
AdaptyUI.createFlowView(flow)
.onSuccess { view ->
view.present()
}
.onError { error ->
// the flow has no view configured — use custom logic
}
}
.onError { error ->
// handle the error
}