Phản hồi các hành động trong flow - Kotlin Multiplatform

Nếu bạn đang xây dựng flow hoặc paywall bằng Adapty Flow Builder hoặc Paywall Builder, việc thiết lập các nút đúng cách là rất quan trọng:

1. Thêm nút trong builder và gán cho nó một action có sẵn hoặc tạo một custom action ID.
2. Viết code trong ứng dụng của bạn để xử lý từng action bạn đã gán.

Hướng dẫn này cho thấy cách xử lý các custom action và action có sẵn trong code của bạn.

Thiết lập AdaptyUIFlowsEventsObserver

Để xử lý các hành động trong flow, bạn cần implement interface AdaptyUIFlowsEventsObserver và thiết lập nó với AdaptyUI.setFlowsEventsObserver(). Bước này nên được thực hiện sớm trong vòng đời ứng dụng, thường là trong activity chính hoặc khi khởi tạo ứng dụng.

// In your app initialization
AdaptyUI.setFlowsEventsObserver(MyAdaptyUIFlowsEventsObserver())

Tất cả các hành động của nút đều được truyền vào callback flowViewDidPerformAction(view, action) dưới dạng sealed class AdaptyUIAction: CloseAction, AndroidSystemBackAction, OpenUrlAction, hoặc CustomAction.

Đóng flow và paywall

Để thêm nút đóng flow hoặc paywall:

1. Trong builder, thêm một nút và gán cho nó hành động Close.
2. Trong code ứng dụng, triển khai trình xử lý cho hành động close để đóng flow.

class MyAdaptyUIFlowsEventsObserver : AdaptyUIFlowsEventsObserver {
    override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CloseAction ->
                mainUiScope.launch { view.dismiss() } // default behavior
            is AdaptyUIAction.OpenUrlAction ->
                AdaptyUI.openWebUrl(action.url, action.openIn) // default behavior
            else -> Unit
        }
    }
}

// Set up the observer
AdaptyUI.setFlowsEventsObserver(MyAdaptyUIFlowsEventsObserver())

Nếu bạn đang dùng createNativeFlowView, việc gọi view.dismiss() sẽ không có tác dụng — view được nhúng vào layout của bạn, không được hiển thị qua stack KMP. Hãy xóa view khỏi layout và gọi dispose() trên đó thay thế.

Xử lý nút back của hệ thống Android

Khi nhấn nút back của hệ thống Android (hoặc dùng cử chỉ vuốt back), sự kiện AdaptyUIAction.AndroidSystemBackAction sẽ được phát ra. Mặc định, hành động này bị bỏ qua — flow vẫn mở, và người dùng thoát khỏi nó theo đường dẫn bạn định nghĩa, chẳng hạn nút Close hoặc hành động on_device_back trong builder. Nếu bạn muốn nút back của hệ thống đóng flow lại, hãy tự xử lý hành động đó:

class MyAdaptyUIFlowsEventsObserver : AdaptyUIFlowsEventsObserver {
    override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CloseAction ->
                mainUiScope.launch { view.dismiss() } // default behavior
            is AdaptyUIAction.AndroidSystemBackAction ->
                mainUiScope.launch { view.dismiss() } // not handled by default
            is AdaptyUIAction.OpenUrlAction ->
                AdaptyUI.openWebUrl(action.url, action.openIn) // default behavior
            else -> Unit
        }
    }
}

Mở URL từ flow và paywall

Để thêm nút mở liên kết từ flow hoặc paywall của bạn (ví dụ: Terms of use hoặc Privacy policy), trong builder, hãy thêm một nút, gán cho nó hành động Open URL, và nhập URL bạn muốn mở.

Theo mặc định, SDK sẽ mở URL nhận được theo cách tự nhiên — trong trình duyệt ngoài hoặc trình duyệt trong ứng dụng, tùy thuộc vào action.openIn — nên bạn không cần viết thêm code. Chỉ cần ghi đè handler khi bạn muốn xử lý tùy chỉnh, ví dụ như hiển thị hộp thoại xác nhận trước:

class MyAdaptyUIFlowsEventsObserver(
    private val uriHandler: UriHandler
) : AdaptyUIFlowsEventsObserver {
    override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.OpenUrlAction -> {
                // Show confirmation dialog before opening URL
                mainUiScope.launch {
                    val selectedAction = view.showDialog(
                        title = "Open URL?",
                        content = action.url,
                        primaryActionTitle = "Cancel",
                        secondaryActionTitle = "Open"
                    ).getOrNull()

                    when (selectedAction) {
                        AdaptyUIDialogActionType.PRIMARY -> {
                            // User cancelled
                        }
                        AdaptyUIDialogActionType.SECONDARY -> {
                            // User confirmed - open URL
                            uriHandler.openUri(action.url)
                        }
                        else -> Unit
                    }
                }
            }
            else -> Unit
        }
    }
}

// Set up the observer with UriHandler
AdaptyUI.setFlowsEventsObserver(MyAdaptyUIFlowsEventsObserver(uriHandler))

Đăng nhập vào ứng dụng

Để thêm nút cho phép người dùng đăng nhập vào ứng dụng:

1. Trong builder, thêm một nút và gán cho nó hành động Custom với ID “login”.
2. Trong code ứng dụng của bạn, triển khai một handler cho hành động tùy chỉnh đó để xác định người dùng.

class MyAdaptyUIFlowsEventsObserver : AdaptyUIFlowsEventsObserver {
    override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CustomAction -> {
                if (action.action == "login") {
                    // Handle login action - navigate to login screen
                    // This depends on your app's navigation system
                    // For example, in Compose Multiplatform:
                    // navController.navigate("login")
                }
            }
            else -> Unit
        }
    }
}

Xử lý các action tùy chỉnh

Để thêm một nút xử lý các action khác:

1. Trong builder, thêm một nút, gán cho nó action Custom, và đặt cho nó một ID.
2. Trong code ứng dụng của bạn, triển khai một handler cho action ID mà bạn đã tạo.

Ví dụ: nếu bạn có một tập hợp ưu đãi gói đăng ký hoặc sản phẩm mua một lần khác, bạn có thể thêm một nút sẽ hiển thị một flow hoặc paywall khác:

class MyAdaptyUIFlowsEventsObserver : AdaptyUIFlowsEventsObserver {
    override fun flowViewDidPerformAction(view: AdaptyUIFlowView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CustomAction -> {
                when (action.action) {
                    "openNewFlow" -> {
                        // Display another flow or paywall
                    }
                }
            }
            else -> Unit
        }
    }
}

// Set up the observer
AdaptyUI.setFlowsEventsObserver(MyAdaptyUIFlowsEventsObserver())

Nếu bạn đang xây dựng paywall bằng Adapty paywall builder, việc thiết lập nút đúng cách là rất quan trọng:

1. Thêm nút trong paywall builder và gán cho nó một hành động có sẵn hoặc tạo một ID hành động tùy chỉnh.
2. Viết code trong ứng dụng để xử lý từng hành động bạn đã gán.

Hướng dẫn này mô tả cách xử lý các hành động tùy chỉnh và hành động có sẵn trong code của bạn.

Thiết lập AdaptyUIPaywallsEventsObserver

Để xử lý các hành động trên paywall, bạn cần triển khai interface AdaptyUIPaywallsEventsObserver và thiết lập nó với AdaptyUI.setPaywallsEventsObserver(). Bước này nên được thực hiện sớm trong vòng đời của ứng dụng, thường là trong activity chính hoặc khi khởi tạo ứng dụng.

// In your app initialization
AdaptyUI.setPaywallsEventsObserver(MyAdaptyUIPaywallsEventsObserver())

Đóng paywall

Để thêm nút đóng paywall:

1. Trong Paywall Builder, thêm một nút và gán cho nó hành động Close.
2. Trong code ứng dụng của bạn, triển khai một handler cho hành động close để đóng paywall.

class MyAdaptyUIPaywallsEventsObserver : AdaptyUIPaywallsEventsObserver {
    override fun paywallViewDidPerformAction(view: AdaptyUIPaywallView, action: AdaptyUIAction) {
        when (action) {
            AdaptyUIAction.CloseAction, AdaptyUIAction.AndroidSystemBackAction -> view.dismiss()
        }
    }
}

// Set up the observer
AdaptyUI.setPaywallsEventsObserver(MyAdaptyUIPaywallsEventsObserver())

Nếu bạn đang sử dụng createNativePaywallView, việc gọi view.dismiss() sẽ không có tác dụng — view được nhúng vào layout của bạn, không được hiển thị qua stack KMP. Thay vào đó, hãy xóa view khỏi layout và gọi dispose() trên nó.

Mở URL từ paywall

Để thêm một nút mở liên kết từ paywall của bạn (ví dụ: Terms of use hoặc Privacy policy):

1. Trong paywall builder, thêm một nút, gán cho nó hành động Open URL, và nhập URL bạn muốn mở.
2. Trong code của ứng dụng, triển khai một handler cho hành động openUrl để mở URL nhận được trong trình duyệt.

class MyAdaptyUIPaywallsEventsObserver(
    private val uriHandler: UriHandler
) : AdaptyUIPaywallsEventsObserver {
    override fun paywallViewDidPerformAction(view: AdaptyUIPaywallView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.OpenUrlAction -> {
                // Show confirmation dialog before opening URL
                mainUiScope.launch {
                    val selectedAction = view.showDialog(
                        title = "Open URL?",
                        content = action.url,
                        primaryActionTitle = "Cancel",
                        secondaryActionTitle = "Open"
                    ).getOrNull()

                    when (selectedAction) {
                        AdaptyUIDialogActionType.PRIMARY -> {
                            // User cancelled
                        }
                        AdaptyUIDialogActionType.SECONDARY -> {
                            // User confirmed - open URL
                            uriHandler.openUri(action.url)
                        }
                        else -> Unit
                    }
                }
            }
        }
    }
}

// Set up the observer with UriHandler
AdaptyUI.setPaywallsEventsObserver(MyAdaptyUIPaywallsEventsObserver(uriHandler))

Đăng nhập vào ứng dụng

Để thêm nút cho phép người dùng đăng nhập vào ứng dụng của bạn:

1. Trong Paywall Builder, thêm một nút và gán cho nó hành động Custom với ID “login”.
2. Trong code ứng dụng của bạn, triển khai một handler cho hành động tùy chỉnh đó để xác định danh tính người dùng.

class MyAdaptyUIObserver : AdaptyUIObserver {
    override fun paywallViewDidPerformAction(view: AdaptyUIView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CustomAction -> {
                if (action.action == "login") {
                    // Handle login action - navigate to login screen
                    // This depends on your app's navigation system
                    // For example, in Compose Multiplatform:
                    // navController.navigate("login")
                }
            }
        }
    }
}

Xử lý các hành động tùy chỉnh

Để thêm một nút xử lý các hành động khác:

1. Trong Paywall Builder, thêm một nút, gán cho nó hành động Custom, và đặt cho nó một ID.
2. Trong code của ứng dụng, triển khai một handler cho action ID bạn đã tạo.

Ví dụ: nếu bạn có một bộ ưu đãi gói đăng ký khác hoặc sản phẩm mua một lần, bạn có thể thêm một nút để hiển thị một paywall khác:

class MyAdaptyUIPaywallsEventsObserver : AdaptyUIPaywallsEventsObserver {
    override fun paywallViewDidPerformAction(view: AdaptyUIPaywallView, action: AdaptyUIAction) {
        when (action) {
            is AdaptyUIAction.CustomAction -> {
                when (action.action) {
                    "login" -> {
                        // Handle login action - navigate to login screen
                        // This depends on your app's navigation system
                        // For example, in Compose Multiplatform:
                        // navController.navigate("login")
                    }
                }
            }
        }
    }
}

// Set up the observer
AdaptyUI.setPaywallsEventsObserver(MyAdaptyUIPaywallsEventsObserver())