メインコンテンツまでスキップ

iOS UX ヘルパー

Rokt UX ヘルパーは、サーバー間環境で美しい顧客体験を提供するオープンソースプロジェクトです。プロジェクトを見たり、貢献したりするには Github ページをご覧ください。

このドキュメントは、RoktUXHelper を iOS アプリに統合するプロセスの概要を示しています。これは、サーバー間統合(S2S)と連携して、顧客がチェックアウトする際に関連する体験を提供します。このガイドは、UIKit/SwiftUI と基本的な iOS 開発の概念に精通していることを前提としています。

システムバージョン
RoktUXHelper0.3.1
iOS15.0+
パッケージマネージャーSwift Package Manager
Swift5+
Xcode15+
import Installation from './_installation.md';
import Configurations from './_configurations.md';
import Events from './_events.md';

<Installation />

## 必要なモジュールのインポート
RoktLayoutViewを使用するためには、必要なモジュールをビューコントローラーまたはクラスにインポートする必要があります。

```swift
import SwiftUI
import RoktUXHelper

RoktLayoutViewの初期化​

RoktLayoutViewクラスは、設定の柔軟性を許可する複数の初期化オプションを提供します。experienceResponse、location名、optional config、およびイベントハンドラーなどの必要なバインディングとパラメータを渡すことで初期化できます。

var body: some View {
    RoktLayoutView(experienceResponse: "{experience_response_json}",
                   location: "RoktEmbedded1",
                   config: roktConfig,
                   onUXEvent: { uxEvent in
                       // UXイベントをここで処理します
                   },
                   onPlatformEvent: { platformEvent in
                       // これらのプラットフォームイベントをRokt APIに送信します
                   })
}


onUXEvent ハンドラーを使用して、ユーザーインタラクションに関するリアルタイムのフィードバックを受け取ります。

最低限、RoktUXEvent.OpenUrl イベントがトリガーされたときに処理し、以下の例を使用してリンクを開く必要があります。

:::info

### OpenUrl と onClose
`event.onClose?(event.id)` は URL が開かれた後に呼び出されることが重要であり、RoktUXHelper に次のオファーに移動するためのいくつかのロジックを実行させる通知を行います。

:::

```swift
onUXEvent: { uxEvent in // UX イベントをここで処理します
    // URL を開くイベントを処理します
    // 異なるタイプの URL を開く方法のサンプルです
    if let event = uxEvent as? RoktUXEvent.OpenUrl,
        let url = URL(string: event.url) {
        switch event.type {
        case .externally:
            UIApplication.shared.open(url) { _ in
               event.onClose?(event.id) // ユーザーが次のオファーの準備ができたときに呼び出す必要があります
            }
        default:
            let safariVC = SFSafariViewController(url: url)
            safariVC.modalPresentationStyle = .overFullScreen
            if let rootVC = UIApplication.shared.connectedScenes
                .compactMap({ ($0 as? UIWindowScene)?.keyWindow }).last?.rootViewController {
                rootVC.present(safariVC, animated: true, completion: {
                    event.onClose?(event.id) // ユーザーが次のオファーの準備ができたときに呼び出す必要があります
                })
            }
        }
    }
},

概要​

RoktLayoutViewをiOSアプリに統合することは簡単で、ビューや実験を管理する柔軟な方法を提供します。このガイドで概説されている手順に従うことで、プロジェクトにRoktLayoutViewを追加し、RoktUXHelperが提供する強力な機能を最大限に活用できます。


var body: some View {
    RoktLayoutView(
        experienceResponse: "{experience_response_json}",
        location: "RoktEmbedded1",
        config: roktConfig,
        onUXEvent: { uxEvent in
            // ここでUXイベントを処理します
            if let event = uxEvent as? RoktUXEvent.OpenUrl,
                let url = URL(string: event.url) {
                switch event.type {
                case .externally:
                    UIApplication.shared.open(url) { _ in
                        event.onClose?(event.id)
                    }
                default:
                    let safariVC = SFSafariViewController(url: url)
                    safariVC.modalPresentationStyle = .overFullScreen
                    if let rootVC = UIApplication.shared.connectedScenes
                        .compactMap({ ($0 as? UIWindowScene)?.keyWindow }).last?.rootViewController {
                        rootVC.present(safariVC, animated: true, completion: {
                            event.onClose?(event.id)
                        })
                    }
                }
            }
        },
        onPlatformEvent: { platformEvent in
            // これらのプラットフォームイベントをRokt APIに送信します
        }
    )
}
この記事は役に立ちましたか？