Unity用SDK / アプリケーション側でSDKを統合する

アプリケーション側でSDKを統合する

  1. ログインシステムやゲーム内ストアなど、アプリケーションの各ページのインターフェイスをデザインします。
  2. SDKメソッドを使用して、アプリケーションのロジックに応じたイベント処理を設定します。SDKの基本的な機能を使い始めるには、以下のステップバイステップのチュートリアルに従います。

Note
Unityに関する説明に従って独自のソリューションを作成することもできますし、デモシーンをテンプレートとして使用することもできます。デモシーンのUIを自分のアプリケーションに合わせるには、UIビルダーを使います。
以下のステップバイステップのチュートリアルに従って、SDKの基本的な機能を使ってみましょう。

ユーザー名/メールとパスワードによるユーザーログイン

この説明では、SDKのメソッドを使用して実装する方法を示します:

  • ユーザー登録
  • 登録確認メールの再送依頼
  • ユーザーログイン
  • ユーザーパスワードリセット

ユーザーの認証は、ユーザー名またはメールアドレスで行うことができます。以下の例では、ユーザー名でユーザーを認証し、メールアドレスは登録の確認やパスワードのリセットに使用します。

Note
ログインウィジェットをサイト(ウェブストアなど)で使用する場合は、サイトとアプリケーションで同じユーザー認証方法を実装していることを確認してください。デフォルトでは、ウィジェットは認証に電子メールアドレスを使用します。ユーザー名によるユーザーログインを設定するには、アカウントマネージャーにお問い合わせください。

例題の論理とインターフェースは、お客様のアプリケーションでの使用よりも複雑ではありません。認証システムの実装方法は、デモプロジェクトで紹介されています。

ユーザー登録を実装する

このチュートリアルでは、以下のロジックの実装について説明します:

ページのインターフェースを作成する

登録ページのシーンを作り、そこに以下の要素を追加します:

  • ユーザー名欄
  • ユーザーEメールアドレス欄
  • ユーザーパスワード欄
  • 登録ボタン

次の図は、ページ構成の例です。

ページコントローラーを作成する

  1. MonoBehaviour基底クラスを継承したスクリプトRegistrationPageを作成します。
  2. ページインターフェース要素の変数を宣言し、Inspectorパネルでその値を設定します。
  3. 登録をクリックする処理にロジックを追加します:

    1. Startメソッドで、クリックイベントを購読します。
    2. ボタンをクリックした後に呼び出される匿名メソッドを追加します。
    3. このメソッドで、usernameemailpasswordの各変数を宣言し、ページ上のフィールドの値で初期化します。
    4. XsollaAuth.Instance.Register SDKメソッドを呼び出して、usernameemail、およびpasswordの各変数、ページ上のフィールドの値を渡します:

      • OnSuccess — 登録が成功した場合に呼び出される
      • OnError — エラーが発生した場合に呼び出される

Note

スクリプトの例では、OnSuccessOnErrorメソッドは標準のDebug.Logメソッドを呼び出します。エラーコードと説明は、errorパラメータに渡されます。

登録メールの再送リクエストのページを開いたり、登録が成功した場合にログインページを開くなど、他のアクションを追加することができます。

登録ページのスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Recipes
{
    public class RegistrationPage : MonoBehaviour
    {
        // Declaration of variables for UI elements on the page

        [SerializeField] private InputField UsernameInput;

        [SerializeField] private InputField EmailInputField;

        [SerializeField] private InputField PasswordInputField;

        [SerializeField] private Button RegisterButton;

        private void Start()
        {
            // Handling the button click
         RegisterButton.onClick.AddListener(() =>
            {
                var username = UsernameInput.text;
                var email = EmailInputField.text;
                var password = PasswordInputField.text;

                XsollaAuth.Instance.Register(username, email, password, onSuccess: OnSuccess, onError: OnError);
            });
        }

        private void OnSuccess()
        {
            UnityEngine.Debug.Log("Registration successful");
            // Some actions
     }

        private void OnError(Error error)
        {
            UnityEngine.Debug.Log($"Registration failed. Description: {error.errorMessage}");
            // Some actions
     }
    }
}

登録の確認メールを設定する

登録に成功すると、ユーザーは指定したアドレスに登録確認メールを受け取ります。パブリッシャーアカウントで、ユーザーに送られるメールはカスタマイズできます。

Androidアプリケーションを開発している場合、ユーザーが登録を確認した後、アプリケーションに戻るためのディープリンクをセットアップします。

Note
お客様のセキュリティ基準で許可されている場合は、電子メールアドレスによる登録確認を無効にすることができます。無効にするには、アカウントマネージャーに連絡するか、am@xsolla.comまでご連絡ください。

登録確認メールの再送依頼を実装する

このチュートリアルでは、以下のロジックの実装について説明します:

ページのインターフェースを作成する

確認メールの再送信依頼があるページのシーンを作り、そこに以下の要素を追加します:

  • ユーザー名/メールアドレス欄
  • メール再送信ボタン

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviour基底クラスを継承したスクリプトResendConfirmationEmailを作成します。
  2. ページインターフェース要素の変数を宣言し、Inspectorパネルでその値を設定します。
  3. メール再送信ボタンをクリックする処理にロジックを追加します:

    1. Startメソッドで、クリックイベントを購読します。
    2. ボタンをクリックした後に呼び出される匿名メソッドを追加します。
    3. このメソッドでは、username変数を宣言し、ページ上のフィールドの値で初期化します。
    4. XsollaAuth.Instance.ResendConfirmationLinkのSDKメソッドを呼び出し、username変数とOnSuccessおよびOnErrorメソッドを渡します。

メール再送ページのスクリプト例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Recipes
{
    public class ResendConfirmationEmail : MonoBehaviour
    {
        // Declaration of variables for UI elements on the page

        [SerializeField] private InputField UsernameInput;

        [SerializeField] private Button ResendEmailButton;

        private void Start()
        {
            // Handling the button click
         ResendEmailButton.onClick.AddListener(() =>
            {
                var username = UsernameInput.text;

                XsollaAuth.Instance.ResendConfirmationLink(username, onSuccess: OnSuccess, onError: OnError);
            });
        }

        private void OnSuccess()
        {
            UnityEngine.Debug.Log("Resend confirmation email successful");
            // Some actions
     }

        private void OnError(Error error)
        {
            UnityEngine.Debug.Log($"Resend confirmation email failed. Description: {error.errorMessage}");
            // Some actions
     }
    }
}

リクエストが成功した場合、ユーザーは登録時に指定したメールアドレスに登録確認メールを受け取ります。

ユーザーログインを実装する

このチュートリアルでは、以下のロジックの実装について説明します:

ページのインターフェースを作成する

ログインページのシーンを作成し、そこに以下の要素を追加します:

  • ユーザー名欄
  • パスワード欄
  • ログイン状態を保存するチェックボックス
  • ログインボタン

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviour基底クラスを継承したスクリプトAutorizationPageを作成します。
  2. ページインターフェース要素の変数を宣言し、Inspectorパネルでその値を設定します。
  3. ログインボタンをクリックする処理にロジックを追加します:

    1. Startメソッドで、クリックイベントを購読します。
    2. ボタンをクリックした後に呼び出される匿名メソッドを追加します。
    3. このメソッドでは、username>とpasswordという変数を宣言し、ページ上のフィールドの値で初期化します。rememberMe変数を作成し、アカウントを記憶するためのチェックボックスの状態で初期化します。
    4. XsollaAuth.Instance.SignInのSDKメソッドを呼び出し、usernamepasswordrememberMeの各変数およびOnSuccessOnErrorの各メソッドを渡します。

Note
ユーザーのログインが成功すると、認証トークンがtokenパラメータに渡されます。認証トークンは、エクソラサーバへのリクエストで使用されます。

ログインページのスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Recipes
{
    public class AuthorizationPage : MonoBehaviour
    {
        // Declaration of variables for UI elements on the page

        [SerializeField] private InputField UsernameInput;

        [SerializeField] private InputField PasswordInputField;

        [SerializeField] private Toggle RememberMeToggle;

        [SerializeField] private Button AuthorizationButton;

        private void Start()
        {
            // Handling the button click

            AuthorizationButton.onClick.AddListener(() =>
            {
                var username = UsernameInput.text;
                var password = PasswordInputField.text;
                var rememberMe = RememberMeToggle.isOn;

                XsollaAuth.Instance.SignIn(username, password, rememberMe, null, onSuccess: OnSuccess, onError: OnError);
            });
        }

        private void OnSuccess(string token)
        {
            UnityEngine.Debug.Log($"Authorization successful. Token: {token}");
            // Some actions
     }

        private void OnError(Error error)
        {
            UnityEngine.Debug.Log($"Authorization failed. Description: {error.errorMessage}");
            // Some actions
     }
    }
}

パスワードリセットを実装する

このチュートリアルでは、以下のロジックの実装について説明します:

ページのインターフェースを作成する

パスワードリセットページのシーンを作成し、以下の要素をページに追加します:

  • ユーザー名/メールアドレス欄
  • パスワードリセットボタン

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviour基底クラスを継承したスクリプトResetPasswordPageを作成します。
  2. ページインターフェース要素の変数を宣言し、Inspectorパネルでその値を設定します。
  3. パスワードリセットボタンをクリックする処理にロジックを追加します:

    1. Startメソッドで、クリックイベントを購読します。
    2. ボタンがクリックされた後に呼び出される匿名メソッドを追加します。
    3. このメソッドでは、username変数を宣言し、ページ上のフィールドの値で初期化します。
    4. XsollaAuth.Instance.ResetPasswordのSDKメソッドを呼び出し、username変数とOnSuccessおよびOnErrorメソッドを渡します。

パスワードリセットページのスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Recipes
{
    public class ResetPasswordPage : MonoBehaviour
    {
        // Declaration of variables for UI elements on the page

        [SerializeField] private InputField UsernameInput;

        [SerializeField] private Button ResetPasswordButton;

        private void Start()
        {
            // Handling the button click

            ResetPasswordButton.onClick.AddListener(() =>
            {
                var username = UsernameInput.text;

                XsollaAuth.Instance.ResetPassword(username, null, OnSuccess, OnError);
            });
        }

        private void OnSuccess()
        {
            UnityEngine.Debug.Log("Password reset successful");
            // Some actions
     }

        private void OnError(Error error)
        {
            UnityEngine.Debug.Log($"Password reset failed. Description: {error.errorMessage}");
            // Some actions
     }
    }
}

パスワード再設定のリクエストに成功すると、ユーザーにパスワード再設定用のリンクが記載されたメールが送信されます。パブリッシャーアカウント>ログインプロジェクト>一般設定> URL>コールバックURLで、認証に成功した後、電子メールによる確認、またはパスワードのリセット後に、ユーザーがリダイレクトされるURLアドレスまたはパスを設定することができます。

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

ソーシャルログイン

このガイドでは、SDKメソッドを使用して、ユーザーのサインアップとソーシャルネットワークアカウントによるログインを実装する方法を紹介します。

ユーザー名/ユーザーのメールアドレスとパスワードによるユーザー認証とは異なり、ユーザーのサインアップのために別のロジックを実装する必要はありません。ユーザーの初回ログインがソーシャルネットワーク経由の場合、新しいアカウントが自動的に作成されます。

別の認証方法としてアプリケーションにソーシャルログインを実装している場合、以下の条件を満たすと、ソーシャルネットワークアカウントは既存のユーザーアカウントに自動的にリンクします。

  • ユーザー名/メールアドレスとパスワードでサインアップしたユーザーが、ソーシャルネットワークアカウントを介してアプリケーションにログインしました。
  • ソーシャルネットワークでは、メールアドレスを返します。
  • ソーシャルネットワークでのユーザーのメールアドレスは、アプリケーションで登録に使用したメールアドレスと同じです。

Note
ソーシャルネットワークアカウントの手動リンクを実装できます。ユーザーがソーシャルネットワークアカウントを自分のアカウントにリンクできるページを、アプリケーションに追加します。ページコントローラで、LinkSocialProvider SDKメソッドを使用します。

このチュートリアルでは、以下のロジックの実装について説明します:

この例では、Twitterアカウントによるユーザーログインを設定しています。すべてのソーシャルネットワークを同じ方法で設定できます。

例題の論理とインターフェースは、お客様のアプリケーションでの使用よりも複雑ではありません。認証システムの実装方法は、デモプロジェクトで紹介されています。

ページのインターフェースを作成する

ログインページのシーンを作成し、そこにソーシャルログインボタンを追加します。次の図は、ページ構成の例です。

ページコントローラーを作成する

  1. MonoBehaviour基底クラスを継承したSocialAuthorizationPageスクリプトを作成します。
  2. アプリケーションのログインページインターフェース要素の変数を宣言し、Inspectorパネルでその値を設定します。
  3. ログインボタンをクリックする処理にロジックを追加します:

    1. Startメソッドで、クリックイベントを購読します。
    2. ボタンをクリックした後に呼び出される匿名メソッドを追加します。
    3. ログインページのURLを渡すには、匿名メソッドでurl変数を宣言します。SocialProviderパラメータにFacebookの値を渡して、GetSocialNetworkAuthUrl SDKメソッドでこの変数を初期化します。
    4. ブラウザを開くには、BrowserHelper.Instance.Openメソッドを呼び出します。ビルドインのブラウザーを使用するには、url変数とtrue値をメソッドに渡します。

Note
ソーシャルログインは、外部のブラウザでは利用できません。SDKには、エクソラが開発した組み込みブラウザが含まれています。エクソラのビルトインブラウザまたは他のビルトインブラウジングソリューションのいずれかを使用することができます。

    1. トークンを取得してブラウザを閉じるために、ユーザー登録が成功した後のページURLの変化を追跡します:
      1. singlePageBrowser変数を宣言し、BrowserHelper.Instance.GetLastBrowser SDKメソッドで初期化します。
      2. アクティブページのURL変更イベントを受信し、ハンドラとしてOnUrlChangedメソッドを設定します。

  1. トークンの取得を実装します:
    1. OnUrlChangedメソッドで渡されたアクティブページのURLを解析するために、ParseUtils.TryGetValueFromUrlユーティリティーメソッドを使用します。
    2. アクティブページのURLに認証コードが含まれているかどうかをチェックする機能を追加します。ParseUtils.TryGetValueFromUrlメソッドは、code変数で認証コードを渡します。
    3. 認証コードをトークンと交換するには、ExchangeCodeToToken SDKメソッドを呼び出し、code変数と以下のメソッドを渡します:
      • OnSuccess — 登録が成功した場合に呼び出される
      • OnError — エラーが発生した場合に呼び出される

Note

スクリプトの例では、OnSuccessOnErrorメソッドは標準のDebug.Logメソッドを呼び出します。他のアクションを追加することができます。

ユーザーがログインに成功すると、認証トークンがtokenパラメータで渡されます。このトークンは、エクソラサーバへのリクエストで使用されます。エラーが発生した場合は、そのコードと説明がerrorパラメータに渡されます。

    1. トークンを取得したら、ブラウザでゲームオブジェクトを削除します。

ログインページのスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Recipes
{
    public class SocialAuthorizationPage : MonoBehaviour
    {
        // Declaration of variables for UI elements on the page

        [SerializeField] private Button FacebookButton;

        private void Start()
        {
            // Handling the button click

            FacebookButton.onClick.AddListener(() =>
            {
                // Opening browser

                var url = XsollaAuth.Instance.GetSocialNetworkAuthUrl(SocialProvider.Facebook);
                BrowserHelper.Instance.Open(url, true);

                // Determining the end of authentication
             BrowserHelper.Instance.InAppBrowser.AddUrlChangeHandler(OnUrlChanged);
            });
        }

        // Getting token
     private void OnUrlChanged(string url)
        {
            if (ParseUtils.TryGetValueFromUrl(url, ParseParameter.code, out var code))
            {
                XsollaAuth.Instance.ExchangeCodeToToken(code, OnSuccess, OnError);
                Destroy(BrowserHelper.Instance.gameObject);
            }
        }

        private void OnSuccess(string token)
        {
            UnityEngine.Debug.Log($"Authorization successful. Token: {token}");
            // Some actions
     }

        private void OnError(Error error)
        {
            UnityEngine.Debug.Log($"Authorization failed. Description: {error.errorMessage}");
            // Some actions
     }
    }
}

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

アイテムカタログの表示

このチュートリアルでは、SDKメソッドを使って、ゲーム内ストアに以下のアイテムを表示する方法を紹介します:

  • 仮想アイテム
  • 仮想アイテムのグループ
  • バンドル
  • 仮想通貨のパッケージ

始める前に、パブリッシャーアカウントの項目を設定します:

  1. バーチャルアイテムとバーチャルアイテムのグループを設定します
  2. 仮想通貨のパッケージを設定します
  3. バンドルを設定します

このチュートリアルでは、以下のロジックの実装について説明します:

例のロジックとインターフェイスは、アプリケーションよりも複雑ではありません。ゲーム内ストアの実装オプションで可能なアイテムカタログについては、デモプロジェクトで説明しています。

Note

カタログ内のすべてのアイテムの例は次のとおり:

  • アイテム名
  • アイテム説明
  • アイテム価格
  • 画像

また、アイテムに関する他の情報がゲーム内ストアに保存されている場合は、その情報を表示することもできます。

仮想アイテムの表示を実装する

アイテムウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • アイテムの背景画像
    • アイテム名
    • アイテムの説明
    • アイテムの価格
    • アイテムの画像

次の図は、ウィジェットの構造の一例です。

アイテムウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualItemWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualItemWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Image IconImage;
    }
}

アイテムのリストを表示するページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • アイテムウィジェットの表示エリア

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualItemsPageスクリプトを作成します。
  2. 以下の変数を宣言します:
    • WidgetsContainer — ウィジェットのコンテナ
    • WidgetPrefab — アイテムウィジェットのプレハブ

  1. ページゲームオブジェクトにスクリプトを添付します:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add ComponentをクリックしてVirtualItemsPageスクリプトを選択します。
  2. Inspectorパネルで変数の値を設定します。

  1. Startメソッドで、XsollaAuth.Instance.SignIn SDKメソッドを呼び出してログインロジックを追加して、以下のことを渡します:
    • usernameパラメータのユーザー名またはメールアドレス
    • passwordパラメータのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. アイテムのリストを取得するためのロジックを追加します。OnAuthenticationSuccessメソッドで、XsollaCatalog.Instance.GetCatalog SDKメソッドを呼び出して、以下のことを渡します:
    • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

    • アイテムのリストの取得に成功した場合のOnItemsRequestSuccess
    • エラーが発生した場合のOnErrorコールバックメソッド
    • offsetパラメーターのリストの最初の項目に基づくオフセット
    • limitパラメーターにロードされたアイテムの数

Note
offsetlimitのパラメータは必須ではありません。それらを使用してページネーションを実装します — カタログ内のアイテムのページごとの表示。ページ内の最大アイテム数は50です。カタログに50を超えるアイテムがある場合は、ページネーションが必要です。

  1. OnItemsRequestSuccessメソッドで、受信したすべてのアイテムのウィジェットを作成するためのロジックを追加します:
    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したVirtualItemWidgetコンポーネントをwidget変数にアタッチします。

  1. 以下のデータをアイテムウィジェットに渡します:
    1. storeItem.name変数値をアイテム名の要素に渡します。
    2. アイテムの説明が書かれた要素にstoreItem.description変数の値を渡します。
    3. アイテムの価格を表示するために、以下のロジックを実装します:
      • storeItem.price変数の値が、nullと一致しない場合、アイテムは実際通貨で販売されます。価格を{amount} {currency}の形式で指定し、ウェジット要素に渡します。
      • storeItem.virtual_prices変数の値が、nullと一致しない場合、アイテムは仮想通貨で販売されます。価格を{name}: {amount}の形式で指定し、ウェジット要素に渡します。

Note
storeItem.virtual_prices変数は、同じアイテムの異なる通貨での価格の配列です。この例では、パブリッシャーアカウントのストア > 仮想アイテムのアイテム設定で、デフォルトで指定されている価格を示しています。

    1. アイテムの画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用し、以下のことを渡します:
      • 画像URL。
      • コールバックとしての無名関数です。この関数では,受信したスプライトをアイテム画像として追加します。

ページコントローラースクリプトの例:

Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Recipes
{
    public class VirtualItemsPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs

        public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process

            XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, null, OnAuthenticationSuccess, OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for catalog from store

            XsollaCatalog.Instance.GetCatalog(XsollaSettings.StoreProjectId, OnItemsRequestSuccess, OnError, offset: 0, limit: 50);
        }

        private void OnItemsRequestSuccess(StoreItems storeItems)
        {
            // Iterating the items collection and assign values for appropriate ui elements

            foreach (var storeItem in storeItems.items)
            {
                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<VirtualItemWidget>();

                widget.NameText.text = storeItem.name;
                widget.DescriptionText.text = storeItem.description;

                if (storeItem.price != null)
                {
                    var realMoneyPrice = storeItem.price;
                    widget.PriceText.text = $"{realMoneyPrice.amount} {realMoneyPrice.currency}";
                }
                else if (storeItem.virtual_prices != null)
                {
                    var virtualCurrencyPrice = storeItem.virtual_prices.First(x => x.is_default);
                    widget.PriceText.text = $"{virtualCurrencyPrice.name}: {virtualCurrencyPrice.amount}";
                }

                ImageLoader.Instance.GetImageAsync(storeItem.image_url, (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

次の写真は、スクリプトの作業の結果です。

仮想アイテムグループの表示を実装する

アイテムウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • アイテムの背景画像
    • アイテム名
    • アイテムの説明
    • アイテムの価格
    • アイテムの画像

次の図は、ウィジェットの構造の一例です。

アイテムウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualItemWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualItemWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Image IconImage;
    }
}

アイテムのグループを開くボタンのウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグしてプレハブに変換します。
  3. 作成したプレハブを選択し、InspectorパネルでOpen Prefabをクリックします。
  4. アイテムのグループをプレハブの子オブジェクトとして表示するボタンを追加し、そのビジュアルを設定します。

次の図は、ウィジェットの構造の一例です。

アイテムのグループを開くボタンのスクリプトを作成する

  1. MonoBehaviourベースクラスから継承したVirtualItemGroupButtonスクリプトを作成します。
  2. アイテムのグループを開くボタンの変数を宣言し、Inspectorパネルに変数の値を設定します。
  3. プレハブのルートオブジェクトにスクリプトを追加します:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add Componentをクリックし、VirtualItemGroupButtonスクリプトを選択します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualItemGroupButton : MonoBehaviour
    {
        // Declaration of variables for UI elements
     public Text NameText;

        public Button Button;
    }
}

アイテムのリストを表示するページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • アイテムグループボタン表示エリア
    • アイテムウェジットボタン表示エリア

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviourベースクラスから継承したVirtualItemsByGroupsPageスクリプトを作成します。
  2. 変数を宣言します:
    • GroupButtonsContainer — グループボタンのコンテナ
    • GroupButtonPrefab — ボタンプレハブ
    • ItemWidgetsContainer — アイテムウィジェットのコンテナ
    • WidgetPrefab — アイテムウィジェットプレハブ

  1. ページゲームオブジェクトにスクリプトをアタッチします:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add Componentをクリックして、VirtualItemsByGroupsPageスクリプトを選択します。
  2. Inspectorパネルで変数の値を設定します。
  3. StartメソッドでXsollaAuth.Instance.SignIn SDKメソッドを呼び出すことでログインロジックを追加し、以下のことを渡します:
    • usernameパラメータでのユーザー名またはメールアドレス
    • passwordパラメータでのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. アイテムのリストを取得するためのロジックを追加します。OnAuthenticationSuccessメソッドで、XsollaCatalog.Instance.GetCatalog SDKメソッドを呼び出して、以下のことを渡します:
    • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

    • アイテムのリストの取得に成功した場合のOnItemsRequestSuccess
    • エラーが発生した場合のOnErrorコールバックメソッド
    • offsetパラメーターのリストの最初の項目に基づくオフセット
    • limitパラメーターにロードされたアイテムの数

Note
offsetlimitのパラメータは必須ではありません。それらを使用してページネーションを実装します — カタログ内のアイテムのページごとの表示。ページ内の最大アイテム数は50です。カタログに50を超えるアイテムがある場合は、ページネーションが必要です。

  1. OnItemsRequestSuccessメソッドで、アイテムグループのリストを作成するためのロジックを追加します:
    1. 受信したアイテムリストからユニークグループのリストを取得します。そこに、カテゴリーに依存しないすべてのアイテムを表示するAll要素を追加します。
    2. 子オブジェクトをすべて削除して、ボタンコンテナをクリアします。これを行うには、DeleteAllChildrenメソッドを呼び出し、コンテナオブジェクトを渡します。
    3. すべてのアイテムグループに対するには:

      1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
      2. 受信したVirtualItemGroupButtonコンポーネントをgroupButton変数に設定します。
      3. groupName>変数値をグループ名の要素に渡します。
      4. 翻译结果ボタンをクリックするアクションに無名のメソッドを追加します。このメソッドでは、OnGroupSelectedメソッドを呼び出し、パラメータとしてアイテムグループの名とアイテムのリストを渡します。

    1. すべてのアイテムを表示するには、OnGroupSelectedメソッドを呼び出し、グループ名としてAllを渡します。

  1. OnGroupSelectedメソッドで、アイテムの初期表示用のロジックを追加します:
    1. itemsForDisplay変数を作成し、アイテムグループの名前にAllが付いている場合は、受け取ったすべてのアイテムをこの変数に割り当てます。それ以外の場合は、グループ名がgroupName変数と一致するアイテムをitemsForDisplay変数にリンクします。
    2. 子オブジェクトをすべて削除して、ボタンコンテナをクリアします。これを行うには、DeleteAllChildrenメソッドを呼び出し、コンテナオブジェクトを渡します。

  1. 受信したすべてのアイテムのウィジェットを作成するためのロジックを追加します。
    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したVirtualItemWidgetコンポーネントをwidget変数にアタッチします。

  1. 以下のデータをアイテムウィジェットに渡します:
    1. アイテム名を持つ要素にstoreItem.nameの変数値を渡します。
    2. storeItem.descriptionの変数値を、アイテムの説明を持つ要素に渡します。
    3. アイテムの価格を表示するために、以下のロジックを実装します:

      • storeItem.price変数の値が、nullと一致しない場合、アイテムは実際通貨で販売されています。価格を{amount} {currency}形式で指定し、ウェジット要素に渡します。
      • storeItem.virtual_prices変数の値が、nullと一致しない場合、アイテムは仮想通貨で販売されます。価格を{name}: {amount}形式で指定し、ウェジット要素に渡します。

Note
storeItem.virtual_prices変数は、同じアイテムの異なる通貨での価格の配列です。この例では、パブリッシャーアカウントのストア > 仮想アイテムのアイテム設定で、デフォルトで指定されている価格を示しています。

    1. アイテムの画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用し、以下のことを渡します:
      • 画像URL。
      • コールバックとしての無名関数です。この関数では,受信したスプライトをアイテム画像として追加します。

Copy
Full screen
Small screen
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Recipes
{
    public class VirtualItemsByGroupsPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs
     public Transform GroupButtonsContainer;

        public GameObject GroupButtonPrefab;

        public Transform ItemWidgetsContainer;

        public GameObject ItemWidgetPrefab;

        private void Start()
        {
            // Starting the authentication process
         XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, onSuccess: OnAuthenticationSuccess,
                onError: OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for catalog from store
         XsollaCatalog.Instance.GetCatalog(XsollaSettings.StoreProjectId, OnItemsRequestSuccess, OnError, offset: 0,
                limit: 50);
        }

        private void OnItemsRequestSuccess(StoreItems storeItems)
        {
            // Selecting the group’s name from items and order them alphabetical
         var groupNames = storeItems.items
                .SelectMany(x => x.groups)
                .GroupBy(x => x.name)
                .Select(x => x.First())
                .OrderBy(x => x.name)
                .Select(x => x.name)
                .ToList();

            // Add group name for “all groups”, which will mean show all items regardless of group affiliation
         groupNames.Insert(0, "All");

            // Clear container
         DeleteAllChildren(GroupButtonsContainer);

            // Iterating the group names and creating ui-button for each
         foreach (var groupName in groupNames)
            {
                var buttonObj = Instantiate(GroupButtonPrefab, GroupButtonsContainer, false);
                var groupButton = buttonObj.GetComponent<VirtualItemGroupButton>();

                groupButton.NameText.text = groupName;
                groupButton.Button.onClick.AddListener(() => OnGroupSelected(groupName, storeItems));
            }

            // Calling method for redraw page
         OnGroupSelected("All", storeItems);
        }

        private void OnGroupSelected(string groupName, StoreItems storeItems)
        {
            // Declaring variable for items which will display on page
         IEnumerable<StoreItem> itemsForDisplay;
            if (groupName == "All")
            {
                itemsForDisplay = storeItems.items;
            }
            else
            {
                itemsForDisplay = storeItems.items.Where(item => item.groups.Any(group => group.name == groupName));
            }

            // Clear container
         DeleteAllChildren(ItemWidgetsContainer);

            // Iterating the items collection and assign values for appropriate ui elements
         foreach (var storeItem in itemsForDisplay)
            {
                var widgetGo = Instantiate(ItemWidgetPrefab, ItemWidgetsContainer, false);
                var widget = widgetGo.GetComponent<VirtualItemWidget>();

                widget.NameText.text = storeItem.name;
                widget.DescriptionText.text = storeItem.description;

                if (storeItem.price != null)
                {
                    var realMoneyPrice = storeItem.price;
                    widget.PriceText.text = $"{realMoneyPrice.amount} {realMoneyPrice.currency}";
                }
                else if (storeItem.virtual_prices != null)
                {
                    var virtualCurrencyPrice = storeItem.virtual_prices.First(x => x.is_default);
                    widget.PriceText.text = $"{virtualCurrencyPrice.name}: {virtualCurrencyPrice.amount}";
                }

                ImageLoader.Instance.GetImageAsync(storeItem.image_url,
                    (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        // Utility method for delete all children of container
     private static void DeleteAllChildren(Transform parent)
        {
            var childList = parent.Cast<Transform>().ToList();
            foreach (var childTransform in childList)
            {
                Destroy(childTransform.gameObject);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

ページコントローラースクリプトの例:

バンドルの表示を実装する

バンドルウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:

    • ウィジェットの背景画像
    • バンドル名
    • バンドル説明
    • バンドル価格
    • バンドルコンテンツの説明(アイテムとその数量)
    • バンドル画像

次の図は、ウィジェットの構造の一例です。

ウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したBundleWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class BundleWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements
     public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Text ContentText;

        public Image IconImage;
    }
}

バンドルを表示するページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • バンドルウィジェットの表示エリア

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviourベースクラスを継承したBundlesPageスクリプトを作成します。
  2. 変数を宣言します:
    • WidgetsContainer — バンドルウィジェットのコンテナ
    • WidgetPrefab — バンドルウィジェットプレハブ

  1. ページゲームオブジェクトにスクリプトをアタッチします:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add ComponentをクリックしてBundlesPageスクリプトを選択します。

  1. Inspectorパネルで変数を設定します。
  2. Startメソッドの中でXsollaAuth.Instance.SignIn SDKメソッドを呼び出してパスすることでログインロジックを追加し、以下のことを渡します:
    • usernameパラメータでのユーザー名またはメールアドレス
    • passwordパラメータでのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. バンドルのリストを取得するためのロジックを追加します。OnAuthenticationSuccessメソッドで、XsollaCatalog.Instance.GetBundles SDKメソッドを呼び出して、以下のことを渡します:
    • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

    • バンドルのリストを取得する操作を成功させるためのOnItemsRequestSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. OnBundlesRequestSuccessメソッドで、受信したすべてのバンドルのウィジェットを作成するためのロジックを追加します:
    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したBundleWidgetコンポーネントをwidget変数にアタッチします。

  1. バンドルウィジェットに以下のデータを渡します:
    1. bundleItem.nameの変数値をアイテム名の要素に渡します。
    2. bundleItem.descriptionの変数値を、アイテムの説明を持つ要素に渡します。
    3. バンドルコンテンツを表示するために、以下のロジックを実装します:
      1. バンドル内のすべてのアイテムを使用して、アイテム名とその数量を含むラインを形成します。行は、{name} x {quantity}の形式でなければなりません。
      2. 改行文字をセパレーターにして、これらの行を1行にまとめます。
      3. 新しい行をウィジェット要素に渡します。

    1. バンドル価格を表示するために、以下のロジックを実装します:
      • bundleItem.price変数の値が、nullと一致しない場合、バンドルは実際通貨で販売されます。価格を{amount} {currency}の形式で指定し、ウェジット要素に渡します。
      • bundleItem.virtual_prices変数の値が、nullと一致しない場合、バンドルは実際通貨で販売されます。価格を{name}: {amount}の形式で指定し、ウェジット要素に渡します。

Note
bundleItem.virtual_prices変数は、同じバンドルの異なる通貨での価格の配列です。この例では、パブリッシャーアカウントのストア > バンドルのアイテム設定で、デフォルトで指定されている価格を示しています。

    1. アイテムの画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用し、以下のことを渡します
      • 画像URL。
      • コールバックとしての無名関数です。この関数では,受信したスプライトをバンドル画像として追加します。

ページコントローラースクリプトの例:

Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Recipes
{
    public class BundlesPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs
     public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process
         XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, onSuccess: OnAuthenticationSuccess, onError: OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for bundles from store
         XsollaCatalog.Instance.GetBundles(XsollaSettings.StoreProjectId, OnBundlesRequestSuccess, OnError);
        }

        private void OnBundlesRequestSuccess(BundleItems bundleItems)
        {
            // Iterating the bundles collection and assign values for appropriate ui elements
         foreach (var bundleItem in bundleItems.items)
            {
                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<BundleWidget>();

                widget.NameText.text = bundleItem.name;
                widget.DescriptionText.text = bundleItem.description;

                var bundleContent = bundleItem.content.Select(x => $"{x.name} x {x.quantity}");
                widget.ContentText.text = string.Join("\n", bundleContent);

                if (bundleItem.price != null)
                {
                    var realMoneyPrice = bundleItem.price;
                    widget.PriceText.text = $"{realMoneyPrice.amount} {realMoneyPrice.currency}";
                }
                else if (bundleItem.virtual_prices != null)
                {
                    var virtualCurrencyPrice = bundleItem.virtual_prices.First(x => x.is_default);
                    widget.PriceText.text = $"{virtualCurrencyPrice.name}: {virtualCurrencyPrice.amount}";
                }

                ImageLoader.Instance.GetImageAsync(bundleItem.image_url,
                    (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

次の写真は、スクリプトの作業の結果です。

仮想通貨パッケージの表示を実装する

仮想通貨パッケージのウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:

    • ウィジェットの背景画像
    • パッケージ名
    • パッケージ説明
    • パッケージ価格
    • パッケージ画像

次の図は、ウィジェットの構造の一例です。

ウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualCurrencyPackageWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualCurrencyPackageWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Image IconImage;
    }
}

仮想通貨パッケージのリストを表示するページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • 仮想通貨パッケージウィジェットの表示エリア

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviourベースクラスを継承したVirtualCurrencyPackagesPageスクリプトを作成します。
  2. 変数を宣言します:
    • WidgetsContainer — ウィジェットのコンテナ
    • WidgetPrefab — 仮想通貨パッケージプレハブ

  1. ページゲームオブジェクトにスクリプトをアタッチします:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add Componentをクリックして、VirtualCurrencyPackagesPageスクリプトを選択します。
  2. Inspectorパネルで変数の値を設定します。
  3. XsollaAuth.Instance.SignIn SDKのメソッドをStartメソッドで呼び出してログインロジックを追加し、以下のことを渡します:

    • usernameパラメータでのユーザー名またはメールアドレス
    • passwordパラメータでのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. アイテムのリストを取得するためのロジックを追加します。OnAuthenticationSuccessメソッドで、XsollaCatalog.Instance.GetVirtualCurrencyPackagesList SDKメソッドを呼び出して、以下のことを渡します:
    • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

    • アイテムのリストを取得する操作を成功させるためのOnItemsRequestSuccess
    • エラーのOnErrorコールバックメソッド

  1. OnPackagesRequestSuccessメソッドで、受信したすべてのパッケージのウィジェットを作成するためのロジックを追加します:
    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したVirtualCurrencyPackageWidgetコンポーネントをwidget変数にアタッチします。

  1. パッケージウィジェットに以下のデータを渡します:
    1. パッケージ名を持つ要素にpackageItem.nameの変数値を渡します。
    2. packageItem.descriptionの変数値をパッケージの説明を持つ要素に渡します。
    3. パッケージの価格を表示するために、以下のロジックを実装します:

      • packageItem.price変数の値が、nullと一致しない場合、パッケージは実際通貨で販売されています。価格を{amount} {currency}形式で指定し、ウェジット要素に渡します。
      • packageItem.virtual_prices変数の値が、nullと一致しない場合、パッケージは仮想通貨で販売されます。価格を{name}: {amount}形式で指定し、ウェジット要素に渡します。

Note
packageItem.virtual_prices変数は、同じパッケージの異なる通貨での価格の配列です。この例では、パブリッシャーアカウントのストア > 仮想通貨 > パッケージのパッケージ設定で、デフォルトで指定されている価格を示しています。

    1. アイテムの画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用し、以下のことを渡します:
      • 画像URL。
      • コールバックとしての無名関数です。この関数では,受信したスプライトをアイテム画像として追加します。

ページコントローラースクリプトの例:

Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Recipes
{
    public class VirtualCurrencyPackagesPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs
     public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process
         XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, onSuccess: OnAuthenticationSuccess, onError: OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for packages from store
         XsollaCatalog.Instance.GetVirtualCurrencyPackagesList(XsollaSettings.StoreProjectId, OnPackagesRequestSuccess, OnError);
        }

        private void OnPackagesRequestSuccess(VirtualCurrencyPackages packageItems)
        {
            // Iterating the packages collection and assign values for appropriate ui elements
         foreach (var packageItem in packageItems.items)
            {
                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<VirtualCurrencyPackageWidget>();

                widget.NameText.text = packageItem.name;
                widget.DescriptionText.text = packageItem.description;

                if (packageItem.price != null)
                {
                    var realMoneyPrice = packageItem.price;
                    widget.PriceText.text = $"{realMoneyPrice.amount} {realMoneyPrice.currency}";
                }
                else if (packageItem.virtual_prices != null)
                {
                    var virtualCurrencyPrice = packageItem.virtual_prices.First(x => x.is_default);
                    widget.PriceText.text = $"{virtualCurrencyPrice.name}: {virtualCurrencyPrice.amount}";
                }

                ImageLoader.Instance.GetImageAsync(packageItem.image_url,
                    (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

次の写真は、スクリプトの作業の結果です。

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

仮想アイテムを実際通貨で販売する

この説明では、SDKのメソッドを使用して、実際通貨で仮想アイテムの販売を実装する方法を示します。

始める前に、カタログに仮想アイテムを表示する機能を実装します。以下の例では、仮想アイテムの購入を実装する方法を説明します。他のアイテムタイプの設定も同様です。

このチュートリアルでは、以下のロジックの実装について説明します:

例題のロジックとインターフェイスは、あなたのアプリケーションに比べてそれほど複雑ではありません。実際通貨でアイテムを販売し、アイテムのカタログを表示するための実装オプションの可能性については、デモプロジェクトで説明しています。

アイテムウィジェットを完成する

アイテムウィジェットに購入ボタンを追加し、そのビジュアルを構成します。

次の図は、ウィジェットの構造の一例です。

アイテムウィジェットスクリプトを完成する

  1. VirtualItemWidgetスクリプトを開きます。
  2. 購入ボタン用の変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualItemWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Image IconImage;

        public Button BuyButton;
    }
}

アイテムのリストを表示するページコントローラーを完成する

  1. VirtualItemsPageスクリプトを開きます。
  2. OnAuthenticationSuccessメソッドで、認証トークンをToken.Instance変数に渡します。

Note
以下のいずれかのトークンを使用することができます:

  1. 仮想アイテム購入ボタンをクリックして処理するためのロジックを追加します:
    1. OnItemsRequestSuccessメソッドで、ボタンクリックイベントを購読する。
    2. ボタンがクリックされた後に呼び出される匿名メソッドを追加します。
    3. このメソッドで、XsollaCatalog.Instance.PurchaseItem SDKメソッドを呼び出して注文を作成し、それに渡します:

      • projectIdパラメータでのプロジェクトID
      • itemSkuパラメータでのアイテム識別子
      • アイテム発注書の正常な形成を処理するOnOrderCreateSuccessメソッド
      • エラーのOnErrorコールバックメソッド

  1. 決済ページのオープンを実装します。これを行うには、OnOrderCreateSuccessメソッドを追加し、以下の中で呼び出します:
    • 決済ページを開くにはXsollaOrders.Instance.OpenPurchaseUi SDKメソッド
    • 注文状況の変化を把握するにはTrackOrderStatus コルーチン

Note
デフォルトでは、決済ページは内ビルドインブラウザで開きます。外部ブラウザで開くには、Unity編集器のメインメニューにあるWindow > Xsolla > Edit Settingsに移動し、InspectorパネルのEnable in-app browser?ボックスのチェックを外します。Androidアプリで外部ブラウザを使用する場合は、ユーザーが支払いを行った後にアプリにリダイレクトするように、ディープリンクを設定することをお勧めします。

  1. TrackOrderStatusのコルーチンでは、1秒に1回、注文状況の情報を取得するように実装します。これをするには、XsollaOrders.Instance.CheckOrderStatus SDKメソッドを利用して以下へ渡します:
    • projectIdパラメータでのプロジェクトID
    • orderIdパラメータでの決済詳細からの注文番号
    • 注文ステータス情報の正常な受信を処理するための匿名メソッド
    • エラー処理のための匿名メソッド

  1. 注文状況情報の正常な受信を処理するメソッドで、注文の決済中にOnPurchaseSuccessメソッドのコールバックを実装します(決済ステータスdoneまたはpaid)。
  2. OnPurchaseSuccessメソッドで、成功した仮想アイテム購入の処理を実装します。

Note

スクリプトの例では、アイテムの購入が成功した場合にDebug.Logベースメソッドを呼び出しています。インベントリ表示などの他のアクションも追加できます。

購入したアイテムをインベントリに追加するロジックを実装する必要はなく、自動的に行われます。

  1. 決済ページを開くためにビルドインブラウザを使用している場合は、このブラウザを閉じてください。

ページのスクリプトの例:

Copy
Full screen
Small screen
using System.Collections;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;
using Xsolla.Orders;

namespace Recipes
{
    public class VirtualItemsPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs

        public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process

            XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, onSuccess: OnAuthenticationSuccess, onError: OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for catalog from store
         Token.Instance = Token.Create(token);
            XsollaCatalog.Instance.GetCatalog(XsollaSettings.StoreProjectId, OnItemsRequestSuccess, OnError, offset: 0, limit: 50);
        }

        private void OnItemsRequestSuccess(StoreItems storeItems)
        {
            // Iterating the items collection and assign values for appropriate ui elements

            foreach (var storeItem in storeItems.items)
            {
                if (storeItem.price == null)
                    continue;

                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<VirtualItemWidget>();

                widget.NameText.text = storeItem.name;
                widget.DescriptionText.text = storeItem.description;

                var realMoneyPrice = storeItem.price;
                widget.PriceText.text = $"{realMoneyPrice.amount} {realMoneyPrice.currency}";

                ImageLoader.Instance.GetImageAsync(storeItem.image_url,
                    (url, sprite) => widget.IconImage.sprite = sprite);

                widget.BuyButton.onClick.AddListener(() =>
                {
                    XsollaCatalog.Instance.PurchaseItem(XsollaSettings.StoreProjectId, storeItem.sku, OnOrderCreateSuccess, OnError);
                });
            }
        }

        private void OnOrderCreateSuccess(PurchaseData purchaseData)
        {
            XsollaOrders.Instance.OpenPurchaseUi(purchaseData);
            StartCoroutine(TrackOrderStatus(purchaseData));
        }

        private IEnumerator TrackOrderStatus(PurchaseData purchaseData)
        {
            var isDone = false;
            while (!isDone)
            {
                XsollaOrders.Instance.CheckOrderStatus
                (
                    XsollaSettings.StoreProjectId,
                    purchaseData.order_id,
                    status =>
                    {
                        if (status.status == "paid" || status.status == "done")
                        {
                            isDone = true;
                            OnPurchaseSuccess();
                        }
                    },
                    error => { OnError(error); }
                );

                yield return new WaitForSeconds(1f);
            }
        }

        private void OnPurchaseSuccess()
        {
            UnityEngine.Debug.Log($"Purchase successful");
            BrowserHelper.Instance.Close();
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

仮想アイテムを仮想通貨で販売する

この説明では、SDKのメソッドを使用して、仮想アイテムの仮想通貨への販売を実装する方法を示します。

始める前に、カタログに仮想アイテムを表示する機能を実装します。以下の例では、仮想アイテムの購入を実装する方法を説明します。他のアイテムタイプの設定も同様です。

このチュートリアルでは、以下のロジックの実装について説明します:

例題のロジックとインターフェイスは、あなたのアプリケーションに比べてそれほど複雑ではありません。実際通貨でアイテムを販売し、アイテムのカタログを表示するための実装オプションの可能性については、デモプロジェクトで説明しています。

アイテムウィジェットを完成する

アイテムウィジェットに購入ボタンを追加し、そのビジュアルを構成します。

次の図は、ウィジェットの構造の一例です。

アイテムウィジェットスクリプトを完成する

  1. VirtualItemWidgetスクリプトを開きます。
  2. 購入ボタン用の変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualItemWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text PriceText;

        public Image IconImage;

        public Button BuyButton;
    }
}

アイテムのリストを表示するページコントローラーを完成する

  1. VirtualItemsPageスクリプトを開きます。
  2. OnAuthenticationSuccessメソッドで、認証トークンをToken.Instance変数に渡します。

Note
以下のいずれかのトークンを使用することができます:

  1. 仮想アイテム購入ボタンをクリックして処理するためのロジックを追加します:
    1. OnItemsRequestSuccessメソッドで、ボタンクリックイベントを購読する。
    2. ボタンがクリックされた後に呼び出される匿名メソッドを追加します。
    3. このメソッドで、XsollaCatalog.Instance.PurchaseItem SDKメソッドを呼び出して注文を作成し、それに渡します:

      • projectIdパラメータでのプロジェクトID
      • itemSkuパラメータでのアイテム識別子
      • アイテム発注書の正常な形成を処理するOnOrderCreateSuccessメソッド
      • エラーのOnErrorコールバックメソッド

  1. OnOrderCreateSuccessメソッドで、注文ステータスチェックプロセスを実装します。これをするには、XsollaOrders.Instance.CheckOrderStatus SDKメソッドを利用して以下へ渡します:
    • projectIdパラメータでのプロジェクトID
    • orderIdパラメータでの決済詳細からの注文番号
    • 注文ステータス情報の正常な受信を処理するための匿名メソッド
    • エラー処理のための匿名メソッド

  1. 注文状況情報の正常な受信を処理するメソッドで、注文の決済中にOnPurchaseSuccessメソッドのコールバックを実装します(決済ステータスdoneまたはpaid)。
  2. OnPurchaseSuccessメソッドで、成功した仮想アイテム購入の処理を実装します。

Note

スクリプトの例では、アイテムの購入が成功した場合にDebug.Logベースメソッドを呼び出しています。インベントリの表示仮想通貨の残高変更など、他のアクションを追加することができます。

購入したアイテムをインベントリに追加するロジックを実装する必要はなく、自動的に行われます。

ページのスクリプトの例:

Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;
using Xsolla.Orders;

namespace Recipes
{
    public class VirtualItemsPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs

        public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process

            XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, onSuccess: OnAuthenticationSuccess, onError: OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for catalog from store
         Token.Instance = Token.Create(token);
            XsollaCatalog.Instance.GetCatalog(XsollaSettings.StoreProjectId, OnItemsRequestSuccess, OnError, offset: 0, limit: 50);
        }

        private void OnItemsRequestSuccess(StoreItems storeItems)
        {
            // Iterating the items collection and assign values for appropriate ui elements
         foreach (var storeItem in storeItems.items)
            {
                if (storeItem.virtual_prices.Length == 0)
                    continue;

                var widget = Instantiate(WidgetPrefab, WidgetsContainer, false).GetComponent<VirtualItemWidget>();

                widget.NameText.text = storeItem.name;
                widget.DescriptionText.text = storeItem.description;

                var defaultPrice = storeItem.virtual_prices.First(x => x.is_default);
                widget.PriceText.text = $"{defaultPrice.name}: {defaultPrice.amount}";

                ImageLoader.Instance.GetImageAsync(storeItem.image_url, (url, sprite) => widget.IconImage.sprite = sprite);

                widget.BuyButton.onClick.AddListener(() =>
                {
                    var price = storeItem.virtual_prices.First(x => x.is_default);
                    XsollaCatalog.Instance.PurchaseItemForVirtualCurrency(XsollaSettings.StoreProjectId, storeItem.sku, price.sku, OnOrderCreateSuccess, OnError);
                });
            }
        }

        private void OnOrderCreateSuccess(PurchaseData purchaseData)
        {
            XsollaOrders.Instance.CheckOrderStatus
            (
                XsollaSettings.StoreProjectId,
                purchaseData.order_id,
                status =>
                {
                    if (status.status == "paid" || status.status == "done")
                    {
                        OnPurchaseSuccess();
                    }
                },
                error =>
                {
                    OnError(error);
                }
            );
        }


        private void OnPurchaseSuccess()
        {
            UnityEngine.Debug.Log($"Purchase successful");
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

仮想通貨残高の表示

このチュートリアルでは、SDKメソッドを使って、アプリ内で仮想通貨の残高を表示する方法を紹介します。

例のロジックとインターフェイスは、アプリケーションよりも複雑ではありません。ゲーム内ストアの実装オプションで可能なアイテムカタログについては、デモプロジェクトで説明しています。

残高表示用ウィジェットの作成

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ウィジェットの背景画像
    • 仮想通貨名
    • 仮想通貨の数量
    • 仮想通貨の画像

次の図は、ウィジェットの構造の一例です。

残高表示のためのウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualCurrencyWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class VirtualCurrencyWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text AmountText;

        public Image IconImage;
    }
}

仮想通貨の一覧ページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • ウィジェットの表示エリア

次の図は、ページ構成の一例です。

仮想通貨のリストを表示するページのコントローラを作成する

  1. MonoBehaviourのベースクラスを継承したVirtualCurrenciesPageスクリプトを作成します。
  2. 以下の変数を宣言します:
    • WidgetsContainer — ウィジェットのコンテナ
    • WidgetPrefab — 残高表示ウィジェットのプレハブ

  1. ページゲームオブジェクトにスクリプトをアタッチします:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add ComponentをクリックしてVirtualCurrenciesPageスクリプトを選択します。

  1. Inspectorパネルで変数を設定します。
  2. Startメソッドの中でXsollaAuth.Instance.SignIn SDKメソッドを呼び出してパスすることでログインロジックを追加し、以下のことを渡します:
    • usernameパラメータでのユーザー名またはメールアドレス
    • passwordパラメータでのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. 仮想通貨のリストを取得するロジックを追加しました。そのためには、OnAuthenticationSuccessメソッドの中で:
    1. 認証トークンをToken.Instance変数に渡します。

Note
以下のいずれかのトークンを使用することができます:

    1. XsollaInventory.Instance.GetVirtualCurrencyBalance SDKメソッドを呼び出し、以下を渡します:
      • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

      • アイテムのリストを取得する操作を成功させるためのOnBalanceRequestSuccessメソッド
      • エラーのOnErrorコールバックメソッド

  1. OnBalanceRequestSuccessメソッドで、受信したすべての仮想通貨ウィジェットを作成するためのロジックを追加します:
    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したVirtualCurrencyWidgetコンポーネントをwidget変数にアタッチします。

  1. 以下のデータを残高ウィジェットに渡します。
    1. 仮想通貨名を持つ要素にbalanceItem.nameの変数値を渡します。
    2. 仮想通貨の数量を持つ要素にbalanceItem.amount.ToString()変数の値を渡します。
    3. アイテムの価格を表示するために、以下のロジックを実装します。仮想通貨の画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用し、それを渡します:
      • イメージURL。
      • 無名のコールバック関数です。この関数では,受け取ったスプライトを仮想通貨の画像として設定します。

ページコントローラースクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Core;
using Xsolla.Inventory;

namespace Recipes
{
    public class VirtualCurrenciesPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs

        public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process

            XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, null, OnAuthenticationSuccess, OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for virtual currencies

            Token.Instance = Token.Create(token);
            XsollaInventory.Instance.GetVirtualCurrencyBalance(XsollaSettings.StoreProjectId, OnBalanceRequestSuccess, OnError);
        }

        private void OnBalanceRequestSuccess(VirtualCurrencyBalances balance)
        {
            // Iterating the virtual currencies list and assign values for appropriate ui elements

            foreach (var balanceItem in balance.items)
            {
                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<VirtualCurrencyWidget>();

                widget.NameText.text = balanceItem.name;
                widget.AmountText.text = balanceItem.amount.ToString();

                ImageLoader.Instance.GetImageAsync(balanceItem.image_url, (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

次の写真は、スクリプトの作業の結果です。

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示

インベントリでアイテムの表示

このチュートリアルでは、SDKのメソッドを使ってユーザーのインベントリにアイテムを表示する方法を紹介します。

例題の論理とインターフェースは、お客様のアプリケーションでの使用よりも複雑ではありません。イベントリの実装方法は、デモプロジェクトで紹介されています。

アイテムウィジェットを作成する

  1. 空のゲームオブジェクトを作成します。これを行うには、メインメニューに移動し、GameObject > Create Emptyを選択します。
  2. プレハブで作成したゲームオブジェクトをHierarchyパネルからProjectパネルにドラッグして変換します。
  3. 作成したプレハブを選択し、Inspectorパネルで、Open Prefabをクリックします。
  4. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • アイテムの背景画像
    • アイテム名
    • アイテムの説明
    • アイテムの量
    • アイテムの画像

次の図は、ウィジェットの構造の一例です。

アイテムウィジェットスクリプトを作成する

  1. MonoBehaviourのベースクラスを継承したInventoryItemWidgetスクリプトを作成します。
  2. アイテムウィジェットのインターフェイス要素のための変数を宣言し、Inspectorパネルでその値を設定します。

ウィジェットスクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;

namespace Recipes
{
    public class InventoryItemWidget : MonoBehaviour
    {
        // Declaration of variables for UI elements

        public Text NameText;

        public Text DescriptionText;

        public Text QuantityText;

        public Image IconImage;
    }
}

インベントリを表示するページを作成する

  1. シーン上で、空のゲームオブジェクトを作成します。これを行うには、メインメニューでGameObject > Create Emptyを選択します。
  2. 以下のUI要素をプレハブの子オブジェクトとして追加し、そのビジュアルを設定します:
    • ページの背景画像
    • アイテムウィジェットの表示エリア

次の図は、ページ構成の一例です。

ページコントローラーを作成する

  1. MonoBehaviourのベースクラスを継承したInventoryItemsPageスクリプトを作成します。
  2. 以下の変数を宣言します:
    • WidgetsContainer — アイテムウィジェットのコンテナ
    • WidgetPrefab — アイテムウィジェットのプレハブ

  1. ページゲームオブジェクトにスクリプトをアタッチします:
    1. Hierarchyパネルでオブジェクトを選択します。
    2. Inspectorパネルで、Add ComponentをクリックしてInventoryItemsPageスクリプトを選択します。

  1. Inspectorパネルで変数を設定します。
  2. Startメソッドの中でXsollaAuth.Instance.SignIn SDKメソッドを呼び出してパスすることでログインロジックを追加し、以下のことを渡します:
    • usernameパラメータでのユーザー名またはメールアドレス
    • passwordパラメータでのユーザーパスワード

Note
ログインするスクリプトの例では、デモアカウントの資格情報を使用します(ユーザー名:xsolla、パスワード:xsolla)。

    • アカウントを記憶するためのrememberUserパラメータのフラグ
    • ユーザーログインを成功させるためのOnAuthenticationSuccessコールバックメソッド
    • エラーのOnErrorコールバックメソッド

  1. インベントリ内のアイテムのリストを取得するためのロジックを追加します。これを行うには、OnAuthenticationSuccessメソッドの中で:
    1. 認証トークンをToken.Instance変数に渡します。

Note
以下のいずれかのトークンを使用することができます:

    1. XsollaInventory.Instance.GetInventoryItems SDKメソッドを呼び出し、以下を渡します:
      • projectIdパラメータでのプロジェクトID

Note
プロジェクトIDは、パブリッシャーアカウントのプロジェクト設定で確認できます。スクリプトの例では、SDK設定の値をパラメータに渡しています。

      • アイテムのリストを取得する操作を成功させるためのOnItemsRequestSuccess
      • エラーのOnErrorコールバックメソッド

  1. OnItemsRequestSuccessメソッドで受信したアイテムごとに、ウィジェットを作成するロジックを追加します:
    1. InventoryItem.IsVirtualCurrencyメソッドを使用して、受け取ったアイテムが仮想通貨でないことを確認するチェック機能を追加します。

Note
この例では、インベントリ内の仮想アイテム、バンドル、およびサブスクリプションのみを示します。別のページに仮想通貨残高の表示を実装します。

    1. アイテムウィジェットのプレハブをコンテナの子オブジェクトとしてインスタンス化します。
    2. 受信したInventoryItemWidgetコンポーネントをwidget変数にアタッチします。

  1. 以下のデータをアイテムウィジェットに渡します:
    1. アイテム名を持つ要素にinventoryItem.nameの変数値を渡します。
    2. アイテムの説明を持つ要素にinventoryItem.descriptionの変数値を渡します。
    3. アイテムの数量を持つ要素にinventoryItem.amount.ToString()を渡します。
    4. アイテムの画像を表示するには、ImageLoader.Instance.GetImageAsyncユーティリティーメソッドを使用して、これを渡します:
      • イメージURL
      • コールバックとしての無名関数です。この関数では,受信したスプライトをアイテム画像として追加します。

ページコントローラースクリプトの例:

Copy
Full screen
Small screen
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Core;
using Xsolla.Inventory;

namespace Recipes
{
    public class InventoryItemsPage : MonoBehaviour
    {
        // Declaration of variables for containers and widget prefabs
     public Transform WidgetsContainer;

        public GameObject WidgetPrefab;

        private void Start()
        {
            // Starting the authentication process
         XsollaAuth.Instance.SignIn("xsolla", "xsolla", true, null, null, OnAuthenticationSuccess, OnError);
        }

        private void OnAuthenticationSuccess(string token)
        {
            // After successful authentication starting the request for virtual currencies
         Token.Instance = Token.Create(token);
            XsollaInventory.Instance.GetInventoryItems(XsollaSettings.StoreProjectId, OnItemsRequestSuccess, OnError);
        }

        private void OnItemsRequestSuccess(InventoryItems inventoryItems)
        {
            // Iterating the item list and assign values for appropriate ui elements

            foreach (var inventoryItem in inventoryItems.items)
            {
                if (inventoryItem.IsVirtualCurrency())
                    continue;

                var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
                var widget = widgetGo.GetComponent<InventoryItemWidget>();

                widget.NameText.text = inventoryItem.name;
                widget.DescriptionText.text = inventoryItem.description;
                widget.QuantityText.text = inventoryItem.quantity.ToString();

                ImageLoader.Instance.GetImageAsync(inventoryItem.image_url, (url, sprite) => widget.IconImage.sprite = sprite);
            }
        }

        private void OnError(Error error)
        {
            UnityEngine.Debug.LogError($"Error message: {error.errorMessage}");
        }
    }
}

次の写真は、スクリプトの作業の結果です。

この記事は役に立ちましたか?
ありがとうございます!
改善できることはありますか? メッセージ
申し訳ありません
この記事が参考にならなかった理由を説明してください。 メッセージ
ご意見ありがとうございました!
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。
非表示
進捗状況
ご意見ありがとうございました!

お役立ちリンク

最終更新日: 2022年6月21日

誤字脱字などのテキストエラーを見つけましたか? テキストを選択し、Ctrl+Enterを押します。

問題を報告する
当社は常にコンテンツを見直しています。お客様のご意見は改善に役立ちます。
フォローアップ用のメールをご提供してください
ご意見ありがとうございました!