Kotlin Multiplatform - 展示新版付费墙编辑工具付费墙

如果您已使用付费墙编辑工具自定义了付费墙，则无需在移动应用代码中手动处理其渲染逻辑来向用户展示它。此类付费墙已包含应在付费墙中显示的内容以及显示方式。

本指南仅适用于新版付费墙编辑工具付费墙。付费墙的展示流程因远程配置付费墙和 Observer 模式而有所不同。

Adapty Kotlin Multiplatform SDK 提供两种展示付费墙的方式：

使用 Compose Multiplatform
不使用 Compose Multiplatform

使用 Compose Multiplatform

要显示付费墙，请对由 createPaywallView 方法创建的 view 调用 view.present() 方法。每个 view 只能使用一次。如果需要再次显示付费墙，请再次调用 createPaywallView 以创建新的 view 实例。

重复使用同一个 view 而不重新创建，可能会导致错误。

import com.adapty.kmp.AdaptyUI

import com.adapty.kmp.models.AdaptyPaywall
import kotlinx.coroutines.launch

viewModelScope.launch {
    AdaptyUI.createPaywallView(paywall = paywall).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

显示对话框

在 Android 上展示付费墙视图时，请使用此方法代替原生 alert 对话框。在 Android 上，普通 alert 会显示在付费墙视图的后面，导致用户无法看到。此方法可确保对话框在所有平台上正确地显示在付费墙上方。

import com.adapty.kmp.models.AdaptyUIDialogActionType

import kotlinx.coroutines.launch

viewModelScope.launch {
    view.showDialog(
        title = "Close paywall?",
        content = "You will lose access to exclusive offers.",
        primaryActionTitle = "Stay",
        secondaryActionTitle = "Close"
    ).onSuccess { action ->
        if (action == AdaptyUIDialogActionType.SECONDARY) {
            // 用户确认 - 关闭付费墙
            view.dismiss()
        }
        // 如果选择主要操作 - 不做任何事，用户留下
    }.onError { error ->
        // 处理错误
    }
}

配置 iOS 呈现样式

通过向 present() 方法传递 iosPresentationStyle 参数，配置付费墙在 iOS 上的呈现方式。该参数接受 AdaptyUIIOSPresentationStyle.FULLSCREEN（默认值）或 AdaptyUIIOSPresentationStyle.PAGESHEET 值。

import com.adapty.kmp.AdaptyUI

import com.adapty.kmp.models.AdaptyUIIOSPresentationStyle
import kotlinx.coroutines.launch

viewModelScope.launch {
    val view = AdaptyUI.createPaywallView(paywall = paywall).getOrNull()
    view?.present(iosPresentationStyle = AdaptyUIIOSPresentationStyle.PAGESHEET)
}

不使用 Compose Multiplatform

createNativePaywallView 是核心模块 io.adapty:adapty-kmp 的一部分。如果您的项目不使用 Compose Multiplatform，则无需添加 io.adapty:adapty-kmp-ui 依赖。

如需在不使用 Compose Multiplatform 的情况下嵌入付费墙，请调用 createNativePaywallView。该方法会返回一个 AdaptyNativePaywallView，您可将其添加到布局中：

import com.adapty.kmp.AdaptyUI

val nativeView = AdaptyUI.createNativePaywallView(
    context = context,
    viewModelStoreOwner = activity,
    paywall = paywall,
    observer = myPaywallObserver,
)

// Embed in your Compose layout:
AndroidView(
    factory = { nativeView.view },
    modifier = Modifier.fillMaxSize()
)

由于 KMP 接口默认方法在 Swift 中会变为 @required，因此无法直接在 Swift 中实现 AdaptyUIPaywallsEventsObserver。请先在 iosMain 中声明一个 open 基类：

open class BasePaywallObserver : AdaptyUIPaywallsEventsObserver

然后在 Swift 中对其进行子类化，仅覆盖你需要的部分：

class MyPaywallObserver: BasePaywallObserver {
    override func paywallViewDidPerformAction(view: AdaptyUIPaywallView, action: any AdaptyUIAction) {
        if action is AdaptyUIActionCloseAction {
            // remove nativeView from your view hierarchy
        }
    }
}

let nativeView = AdaptyUI.shared.createNativePaywallView(
    paywall: paywall,
    observer: MyPaywallObserver()
)
// nativeView.viewController is a UIViewController.
// Add it to your SwiftUI view or UIKit hierarchy.

销毁视图

在从布局中移除视图时，请调用 dispose()。这将注销事件监听器并释放内部资源。

nativeView.dispose()

自定义标签

自定义标签让你无需为不同场景创建单独的付费墙。想象一个能根据用户数据动态适配的付费墙。例如，你可以用”你好，John！“或”你好，Ann！“来个性化问候用户，而不是千篇一律的”你好！”

以下是一些自定义标签的使用场景：

在付费墙上显示用户的姓名或电子邮件。
显示当前星期几来促进销售（例如，“周四快乐”）。
添加关于所售产品的个性化详情（例如健身计划的名称，或 VoIP 应用中的电话号码）。自定义标签可帮助您创建灵活的付费墙，使其适应各种情况，让您的应用界面更加个性化和吸引人。

在某些情况下，您的应用可能不知道该用什么来替换自定义标签——尤其是当用户使用较旧版本的 AdaptyUI SDK 时。为防止这种情况，请务必添加备用文本，以替换包含未知自定义标签的内容行。否则，用户可能会看到标签以代码形式显示（<USERNAME/>）。

要在付费墙中使用自定义标签，请在创建付费墙视图时传入这些标签：

import kotlinx.coroutines.launch

import com.adapty.kmp.AdaptyUI

viewModelScope.launch {
    val customTags = mapOf(
        "USERNAME" to "John",
        "DAY_OF_WEEK" to "Thursday"
    )

    AdaptyUI.createPaywallView(
        paywall = paywall,
        customTags = customTags
    ).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

import com.adapty.kmp.AdaptyUI

val customTags = mapOf(
    "USERNAME" to "John",
    "DAY_OF_WEEK" to "Thursday"
)

val nativeView = AdaptyUI.createNativePaywallView(
    context = context,
    viewModelStoreOwner = activity,
    paywall = paywall,
    observer = myPaywallObserver,
    customTags = customTags,
)

import com.adapty.kmp.AdaptyUI

val customTags = mapOf(
    "USERNAME" to "John",
    "DAY_OF_WEEK" to "Thursday"
)

val nativeView = AdaptyUI.createNativePaywallView(
    paywall = paywall,
    observer = myPaywallObserver,
    customTags = customTags,
)

自定义计时器

付费墙计时器是推广限时特惠和季节性活动的绝佳工具。但需要注意的是，该计时器与优惠的有效期或活动持续时间无关。它只是一个独立的倒计时器，从您设定的值开始递减至零。当计时器归零后，不会触发任何操作——它只会停留在零。

您可以自定义计时器前后的文字，以呈现所需的提示信息，例如：“优惠结束倒计时：10:00 秒。”

要在付费墙中使用自定义计时器，请在创建付费墙视图时将其传入：

import kotlinx.coroutines.launch

import com.adapty.kmp.AdaptyUI
import kotlinx.datetime.LocalDateTime

viewModelScope.launch {
    val customTimers = mapOf(
        "CUSTOM_TIMER_NY" to LocalDateTime(2025, 1, 1, 0, 0, 0),
        "CUSTOM_TIMER_SALE" to LocalDateTime(2024, 12, 31, 23, 59, 59)
    )

    AdaptyUI.createPaywallView(
        paywall = paywall,
        customTimers = customTimers
    ).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

import com.adapty.kmp.AdaptyUI

import kotlinx.datetime.LocalDateTime

val customTimers = mapOf(
    "CUSTOM_TIMER_NY" to LocalDateTime(2025, 1, 1, 0, 0, 0),
    "CUSTOM_TIMER_SALE" to LocalDateTime(2024, 12, 31, 23, 59, 59)
)

val nativeView = AdaptyUI.createNativePaywallView(
    context = context,
    viewModelStoreOwner = activity,
    paywall = paywall,
    observer = myPaywallObserver,
    customTimers = customTimers,
)

import com.adapty.kmp.AdaptyUI

import kotlinx.datetime.LocalDateTime

val customTimers = mapOf(
    "CUSTOM_TIMER_NY" to LocalDateTime(2025, 1, 1, 0, 0, 0),
    "CUSTOM_TIMER_SALE" to LocalDateTime(2024, 12, 31, 23, 59, 59)
)

val nativeView = AdaptyUI.createNativePaywallView(
    paywall = paywall,
    observer = myPaywallObserver,
    customTimers = customTimers,
)