SuperAPI AI 工具集

revenuecat-paywall

编程与开发

查看项目

更新于 10-15 11:47

技能介绍

revenuecat-paywall 是一个用于在应用内展示 RevenueCat 付费墙的技能,基于 RevenueCatUI SDK 实现。当用户希望在应用中添加付费墙、展示 RevenueCat 付费墙或呈现 PaywallView 时,可使用此技能。

用途

该技能用于展示在 RevenueCat 仪表盘中构建和配置的付费墙,使用原生 RevenueCatUI 组件。它不涵盖从零构建自定义付费墙;如需自定义付费墙,应使用 revenuecat-purchase-flow 和 Purchases.getOfferings(…) 直接实现。如果用户尚未在两者之间做出选择,可参考 integrate-revenuecat 第 5c 节。若要创建、编辑、评估或审计仪表盘付费墙,应使用 revenuecat-paywall-design。

前提条件

integrate-revenuecat 已运行。在付费墙加载之前,Purchases.configure(…) 必须成功。

  1. 检测平台

检查工作目录,从上到下选择第一个匹配项:

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/ 文件夹),选择最外层的项目,即拥有构建的项目。如果仍然不明确,询问用户要配置哪个平台。

  1. 共享概念(所有平台)

付费墙需要在 RevenueCat 仪表盘中附加一个 Offering。SDK 通过 getOfferings() 拉取 offerings。如果没有 offering 配置了付费墙,RevenueCatUI 会回退到默认付费墙布局,这在生产环境中不是期望的结果。

Offering 与 entitlement。用户通过 offering 中的 package 购买产品。访问权限通过 entitlement(通常为 "premium" 或 "pro")授予。应基于 entitlement 而非 offering 来限制高级功能。

三种展示模式:

(a) 首次启动模态框,针对没有 entitlement 的用户,通常由 "present if needed" 辅助函数驱动,该函数检查 entitlement 并仅在缺失时显示付费墙。

(b) 受限高级屏幕。用户点击高级功能,付费墙在屏幕加载前打开。

(c) 在 CTA 点击时条件展示,例如设置中的 "Upgrade" 按钮。

RevenueCatUI 拥有购买流程。不要在 RevenueCatUI 付费墙旁边手动调用 Purchases.purchase(…)。付费墙内部会调用它。监听 dismiss 或 purchase completed 回调以在应用代码中做出反应。

关闭按钮在大多数平台上是可选的。当付费墙以模态方式呈现且用户需要退出方式时,传递 displayCloseButton = true(iOS / Flutter / RN)或 setShouldDisplayDismissButton(true)(Android / KMP)。当在带有自己 grabber 的 sheet 后面呈现,或将付费墙包装在导航控制器中时,跳过它。

如果用户选择了完全自定义 UI,不要使用此技能。调用 Purchases.getOfferings() 并渲染自己的组件。RevenueCatUI 仅用于仪表盘模板化付费墙。

  1. 实现

阅读与检测匹配的平台文件:

platforms/ios.md

platforms/android.md

platforms/kmp.md

platforms/flutter.md

platforms/react-native.md

每个平台文件是自包含的:安装命令、呈现付费墙的确切代码片段,以及你监听的回调形状。

  1. 验证

在以下条件满足之前,不要声称集成完成:

项目在目标平台上构建成功。

应用启动,呈现付费墙的代码路径运行,付费墙 UI 使用仪表盘中配置的模板渲染(而不是默认回退布局)。

点击 package 并完成沙盒购买后,付费墙关闭并触发 purchase completed 回调(或者,对于命令式 API,以 PURCHASED 结果解析)。

关闭付费墙而不购买会触发 dismiss / cancelled 回调。

如果付费墙显示默认回退布局而不是你的模板,则 offering 在仪表盘中未附加付费墙。在仪表盘中修复此问题,然后重试。