Hiển thị onboarding trong Kotlin Multiplatform SDK

Warning

Onboardings đã bị deprecated kể từ Adapty SDK v4. Hãy xây dựng flows thay thế: không giống onboardings chạy trong WebView, flows render trực tiếp trên thiết bị — hiệu ứng mượt mà hơn, giao diện native nhất quán, tải nhanh hơn, và không phụ thuộc vào WebView runtime.

Nếu bạn đã tùy chỉnh một onboarding bằng builder, bạn không cần lo lắng về việc render nó trong code ứng dụng Kotlin Multiplatform để hiển thị cho người dùng. Onboarding như vậy đã chứa cả nội dung cần hiển thị lẫn cách thức hiển thị.

Trước khi bắt đầu, hãy đảm bảo rằng:

Bạn đã cài đặt Adapty Kotlin Multiplatform SDK phiên bản 3.16.1 trở lên.
Bạn đã tạo một onboarding.
Bạn đã thêm onboarding vào một placement.

Adapty Kotlin Multiplatform SDK cung cấp hai cách để hiển thị onboarding:

Với Compose Multiplatform
Không dùng Compose Multiplatform

Với Compose Multiplatform

Để hiển thị một onboarding, sử dụng phương thức view.present() trên view được tạo bởi phương thức createOnboardingView. Mỗi view chỉ có thể được sử dụng một lần. Nếu bạn cần hiển thị lại onboarding, hãy gọi createOnboardingView thêm một lần nữa để tạo một view mới.

Warning

Việc tái sử dụng cùng một view mà không tạo lại có thể dẫn đến lỗi.


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

Cấu hình kiểu hiển thị trên iOS

Cấu hình cách onboarding được hiển thị trên iOS bằng cách truyền tham số iosPresentationStyle vào phương thức present(). Tham số này nhận giá trị AdaptyUIIOSPresentationStyle.FULLSCREEN (mặc định) hoặc AdaptyUIIOSPresentationStyle.PAGESHEET.


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

Tùy chỉnh cách mở liên kết trong onboarding

Mặc định, các liên kết trong onboarding sẽ mở trong trình duyệt nội bộ của ứng dụng. Điều này mang lại trải nghiệm liền mạch cho người dùng bằng cách hiển thị trang web ngay bên trong ứng dụng, giúp họ xem nội dung mà không cần chuyển sang ứng dụng khác.

Nếu bạn muốn mở liên kết trong trình duyệt bên ngoài, bạn có thể tùy chỉnh hành vi này bằng cách đặt tham số externalUrlsPresentation thành AdaptyWebPresentation.EXTERNAL_BROWSER:


viewModelScope.launch {
    AdaptyUI.createOnboardingView(
        onboarding = onboarding,
        externalUrlsPresentation = AdaptyWebPresentation.EXTERNAL_BROWSER // default – IN_APP_BROWSER
    ).onSuccess { view ->
        view.present()
    }.onError { error ->
        // handle the error
    }
}

Không dùng Compose Multiplatform

Note

createNativeOnboardingView là một phần của module cốt lõi io.adapty:adapty-kmp. Nếu dự án của bạn không dùng Compose Multiplatform, bạn không cần dependency io.adapty:adapty-kmp-ui.

Để nhúng một onboarding mà không dùng Compose Multiplatform, hãy gọi createNativeOnboardingView. Hàm này trả về một AdaptyNativeOnboardingView mà bạn thêm vào layout của mình:


val nativeView = AdaptyUI.createNativeOnboardingView(
    context = context,
    viewModelStoreOwner = activity,
    onboarding = onboarding,
    observer = myOnboardingObserver,
)

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

Vì các phương thức mặc định của interface KMP trở thành @required trong Swift, bạn không thể triển khai AdaptyUIOnboardingsEventsObserver trực tiếp từ Swift. Hãy khai báo một lớp cơ sở open trong iosMain trước:

open class BaseOnboardingObserver : AdaptyUIOnboardingsEventsObserver

Sau đó tạo subclass trong Swift, chỉ override những gì bạn cần:

class MyOnboardingObserver: BaseOnboardingObserver {
    override func onboardingViewOnCloseAction(
        view: AdaptyUIOnboardingView,
        meta: AdaptyUIOnboardingMeta,
        actionId: String
    ) {
        // remove nativeView from your view hierarchy
    }
}

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

Hủy view

Gọi dispose() khi xóa view khỏi layout. Thao tác này sẽ hủy đăng ký event listener và giải phóng các tài nguyên nội bộ.

nativeView.dispose()