在 Android SDK 中以观察者模式呈现付费墙编辑工具创建的付费墙
如果您已使用付费墙编辑工具自定义了付费墙,则无需在移动应用代码中手动渲染它来向用户展示。此类付费墙同时包含应在付费墙中显示的内容以及显示方式。
本节仅适用于观察者模式。如果您不在观察者模式下工作,请参阅 Android - 呈现付费墙编辑工具创建的付费墙 主题。
开始呈现付费墙之前(点击展开)
- 设置 Adapty 与 Google Play 和 App Store 的初始集成。
- 安装并配置 Adapty SDK。确保将
observerMode参数设置为true。请参阅我们针对 Android 的框架专属说明。 - 在 Adapty 看板中创建产品。
- 在 Adapty 看板中配置付费墙、为其分配产品,并使用付费墙编辑工具对其进行自定义。
- 在 Adapty 看板中创建版位并为其分配付费墙。
- 在移动应用代码中获取付费墙编辑工具创建的付费墙及其配置。
- 实现
AdaptyUiObserverModeHandler。
onPurchaseInitiated 事件将通知您用户已发起购买。您可以在此回调中触发自定义的购买流程:
val observerModeHandler =
AdaptyUiObserverModeHandler { product, paywall, paywallView, onStartPurchase, onFinishPurchase ->
onStartPurchase()
yourBillingClient.makePurchase(
product,
onSuccess = { purchase ->
onFinishPurchase()
//handle success
},
onError = {
onFinishPurchase()
//handle error
},
onCancel = {
onFinishPurchase()
//handle cancel
}
)
} AdaptyUiObserverModeHandler observerModeHandler = (product, paywall, paywallView, onStartPurchase, onFinishPurchase) -> {
onStartPurchase.invoke();
yourBillingClient.makePurchase(
product,
purchase -> {
onFinishPurchase.invoke();
//handle success
},
error -> {
onFinishPurchase.invoke();
//handle error
},
() -> { //cancellation
onFinishPurchase.invoke();
//handle cancel
}
);
}; 要在观察者模式下处理恢复购买,请重写 getRestoreHandler()。默认情况下它返回 null,即使用 Adapty 内置的 Adapty.restorePurchases() 流程。如需提供您自己的恢复实现:
val observerModeHandler = object : AdaptyUiObserverModeHandler {
// onPurchaseInitiated implementation (see above)
override fun getRestoreHandler() =
AdaptyUiObserverModeHandler.RestoreHandler { onStartRestore, onFinishRestore ->
onStartRestore()
yourBillingClient.restorePurchases(
onSuccess = { restoredPurchases ->
onFinishRestore()
//handle successful restore
},
onError = {
onFinishRestore()
//handle error
}
)
}
} AdaptyUiObserverModeHandler observerModeHandler = new AdaptyUiObserverModeHandler() {
// onPurchaseInitiated implementation (see above)
@Override
public RestoreHandler getRestoreHandler() {
return (onStartRestore, onFinishRestore) -> {
onStartRestore.invoke();
yourBillingClient.restorePurchases(
restoredPurchases -> {
onFinishRestore.invoke();
//handle successful restore
},
error -> {
onFinishRestore.invoke();
//handle error
}
);
};
}
}; 请记得调用以下回调以通知 AdaptyUI 购买或恢复流程。这对于正确的付费墙行为(例如显示加载动画)是必要的:
| 回调 | 描述 |
|---|---|
| onStartPurchase() | 应调用此回调以通知 AdaptyUI 购买已开始。 |
| onFinishPurchase() | 应调用此回调以通知 AdaptyUI 购买已完成。 |
| onStartRestore() | 可选。可调用此回调以通知 AdaptyUI 恢复已开始。 |
| onFinishRestore() | 可选。可调用此回调以通知 AdaptyUI 恢复已完成。 |
- 要在设备屏幕上显示可视化付费墙,您必须先对其进行配置。
为此,请调用 AdaptyUI.getPaywallView() 方法或直接创建 AdaptyPaywallView:
val paywallView = AdaptyUI.getPaywallView(
activity,
viewConfiguration,
products,
eventListener,
personalizedOfferResolver,
tagResolver,
timerResolver,
observerModeHandler,
) val paywallView =
AdaptyPaywallView(activity) // or retrieve it from xml
...
with(paywallView) {
showPaywall(
viewConfiguration,
products,
eventListener,
personalizedOfferResolver,
tagResolver,
timerResolver,
observerModeHandler,
)
} AdaptyPaywallView paywallView = AdaptyUI.getPaywallView(
activity,
viewConfiguration,
products,
eventListener,
personalizedOfferResolver,
tagResolver,
timerResolver,
observerModeHandler
); AdaptyPaywallView paywallView =
new AdaptyPaywallView(activity); //add to the view hierarchy if needed, or you receive it from xml
...
paywallView.showPaywall(viewConfiguration, products, eventListener, personalizedOfferResolver, tagResolver, timerResolver, observerModeHandler); <com.adapty.ui.AdaptyPaywallView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" /> 视图成功创建后,您可以将其添加到视图层级并显示。
为此,请使用以下可组合函数:
AdaptyPaywallScreen(
viewConfiguration,
products,
eventListener,
personalizedOfferResolver,
tagResolver,
timerResolver,
) 请求参数:
| 参数 | 是否必填 | 描述 |
|---|---|---|
| Products | 可选 | 提供 AdaptyPaywallProduct 数组以优化产品在屏幕上的显示时机。如果传入 null,AdaptyUI 将自动获取所需产品。 |
| ViewConfiguration | 必填 | 提供包含付费墙视觉详情的 AdaptyViewConfiguration 对象。使用 Adapty.getViewConfiguration(paywall) 方法加载。详情请参阅获取付费墙的视觉配置主题。 |
| EventListener | 可选 | 提供 AdaptyUiEventListener 以观察付费墙事件。推荐继承 AdaptyUiDefaultEventListener 以便于使用。详情请参阅处理付费墙事件主题。 |
| PersonalizedOfferResolver | 可选 | 要标示个性化定价(了解更多),请实现 AdaptyUiPersonalizedOfferResolver 并传入您自己的逻辑,将 AdaptyPaywallProduct 映射为 true(如果该产品价格是个性化的),否则为 false。 |
| TagResolver | 可选 | 使用 AdaptyUiTagResolver 解析付费墙文本中的自定义标签。此解析器接受一个标签参数并将其解析为对应的字符串。详情请参阅付费墙编辑工具中的自定义标签主题。 |
| ObserverModeHandler | 观察者模式下必填 | 您在上一步中实现的 AdaptyUiObserverModeHandler。 |
| variationId | 必填 | 实验变体的字符串标识符。您可以通过 AdaptyPaywall 对象的 variationId 属性获取。 |
| transaction | 必填 | iOS,StoreKit1: iOS,StoreKit 2:Transaction 对象。 Android:购买的字符串标识符( |
开始呈现付费墙之前(点击展开)
- 设置 Adapty 与 Google Play 和 App Store 的初始集成。
- 安装并配置 Adapty SDK。确保将
observerMode参数设置为true。请参阅我们针对 Android、React Native、Flutter 和 Unity 的框架专属说明。 - 在 Adapty 看板中创建产品。
- 在 Adapty 看板中配置付费墙、为其分配产品,并使用付费墙编辑工具对其进行自定义。
- 在 Adapty 看板中创建版位并为其分配付费墙。
- 在移动应用代码中获取付费墙编辑工具创建的付费墙及其配置。
- 实现
AdaptyUiObserverModeHandler。AdaptyUiObserverModeHandler的回调(onPurchaseInitiated)将在用户发起购买时通知您。您可以在此回调中触发自定义的购买流程:
val observerModeHandler =
AdaptyUiObserverModeHandler { product, paywall, paywallView, onStartPurchase, onFinishPurchase ->
onStartPurchase()
yourBillingClient.makePurchase(
product,
onSuccess = { purchase ->
onFinishPurchase()
//handle success
},
onError = {
onFinishPurchase()
//handle error
},
onCancel = {
onFinishPurchase()
//handle cancel
}
)
} AdaptyUiObserverModeHandler observerModeHandler = (product, paywall, paywallView, onStartPurchase, onFinishPurchase) -> {
onStartPurchase.invoke();
yourBillingClient.makePurchase(
product,
purchase -> {
onFinishPurchase.invoke();
//handle success
},
error -> {
onFinishPurchase.invoke();
//handle error
},
() -> { //cancellation
onFinishPurchase.invoke();
//handle cancel
}
);
}; 同时,请记得向 AdaptyUI 调用这些回调。这对于正确的付费墙行为(例如显示加载动画等)是必要的:
| Kotlin 中的回调 | Java 中的回调 | 描述 |
|---|---|---|
| onStartPurchase() | onStartPurchase.invoke() | 应调用此回调以通知 AdaptyUI 购买已开始。 |
| onFinishPurchase() | onFinishPurchase.invoke() | 应调用此回调以通知 AdaptyUI 购买已成功完成、失败或已取消。 |
- 要显示可视化付费墙,您必须先初始化它。为此,请调用
AdaptyUI.getPaywallView()方法或直接创建AdaptyPaywallView:
val paywallView = AdaptyUI.getPaywallView(
activity,
viewConfiguration,
products,
AdaptyPaywallInsets.of(topInset, bottomInset),
eventListener,
personalizedOfferResolver,
tagResolver,
observerModeHandler,
)
//======= OR =======
val paywallView =
AdaptyPaywallView(activity) // or retrieve it from xml
...
with(paywallView) {
setEventListener(eventListener)
setObserverModeHandler(observerModeHandler)
showPaywall(
viewConfiguration,
products,
AdaptyPaywallInsets.of(topInset, bottomInset),
personalizedOfferResolver,
tagResolver,
)
} AdaptyPaywallView paywallView = AdaptyUI.getPaywallView(
activity,
viewConfiguration,
products,
AdaptyPaywallInsets.of(topInset, bottomInset),
eventListener,
personalizedOfferResolver,
tagResolver,
observerModeHandler
);
//======= OR =======
AdaptyPaywallView paywallView =
new AdaptyPaywallView(activity); //add to the view hierarchy if needed, or you receive it from xml
...
paywallView.setEventListener(eventListener);
paywallView.setObserverModeHandler(observerModeHandler);
paywallView.showPaywall(viewConfiguration, products, AdaptyPaywallInsets.of(topInset, bottomInset), personalizedOfferResolver); <com.adapty.ui.AdaptyPaywallView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" /> 视图成功创建后,您可以将其添加到视图层级并显示。
请求参数:
| 参数 | 是否必填 | 描述 |
|---|---|---|
| Products | 可选 | 提供 AdaptyPaywallProduct 数组以优化产品在屏幕上的显示时机。如果传入 null,AdaptyUI 将自动获取所需产品。 |
| ViewConfiguration | 必填 | 提供包含付费墙视觉详情的 AdaptyViewConfiguration 对象。使用 Adapty.getViewConfiguration(paywall) 方法加载。详情请参阅获取使用付费墙编辑工具设计的付费墙的视觉配置主题。 |
| Insets | 必填 | 定义 AdaptyPaywallInsets 对象,包含被系统栏遮挡区域的信息,为内容创建垂直边距。如果状态栏和导航栏均未与 AdaptyPaywallView 重叠,请传入 AdaptyPaywallInsets.NONE。对于系统栏遮挡部分 UI 的全屏模式,请按表格下方所示获取内边距。 |
| EventListener | 可选 | 提供 AdaptyUiEventListener 以观察付费墙事件。推荐继承 AdaptyUiDefaultEventListener 以便于使用。详情请参阅处理付费墙事件主题。 |
| PersonalizedOfferResolver | 可选 | 要标示个性化定价(了解更多),请实现 AdaptyUiPersonalizedOfferResolver 并传入您自己的逻辑,将 AdaptyPaywallProduct 映射为 true(如果该产品价格是个性化的),否则为 false。 |
| TagResolver | 可选 | 使用 AdaptyUiTagResolver 解析付费墙文本中的自定义标签。此解析器接受一个标签参数并将其解析为对应的字符串。详情请参阅付费墙编辑工具中的自定义标签主题。 |
| ObserverModeHandler | 观察者模式下必填 | 您在上一步中实现的 AdaptyUiObserverModeHandler。 |
| variationId | 必填 | 实验变体的字符串标识符。您可以通过 AdaptyPaywall 对象的 variationId 属性获取。 |
| transaction | 必填 | iOS,StoreKit1: iOS,StoreKit 2:Transaction 对象。 Android:购买的字符串标识符( |
对于系统栏遮挡部分 UI 的全屏模式,请按以下方式获取内边距:
import androidx.core.graphics.Insets
import androidx.core.view.ViewCompat
import androidx.core.view.WindowInsetsCompat
//create extension function
fun View.onReceiveSystemBarsInsets(action: (insets: Insets) -> Unit) {
ViewCompat.setOnApplyWindowInsetsListener(this) { _, insets ->
val systemBarInsets = insets.getInsets(WindowInsetsCompat.Type.systemBars())
ViewCompat.setOnApplyWindowInsetsListener(this, null)
action(systemBarInsets)
insets
}
}
//and then use it with the view
paywallView.onReceiveSystemBarsInsets { insets ->
val paywallInsets = AdaptyPaywallInsets.of(insets.top, insets.bottom)
paywallView.setEventListener(eventListener)
paywallView.setObserverModeHandler(observerModeHandler)
paywallView.showPaywall(viewConfig, products, paywallInsets, personalizedOfferResolver, tagResolver)
} import androidx.core.graphics.Insets;
import androidx.core.view.ViewCompat;
import androidx.core.view.WindowInsetsCompat;
...
ViewCompat.setOnApplyWindowInsetsListener(paywallView, (view, insets) -> {
Insets systemBarInsets = insets.getInsets(WindowInsetsCompat.Type.systemBars());
ViewCompat.setOnApplyWindowInsetsListener(paywallView, null);
AdaptyPaywallInsets paywallInsets =
AdaptyPaywallInsets.of(systemBarInsets.top, systemBarInsets.bottom);
paywallView.setEventListener(eventListener);
paywallView.setObserverModeHandler(observerModeHandler);
paywallView.showPaywall(viewConfiguration, products, paywallInsets, personalizedOfferResolver, tagResolver);
return insets;
}); 返回值:
| 对象 | 描述 |
|---|---|
AdaptyPaywallView | 代表所请求的付费墙屏幕的对象。 |
请不要忘记将付费墙关联到购买交易。否则,Adapty 将无法确定购买的来源付费墙。