プレースメントを追加する
Rokt SDK for Flutterを使用すると、アプリのコンテンツの上にオーバーレイプレースメントを表示できます。
始める前に
Rokt Flutter SDKが既にアプリケーションに統合されていることを確認してください。
オーバーレイプレースメント
SDKをインポートする
SDKをアプリケーションのdartファイルにインポートします:
import 'package:rokt_sdk/rokt_sdk.dart';
SDKを実行する
適切な顧客属性を追加して、希望するポイントでSDKを実行します。Roktプレースメントは、Roktプラットフォームで設定可能な短い遅延の後に表示されます。
Rokt統合に含める顧客属性を指定できます。利用可能なデータフィールドの詳細はattributesページで確認できます。さらに属性を統合したい場合は、以下のサンプルに新しい属性のコード行を追加できます。
void executeRokt() {
// RoktExperienceをviewNameに置き換えます
RoktSdk.execute(
viewName: "RoktExperience",
attributes: {"email": "j.smith@example.com",
"firstname": "Jenny",
"lastname": "Smith",
"mobile": "(555)867-5309",
"postcode": "90210",
"country": "US"},
onLoad: () {
// Roktプレースメントがロードされたときのオプションのコールバック
},
onUnLoad: () {
// Roktプレースメントがアンロードされたときのオプションのコールバック
},
onShouldShowLoadingIndicator: () {
// ローディングインジケーターを表示するためのオプションのコールバック
},
onShouldHideLoadingIndicator: () {
// ローディングインジケーターを非表示にするためのオプションのコールバック
});
}
ViewName（「RoktExperience」）は、SDKを複数の場所で実行する際に、アプリ内の実行コンテキストに応じて異なるエクスペリエンスを表示するために変更できます。ViewNameを変更する場合は、Roktシステム内で一致する調整が行われるようにRoktチームと協力してください。
埋め込み配置
SDK のインポート
JavaScript ファイルに Rokt SDK をインポートします:
import 'package:rokt_sdk/rokt_sdk.dart';
RoktWidget をビューに追加
ビューの build 関数に RoktWidget を追加します。execute メソッドが呼び出されると、このプレースホルダーに Rokt ウィジェットが挿入されます:
const RoktWidget(placeholderName: "RoktEmbedded1")
ビューが画面の表示領域に作成されていることを確認し、次に showWidget を呼び出してください。RoktWidget には、ウィジェットが作成されたときに通知するコールバックがあります。
RoktWidget(placeholderName: "RoktEmbedded1", onWidgetCreated: () { showWidget() })
Rokt Flutter SDK の実行
適切な顧客属性を送信して、希望するポイントで SDK を実行します。Rokt 配置は、Rokt プラットフォームを介して構成可能な短い遅延の後に表示されます。
Rokt 統合に含める顧客属性を指定できます。利用可能なデータフィールドの詳細については、attributes ページをご覧ください。さらに属性を統合したい場合は、以下のサンプルに各新しい属性のコード行を追加できます。
void executeRokt() {
// RoktExperience を viewName に置き換えてください
RoktSdk.execute(
viewName: "RoktEmbeddedExperience",
attributes: {"email": "j.smith@example.com",
"firstname": "Jenny",
"lastname": "Smith",
"mobile": "(555)867-5309",
"postcode": "90210",
"country": "US"},
onLoad: () {
// Rokt 配置が読み込まれたときのオプションのコールバック
},
onUnLoad: () {
// Rokt 配置がアンロードされたときのオプションのコールバック
},
onShouldShowLoadingIndicator: () {
// ローディングインジケーターを表示するためのオプションのコールバック
},
onShouldHideLoadingIndicator: () {
// ローディングインジケーターを非表示にするためのオプションのコールバック
});
}
ViewName（「RoktEmbeddedExperience」）は、SDKを複数の場所で実行する際に変更することができます。この設定により、アプリ内でSDKが実行されるコンテキストに応じて異なるエクスペリエンスを表示することができます。ViewNameやplaceholderName（「RoktEmbedded1」）を変更する場合は、Roktシステム内で一致する調整が行われるようにRoktチームと連携してください。
イベント
バージョン 4.3.0 から、Rokt SDKはSDKイベントのためのEventChannelを公開しています
final EventChannel roktEventChannel = EventChannel('RoktEvents');
//...
roktEventChannel.receiveBroadcastStream().listen((dynamic event) {
debugPrint("Rokt event received $event");
switch (event["event"]) {
case "ShowLoadingIndicator":
debugPrint("Event ${event["viewName"]}");
break;
case "HideLoadingIndicator":
debugPrint("Event ${event["viewName"]}");
break;
case "OfferEngagement":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PositiveEngagement":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "FirstPositiveEngagement":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PlacementInteractive":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PlacementReady":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PlacementClosed":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PlacementCompleted":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
case "PlacementFailure":
debugPrint("Event ${event["viewName"]}, ${event["placementId"]}");
break;
default:
break;
}
});
イベントオブジェクト
| イベント | 説明 | その他のプロパティ |
|---|---|---|
| ShowLoadingIndicator | SDKがRoktバックエンドを呼び出す前にトリガーされる | viewName: String |
| HideLoadingIndicator | SDKがRoktバックエンドから成功または失敗を受信したときにトリガーされる | viewName: String |
| OfferEngagement | ユーザーがオファーにエンゲージしたときにトリガーされる | viewName: String, placementId: String |
| PositiveEngagement | ユーザーがオファーに積極的にエンゲージしたときにトリガーされる | viewName: String, placementId: String |
| FirstPositiveEngagement | ユーザーが初めてオファーに積極的にエンゲージしたときにトリガーされる | viewName: String, placementId: String |
| PlacementInteractive | プレースメントがレンダリングされ、インタラクティブになったときにトリガーされる | viewName: String, placementId: String |
| PlacementReady | プレースメントが表示準備ができているが、まだコンテンツがレンダリングされていないときにトリガーされる | viewName: String, placementId: String |
| PlacementClosed | ユーザーによってプレースメントが閉じられたときにトリガーされる | viewName: String, placementId: String |
| PlacementCompleted | オファーの進行が終了し、表示するオファーがなくなったときにトリガーされる | viewName: String, placementId: String |
| PlacementFailure | 何らかの失敗によりプレースメントを表示できなかったときにトリガーされる | viewName: String, placementId: String (optional) |
コールバック
The Rokt Flutter SDKは、executeに渡される以下のコールバックをサポートしています:
onLoad
onLoadコールバックは、プレースメントが読み込まれ、インタラクティブになったときに呼び出されます。このコールバックは引数を提供せず、値を返しません。
onShouldShowLoadingIndicator
onShouldShowLoadingIndicatorは、成功したexecute呼び出しの直後、SDKがRoktバックエンドへの呼び出しをトリガーする直前に呼び出されます。プレースメントの読み込みを待っている間、読み込みインジケーターの進行状況ビューを表示するために使用できます。引数を必要とせず、値を返しません。
このコールバックの動作は、Rokt Flutter SDKのメジャーバージョン3とメジャーバージョン4の間で変更されました。コールバックが実行される前に1秒の遅延はもうありません。メジャーバージョン3でこれらのコールバックを使用していて、メジャーバージョン4にアップグレードする場合は、ユーザーエクスペリエンスに影響がないことを確認するために動作をテストしてください。必要に応じて、アプリケーションのニーズに合った遅延動作を作成できます。
onShouldHideLoadingIndicator
onShouldHideLoadingIndicator コールバックは、SDK が Rokt バックエンドから成功または失敗のレスポンスを取得したときに呼び出されます。これを使用して、プログレスビューやローディングインジケーターをキャンセルすることができます。引数は必要なく、値も返しません。
onUnload
onUnload コールバックは、SDK がプレースメントを閉じるときに呼び出されます。また、execute コールが失敗した場合にもトリガーされます。引数は必要なく、値も返しません。