コンテンツにスキップ

着せ替えアプリとの接続

自社アプリに着せ替えアプリのリンクを張ることで、エンドユーザは着せ替え操作を簡単に行えるようになります。本ページでは、リンクの実装について説明します。

全体の流れ

エンドユーザから見たときの全体の流れを説明します。

Avatar Play と連携するまでの流れ(初回のみ)

最初の1度だけ、Avatar Play と自社アプリを連携するためにユーザの許諾を得る必要があります(OAuth認証)。連携が完了すると、明示的に連携を切るまではこの次に説明する「連携完了後の流れ」へ移行します。

以下の図は、Avatar Play が端末にインストールされていない場合の流れです。 Avatar Play 未インストール時の連携フロー

  1. 自社アプリ側で「Avatar Play を使う」を選択すると、ブラウザが起動し Avatar Play の紹介ページが表示される
  2. 「Avatar Play を入手」ボタンを選択すると、アプリストアが起動し Avatar Play のインストールページが表示される
  3. Avatar Play をインストールしログインすると、着せ替え画面が表示される
  4. アバターを着せ替えた後、戻るボタンを選択すると、自社アプリでアバターを利用するための許諾画面が表示される
  5. 「許諾する」を選択すると、自社アプリに戻り、連携が成功する

Avatar Play と連携完了した後の流れ

Avatar Play との連携完了後は、自社アプリから Avatar Play を起動し着替えた後、自社アプリへ戻れば着替えたアバターに更新されます。

Avatar Play 連携後のフロー

実装

UI

Avatar Play へのリンク(ボタン、テキストリンク、アイコンなど)を、自社アプリの設定画面などに配置します。

ボタン、テキストリンク

ボタンやテキストリンクを使う場合は、「Avatar Play を使う」という文言を利用してください。

ボタンリンク

アイコン

SDKの Assets > Avatar Play > Textures > App Icon フォルダにあるアイコン画像を利用してください。アイコンの近くに、「Avatar Play」という文言を配置してください。

アイコンリンク

スクリプトによる実装箇所

リンクを押したとき、許諾画面から戻ったときの挙動をスクリプトで実装します。

実装箇所 実装方法
初期処理 AvatarSDK.InitializeAsync を呼び出します。後述のメソッドを利用するために必要です。
リンクを押したとき AvatarSDK.ConnectOrLaunch を呼び出します。このメソッドは、ゲストユーザなら Avatar Play への連携を、連携済みユーザ(Avatar Play 連携済み)なら単にAvatar Playを起動します。引数に、自社アプリが受け取れるカスタムURLを指定する必要があります。
許諾画面から自社アプリへ戻ったとき カスタムURLを受け取り、コールバック関数 OnApplicationPause の中で AvatarSDK.InitializeAsync を呼び出します。正常なら連携が成功します。

デモ

Assets > Avatar Play Demo > 08. Avatar Play Linking Demo > Scenes 以下にあるシーンでリンクのデモを確認できます。Unityエディタのレジューム時に OnApplicationPause が呼び出されるように、シーン実行後にUnityエディタの Edit > Project Settings > PlayerSettings for PC, Mac & Linux Standalone > Resolution and Presentation > ResolutionRun in Background を無効にしてください。

このデモは、シーン開始時は Avatar Play と連携していない状態で、アバターはデフォルトのアバターが表示されます。

リンクのデモ

「Avatar Play を使う」ボタンをクリックすると、ブラウザが起動し仮の Avatar Play の紹介ページが開きます。デモでは、その後着せ替えアプリで承諾まで行われたとして扱われ、Unityエディタに戻ると連携が成功し、女の子のアバターに変わります。

リンクのデモ

その後「Avatar Play を使う」ボタンをクリックすると、ブラウザが起動し仮の Avatar Play の画面が表示されます。

実装

Assets > Avatar Play Demo > 08. Avatar Play Linking Demo > Scripts 以下にある GameController.cs に実装されています。

リンクを押したとき

ボタンの On Click に以下のメソッドを割り当てています。

public void OpenAvatarPlay()
{
    AvatarSDK.ConnectOrLaunch("example.com:///oauth_callback");
}

AvatarSDK.ConnectOrLaunch の引数には、自社アプリが受信できるリダイレクトURI(カスタムURL)を指定します。事前にデベロッパーコンソールの[アプリ一覧|https://developer.avatarplay3d.com/console/apps.html]からアプリの設定に進み、アプリが利用するURLを登録しておく必要があります。

AvatarSDK.ConnectOrLaunch にパーミッションを付け加えることができます。何も指定しなければ、アバターをロードするパーミッションのみを取得します。

AvatarSDK.ConnectOrLaunch(
    "example.com:///oauth_callback",
     permissions: new AccessToken.Permission[] {
         AccessToken.Permission.AvatarLoad,
         AccessToken.Permission.ItemGrant
     }
);

パーミッションについては着せ替えアプリとの接続の項を参照してください。

許諾画面から自社アプリへ戻ったとき

レジューム時に AvatarSDK.InitializeAsync を呼び出して連携処理を完了させます。

void OnApplicationPause(bool pauseStatus)
{
    if (!pauseStatus)
    {
        // レジューム時
        StartCoroutine(Initialize());
    }
}

IEnumerator Initialize()
{
    // 認可トークンの受け取りも InitializeAsync で処理される
    yield return AvatarSDK.InitializeAsync();

    // アバターを更新
    var avatarCoordinator = avatar.GetComponent<AvatarCoordinator>();
    yield return avatarCoordinator.LoadAsync();
}

プラットフォーム別の情報

iOS

Assets > Plugins > iOS > Avatar Play 以下に配置されるネイティブプラグイン AVTiOSService.mm に、iOS特有の処理が実装されています。

SafariServices の有効化

SafariViewController を利用するために、Xcodeで SafariService.framework をリンクするよう設定してください。

Xcodeの設定

カスタムURLの受信を自社アプリで実装する場合

AVTiOSService.mm にはカスタムURLを受信する処理が実装されています。カスタムURLの受信処理を他の用途でも実装している場合、AVTiOSService.mm の実装を無効にし、自社アプリ側で受信処理を実装します。

//if you need to handle custom url by yourself,
//change AVT_SHOULD_HANDLE_CUSTOM_URL's value to 0
#define AVT_SHOULD_HANDLE_CUSTOM_URL 0

自社アプリの onOpenURLdidFinishLaunching の実装の中で、 SetAvatarSDKOAuthCallbackURL([url UTF8String]) を呼び出してください。引数には、カスタムURLをそのまま渡します。

#pragma AppDelegateListener
//handling custom URL if app is launched
- (void)onOpenURL:(NSNotification*)notification {
    if ([notification userInfo][@"url"]) {
        NSString * url = [[notification userInfo][@"url"] absoluteString];
        SetAvatarSDKOAuthCallbackURL([url UTF8String]);
    }
}

#pragma LifeCycleListener
//handling custom URL if app isn't launched
- (void)didFinishLaunching:(NSNotification*)notification {
    if ([notification userInfo][UIApplicationLaunchOptionsURLKey]) {
        NSString *url = [[notification userInfo][UIApplicationLaunchOptionsURLKey] absoluteString];
        SetAvatarSDKOAuthCallbackURL([url UTF8String]);
    }
}


最終更新日: 2021-12-27