---
title: "Kotlin Multiplatform SDKでオンボーディングのデータを処理する"
description: "Adapty SDKを使用して、Kotlin MultiplatformアプリでオンボーディングのデータをKotlin MultiplatformアプリのAdapty SDKで保存・活用しましょう。"
---

:::warning
**オンボーディングはSDK v4で非推奨となり、将来のリリースで削除される予定です。** バグ修正や改善は行われません。代わりに[フロー](kmp-get-pb-paywalls)をご利用ください。オンボーディングはWebView内で動作しますが、フローはデバイス上でネイティブにレンダリングされるため、よりスムーズなアニメーション、一貫したネイティブの外観、高速な読み込み、WebViewランタイムへの依存がなくなります。はじめるには[フロー＆ペイウォールの取得](kmp-get-pb-paywalls)と[フロー＆ペイウォールの表示](kmp-present-paywalls)をご覧ください。
:::

ユーザーがクイズの質問に回答したり、入力フィールドにデータを入力したりすると、`onboardingViewOnStateUpdatedAction` メソッドが呼び出されます。フィールドのタイプはコード内で保存または処理できます。

例：

```kotlin

class MyAdaptyUIOnboardingsEventsObserver : AdaptyUIOnboardingsEventsObserver {
    override fun onboardingViewOnStateUpdatedAction(
        view: AdaptyUIOnboardingView,
        meta: AdaptyUIOnboardingMeta,
        elementId: String,
        params: AdaptyOnboardingsStateUpdatedParams
    ) {
        // Store user preferences or responses
        when (params) {
            is AdaptyOnboardingsSelectParams -> {
                // Handle single selection
                val id = params.id
                val value = params.value
                val label = params.label
                AppLogger.d("Selected option: $label (id: $id, value: $value)")
            }
            is AdaptyOnboardingsMultiSelectParams -> {
                // Handle multiple selections
            }
            is AdaptyOnboardingsInputParams -> {
                // Handle text input
            }
            is AdaptyOnboardingsDatePickerParams -> {
                // Handle date selection
            }
        }
    }
}

// Set up the observer
AdaptyUI.setOnboardingsEventsObserver(MyAdaptyUIOnboardingsEventsObserver())
```

<Details>
    <summary>保存データの例（実際の実装では形式が異なる場合があります）</summary>

```javascript
    // Example of a saved select action
    {
        "id": "onboarding_on_state_updated_action",
        "view": { /* AdaptyUI.OnboardingView object */ },
        "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "preferences_screen",
        "screen_index": 1,
        "total_screens": 3
    },
        "action": {
        "element_id": "preference_selector",
        "element_type": "select",
        "value": {
        "id": "option_1",
        "value": "premium",
        "label": "Premium Plan"
    }
    }
    }

    // Example of a saved multi-select action
    {
        "id": "onboarding_on_state_updated_action",
        "view": { /* AdaptyUI.OnboardingView object */ },
        "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "interests_screen",
        "screen_index": 2,
        "total_screens": 3
    },
        "action": {
        "element_id": "interests_selector",
        "element_type": "multi_select",
        "value": [
    {
        "id": "interest_1",
        "value": "sports",
        "label": "Sports"
    },
    {
        "id": "interest_2",
        "value": "music",
        "label": "Music"
    }
        ]
    }
    }

    // Example of a saved input action
    {
        "id": "onboarding_on_state_updated_action",
        "view": { /* AdaptyUI.OnboardingView object */ },
        "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "profile_screen",
        "screen_index": 0,
        "total_screens": 3
    },
        "action": {
        "element_id": "name_input",
        "element_type": "input",
        "value": {
        "type": "text",
        "value": "John Doe"
    }
    }
    }

    // Example of a saved date picker action
    {
        "id": "onboarding_on_state_updated_action",
        "view": { /* AdaptyUI.OnboardingView object */ },
        "meta": {
        "onboarding_id": "onboarding_123",
        "screen_cid": "profile_screen",
        "screen_index": 0,
        "total_screens": 3
    },
        "action": {
        "element_id": "birthday_picker",
        "element_type": "date_picker",
        "value": {
        "day": 15,
        "month": 6,
        "year": 1990
    }
    }
    }
    ```
</Details>

## ユースケース \{#use-cases\}

### ユーザープロファイルにデータを反映する \{#enrich-user-profiles-with-data\}

入力データをユーザープロファイルとすぐに紐づけ、同じ情報を二度聞かないようにするには、アクションの処理時に入力データで[ユーザープロファイルを更新](kmp-setting-user-attributes)する必要があります。

例えば、`name` IDのテキストフィールドにユーザーの名前を入力してもらい、その値をユーザーの名として設定したい場合や、`email` フィールドにメールアドレスを入力してもらいたい場合、アプリのコードは次のようになります。

```kotlin

class MyAdaptyUIOnboardingsEventsObserver : AdaptyUIOnboardingsEventsObserver {
    override fun onboardingViewOnStateUpdatedAction(
        view: AdaptyUIOnboardingView,
        meta: AdaptyUIOnboardingMeta,
        elementId: String,
        params: AdaptyOnboardingsStateUpdatedParams
    ) {
        // Store user preferences or responses
        when (params) {
            is AdaptyOnboardingsInputParams -> {
                // Handle text input
                val builder = AdaptyProfileParameters.Builder()

                // Map elementId to appropriate profile field
                when (elementId) {
                    "name" -> {
                        when (val input = params.input) {
                            is AdaptyOnboardingsTextInput -> {
                                builder.withFirstName(input.value)
                            }
                        }
                    }
                    "email" -> {
                        when (val input = params.input) {
                            is AdaptyOnboardingsEmailInput -> {
                                builder.withEmail(input.value)
                            }
                        }
                    }
                }

                // Update profile asynchronously
                mainUiScope.launch {
                    val profileParams = builder.build()
                    val result = Adapty.updateProfile(profileParams)
                    result.onSuccess { profile ->
                        // Profile updated successfully
                        AppLogger.d("Profile updated: ${profile.email}")
                    }.onError { error ->
                        // Handle the error
                        AppLogger.e("Failed to update profile: ${error.message}")
                    }
                }
            }
        }
    }
}

// Set up the observer
AdaptyUI.setOnboardingsEventsObserver(MyAdaptyUIOnboardingsEventsObserver())
```

### 回答に基づいてペイウォールをカスタマイズする \{#customize-paywalls-based-on-answers\}

オンボーディングでクイズを使用することで、オンボーディング完了後にユーザーに表示するペイウォールをカスタマイズすることもできます。

たとえば、スポーツの経験についてユーザーに質問し、異なるユーザーグループに対して異なるCTAやプロダクトを表示することができます。

1. オンボーディングビルダーで[クイズを追加](onboarding-quizzes)し、その選択肢に意味のあるIDを割り当てます。

2. IDに基づいてクイズの回答を処理し、ユーザーに[カスタム属性を設定](kmp-setting-user-attributes)します。

```kotlin

class MyAdaptyUIOnboardingsEventsObserver : AdaptyUIOnboardingsEventsObserver {
    override fun onboardingViewOnStateUpdatedAction(
        view: AdaptyUIOnboardingView,
        meta: AdaptyUIOnboardingMeta,
        elementId: String,
        params: AdaptyOnboardingsStateUpdatedParams
    ) {
        // Handle quiz responses and set custom attributes
        when (params) {
            is AdaptyOnboardingsSelectParams -> {
                // Handle quiz selection
                val builder = AdaptyProfileParameters.Builder()

                // Map quiz responses to custom attributes
                when (elementId) {
                    "experience" -> {
                        // Set custom attribute 'experience' with the selected value (beginner, amateur, pro)
                        builder.withCustomAttribute("experience", params.value)
                    }
                }

                // Update profile asynchronously
                mainUiScope.launch {
                    val profileParams = builder.build()
                    val result = Adapty.updateProfile(profileParams)
                    result.onSuccess { profile ->
                        // Profile updated successfully
                        AppLogger.d("Custom attribute 'experience' set to: ${params.value}")
                    }.onError { error ->
                        // Handle the error
                        AppLogger.e("Failed to update profile: ${error.message}")
                    }
                }
            }
        }
    }
}

// Set up the observer
AdaptyUI.setOnboardingsEventsObserver(MyAdaptyUIOnboardingsEventsObserver())
```

3. [カスタム属性の値ごとにセグメントを作成する](segments)。
4. [プレースメント](placements)を作成し、作成した各セグメントに対して[オーディエンス](audience)を追加する。
5. アプリのコードにプレースメントの[ペイウォールを表示する](kmp-paywalls)。オンボーディングにペイウォールを開くボタンがある場合は、[このボタンのアクションへの応答](kmp-handling-onboarding-events#opening-a-paywall)としてペイウォールのコードを実装する。