RevenueCat UI SDKを使用してアプリ内にRevenueCatのペイウォール(有料機能へのアクセス制限画面)を表示します。 次のような場合に使用: ユーザーがペイウォールの追加をリクエストしたとき、RevenueCatのペイウォール表示、PaywallViewの提示、RevenueCat UIの統合、ペイウォールでプレミアム画面を保護、PaywallActivityの起動、presentPaywall または presentPaywallIfNeeded の呼び出し、ダッシュボード設定済みのペイウォールUIをiOS、Android、Kotlin Multiplatform、Flutter、またはReact Nativeで表示する場合。
Display a RevenueCat paywall inside an app using the RevenueCatUI SDK. Use when the user asks to add a paywall, show a RevenueCat paywall, present PaywallView, integrate RevenueCatUI, gate a premium screen with a paywall, launch PaywallActivity, call presentPaywall or presentPaywallIfNeeded, or show the dashboard configured paywall UI on iOS, Android, Kotlin Multiplatform, Flutter, or React Native.
次のような場合に使用: ユーザーが RevenueCat ダッシュボードで構築・設定したペイウォールを、 ネイティブの RevenueCatUI コンポーネントを使って表示したい場合。
このスキルは、カスタムペイウォールをゼロから構築するケースは対象外です。
その場合は、revenuecat-purchase-flow(利用可能な場合)および
Purchases.getOfferings(…) を直接使用してください。
前提条件: integrate-revenuecat がすでに実行済みであること。
Purchases.configure(…) が成功していなければ、ペイウォールはロードできません。
作業ディレクトリを確認し、上から順に最初に一致したものを採用してください:
React Native: package.json に react-native-purchases エントリがある、
または react-native が依存関係に含まれている。
ペイウォールパッケージは react-native-purchases-ui。
platforms/react-native.md を参照。
expo も依存関係にある場合は、Expo プロジェクトとして記録してください。
Flutter: プロジェクトルートに pubspec.yaml が存在する。
ペイウォールパッケージは purchases_ui_flutter。
platforms/flutter.md を参照。
Kotlin Multiplatform: build.gradle.kts に kotlin { … } マルチプラットフォームの
ソースセットブロックが含まれている、または com.revenuecat.purchases:purchases-kmp*
に依存している。ペイウォールモジュールは purchases-kmp-ui。
platforms/kmp.md を参照。
Android(ネイティブ): build.gradle(.kts) に com.android.application が
適用されている(かつ KMP ではない)。
ペイウォール依存関係は com.revenuecat.purchases:purchases-ui。
platforms/android.md を参照。
iOS(ネイティブ): プロジェクトルートに Package.swift、*.xcodeproj、
*.xcworkspace、または Podfile が存在する。
ペイウォール製品は RevenueCatUI。
platforms/ios.md を参照。
複数一致する場合(例: Flutter プロジェクト内に ios/ フォルダがある場合)は、
ビルドを管理している最も外側のプロジェクトを選択してください。
それでも判断が難しい場合は、どのプラットフォームを設定したいかユーザーに確認してください。
ペイウォールを表示するには、RevenueCat ダッシュボードでペイウォールが紐付けられた
Offering が必要です。
SDK は getOfferings() を通じて Offering を取得します。
ペイウォールが設定されていない Offering しか存在しない場合、RevenueCatUI は
デフォルトのフォールバックレイアウトに切り替わります。
これは本番環境では望ましくありません。
Offering と entitlement の違い。
ユーザーは Offering 内のパッケージを通じて商品を購入します。
アクセス権は entitlement(通常 "premium" または "pro")によって付与されます。
プレミアム機能のアクセス制御は、Offering ではなく entitlement に基づいて行ってください。
3 つの表示パターン:
購入フローは RevenueCatUI が管理します。
RevenueCatUI ペイウォールと並行して Purchases.purchase(…) を手動で呼び出さないでください。
ペイウォールが内部で呼び出します。
アプリ側のコードでは、dismissコールバックまたは購入完了コールバックを監視して対応してください。
閉じるボタンはほとんどのプラットフォームでオプトイン方式です。
ペイウォールをモーダル表示する際にユーザーが閉じられるようにするには、
displayCloseButton = true(iOS / Flutter / RN)または
setShouldDisplayDismissButton(true)(Android / KMP)を渡してください。
グラバー付きシートの後ろに表示する場合や、ナビゲーションコントローラーで
ラップする場合は不要です。
完全にカスタムな UI が必要な場合は、このスキルを使用しないでください。
Purchases.getOfferings() を呼び出して独自のコンポーネントをレンダリングしてください。
RevenueCatUI はダッシュボードのテンプレートを使ったペイウォール専用です。
検出結果に対応するプラットフォームファイルを参照してください:
platforms/ios.mdplatforms/android.mdplatforms/kmp.mdplatforms/flutter.mdplatforms/react-native.md各プラットフォームファイルは自己完結型です: インストールコマンド、ペイウォール表示の正確なスニペット、 および監視すべきコールバックの形式が含まれています。
以下がすべて満たされるまで、統合完了を宣言しないでください:
PURCHASED 結果で解決されること)。テンプレートではなくデフォルトのフォールバックレイアウトが表示される場合、 該当の Offering にダッシュボードでペイウォールが紐付けられていません。 ダッシュボードで修正してから再試行してください。
Use this skill when the user wants to show a paywall that is built and configured in the RevenueCat dashboard, using the native RevenueCatUI components. This skill does not cover building a custom paywall from scratch. For that, use revenuecat-purchase-flow (when available) and Purchases.getOfferings(…) directly.
Prerequisite: integrate-revenuecat has already run. Purchases.configure(…) must succeed before a paywall can load.
Inspect the working directory and pick the first match, from top to bottom:
package.json has a react-native-purchases entry, or react-native as a dependency. react-native-purchases-ui is the paywall package. Read platforms/react-native.md. If expo is also a dependency, note it as an Expo project.pubspec.yaml exists at the project root. The paywall package is purchases_ui_flutter. Read platforms/flutter.md.build.gradle.kts contains a kotlin { … } multiplatform source sets block, or depends on com.revenuecat.purchases:purchases-kmp*. The paywall module is purchases-kmp-ui. Read platforms/kmp.md.build.gradle(.kts) applies com.android.application (and is not KMP). The paywall dependency is com.revenuecat.purchases:purchases-ui. Read platforms/android.md.Package.swift, *.xcodeproj, *.xcworkspace, or Podfile at the project root. The paywall product is RevenueCatUI. Read platforms/ios.md.If several match (e.g. an ios/ folder inside a Flutter project), pick the outermost project, the one that owns the build. If still ambiguous, ask the user which platform they want to configure.
getOfferings(). If no offering has a paywall configured, RevenueCatUI falls back to a default paywall layout, which is not what you want in production."premium" or "pro"). Gate premium features on the entitlement, not on the offering.Purchases.purchase(…) manually alongside a RevenueCatUI paywall. The paywall calls it internally. Listen for the dismiss or purchase completed callback to react in app code.displayCloseButton = true (iOS / Flutter / RN) or setShouldDisplayDismissButton(true) (Android / KMP) when the paywall is presented modally and the user needs a way out. Skip it when presenting behind a sheet with its own grabber, or when wrapping the paywall in a navigation controller.Purchases.getOfferings() and render your own components. RevenueCatUI is only for dashboard templated paywalls.Read the platform file that matches detection:
platforms/ios.mdplatforms/android.mdplatforms/kmp.mdplatforms/flutter.mdplatforms/react-native.mdEach platform file is self contained: install command, exact snippet to present the paywall, and the callback shape you listen to.
Do not claim the integration is complete until:
PURCHASED result).If the paywall shows the default fallback layout instead of your template, the offering does not have a paywall attached in the dashboard. Fix this in the dashboard, then retry.
原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。