Diese Anleitung erläutert, wie sich mittels SDK-Methoden Folgendes implementieren lässt:

• Benutzerregistrierung
• erneutes Senden einer E-Mail zum Bestätigen der Registrierung
• Benutzeranmeldung
• Zurücksetzen des Benutzerpassworts

Sie können Benutzer anhand ihres Benutzernamens oder ihrer E-Mail-Adresse authentifizieren. In den folgenden Beispielen authentifizieren wir Benutzer anhand ihres Benutzernamens, während die E-Mail-Adresse zur Bestätigung der Registrierung und zum Zurücksetzen des Passworts verwendet wird.

Die Logiken und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Eine mögliche Option zur Implementierung eines Authentifizierungssystems ist im Demoprojekt beschrieben.

Benutzerregistrierung implementieren

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Benutzeroberfläche erstellen

Erstellen Sie eine Szene für eine Registrierungsseite und fügen Sie ihr folgende Elemente hinzu:

• Benutzername-Feld
• E-Mail-Adresse-Feld
• Benutzerpasswort-Feld
• Anmeldeschaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein RegistrationPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente der Seite, und legen Sie die Werte dafür im Inspector-Fenster fest.
3. Fügen Sie Logiken hinzu, um den Klick auf die Registrierungsschaltfläche verarbeiten zu können:

1. 1. Abonnieren Sie in der Methode Start ein Klick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach Klick auf die Schaltfläche aufgerufen wird.
   3. Deklarieren Sie in dieser Methode die Variablen username, email und password, und initialisieren Sie sie entsprechend der Werte aus den Feldern auf der Seite.
   4. Rufen Sie die SDK-Methode XsollaAuth.Instance.Register auf, und übermitteln Sie ihr die Variablen username, email und password sowie die folgenden Methoden:

1. 1. • OnSuccess – wird nach erfolgreicher Registrierung aufgerufen
      • OnError – wird bei einem Problem aufgerufen

Beispielhaftes Skript für eine Registrierungsseite:

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, password, email, 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
     }
    }
}

E-Mail für die Registrierungsbestätigung einrichten

Nach erfolgreicher Registrierung erhält der Benutzer eine E-Mail für die Registrierungsbestätigung an eine angegebene E-Mail-Adresse gesendet. Im Kundenportal können Sie die E-Mails individualisieren.

Wenn Sie eine Android-Anwendung entwickeln, richten Sie Deep-Links ein, damit Benutzer zur Anwendung weitergeleitet werden, nachdem sie die Registrierung bestätigt haben.

Anfrage zum erneuten Senden einer Registrierungsbestätigungs-E-Mail implementieren

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Benutzeroberfläche erstellen

Erstellen Sie eine Szene für eine Seite zum erneuten Senden einer Bestätigungs-E-Mail und fügen Sie ihr folgende Elemente hinzu:

• Benutzername-/E-Mail-Adresse-Feld
• "E-Mail erneut senden"-Schaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein ResendConfirmationEmail-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente der Seite, und legen Sie die Werte dafür im Inspector-Fenster fest.
3. Fügen Sie Logiken hinzu, um den Klick auf die "E-Mail erneut senden"-Schaltfläche verarbeiten zu können:

1. 1. Abonnieren Sie in der Methode Start ein Klick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach Klick auf die Schaltfläche aufgerufen wird.
   3. Deklarieren Sie in dieser Methode die Variable username, und initialisieren Sie sie entsprechend der Werte aus den Feldern auf der Seite.
   4. Rufen Sie die SDK-Methode XsollaAuth.Instance.ResendConfirmationLink auf, und übermitteln Sie ihr die Variable username sowie die Methoden OnSuccess und OnError.

Beispielhaftes Skript für eine Seite zum erneuten Senden einer E-Mail:

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
     }
    }
}

Nach erfolgreicher Anfrage erhält der Benutzer eine E-Mail zur Registrierungsbestätigung an die bei der Registrierung angegebene E-Mail-Adresse.

Benutzeranmeldung implementieren

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Benutzeroberfläche erstellen

Erstellen Sie eine Szene für eine Anmeldeseite und fügen Sie ihr folgende Elemente hinzu:

• Benutzername-Feld
• Passwort-Feld
• "Angemeldet bleiben"-Kontrollkästchen
• Anmeldeschaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein AutorizationPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente der Seite, und legen Sie die Werte dafür im Inspector-Fenster fest.
3. Fügen Sie Logiken hinzu, um den Klick auf die Anmeldeschaltfläche verarbeiten zu können:

1. 1. Abonnieren Sie in der Methode Start ein Klick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach Klick auf die Schaltfläche aufgerufen wird.
   3. Deklarieren Sie in dieser Methode die Variablen username und password, und initialisieren Sie sie entsprechend der Werte aus den Feldern auf der Seite. Erstellen Sie eine rememberMe-Variable, und initialisieren Sie sie je nach Kontrollkästchenstatus, damit man beim Konto angemeldet bleiben kann.
   4. Rufen Sie die SDK-Methode XsollaAuth.Instance.SignIn auf, und übermitteln Sie ihr die Variablen username, password und rememberMe sowie die Methoden OnSuccess und OnError.

Beispielhaftes Skript für eine Anmeldeseite:

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
     }
    }
}

Zurücksetzen von Passwörtern implementieren

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Benutzeroberfläche erstellen

Erstellen Sie eine Szene für eine "Passwort zurücksetzen"-Seite und fügen Sie der Seite folgende Elemente hinzu:

• Benutzername-/E-Mail-Adresse-Feld
• "Passwort zurücksetzen"-Schaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein ResetPasswordPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente der Seite, und legen Sie die Werte dafür im Inspector-Fenster fest.
3. Fügen Sie Logiken hinzu, um den Klick auf die "Passwort zurücksetzen"-Schaltfläche verarbeiten zu können:

1. 1. Abonnieren Sie in der Methode Start ein Klick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach Klick auf die Schaltfläche aufgerufen wird.
   3. Deklarieren Sie in dieser Methode die Variable username, und initialisieren Sie sie entsprechend der Werte aus den Feldern auf der Seite.
   4. Rufen Sie die SDK-Methode XsollaAuth.Instance.ResetPassword auf, und übermitteln Sie ihr die Variable username sowie die Methoden OnSuccess und OnError.

Beispielhaftes Skript für eine Seite zum Zurücksetzen des Passworts:

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, 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
     }
    }
}

Nach einer erfolgreichen Anfrage zum Zurücksetzen des Passworts erhält der Benutzer eine E-Mail mit einem entsprechenden Link. Im Kundenportal können Sie unter Ihr Login-Projekt > Sicherheit > OAuth 2.0 > OAuth 2.0-URIs für die Weiterleitung eine URL-Adresse oder einen Pfad festlegen, zu der bzw. dem der Benutzer nach einer erfolgreichen Authentifizierung, der Bestätigung seiner E-Mail-Adresse oder dem Zurücksetzen seines Passworts weitergeleitet wird.

Diese Anleitung erläutert, wie Sie mithilfe von SDK-Methoden die Benutzerregistrierung und ‑anmeldung über Social-Media-Konten implementieren.

Im Gegensatz zur Benutzerauthentifizierung über Benutzername/E-Mail-Adresse und Passwort müssen Sie für die Benutzerregistrierung keine separate Logik implementieren. Wenn die erstmalige Anmeldung des Benutzers über ein soziales Netzwerk erfolgt, wird automatisch ein neues Konto erstellt.

Wenn Sie in Ihrer Anwendung die Anmeldung über soziale Netzwerke als alternative Authentifizierungsmethode implementiert haben, wird das Social-Media-Konto automatisch mit einem bestehenden Benutzerkonto verknüpft, sofern die folgenden Bedingungen erfüllt sind:

• Ein Benutzer, der sich mittels Benutzername/E-Mail-Adresse und Passwort registriert hat, meldet sich über sein Social-Media-Konto bei Ihrer Anwendung an.
• Das soziale Netzwerk gibt eine E-Mail-Adresse zurück.
• Die E-Mail-Adresse des Benutzers in einem sozialen Netzwerk entspricht derselben E-Mail-Adresse, die für die Anmeldung bei Ihrer Anwendung verwendet wird.

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Die Beispiele zeigen die Einrichtung der Benutzeranmeldung über ein Twitter-Konto. Andere soziale Netzwerke lassen sich auf dieselbe Weise einrichten.

Die Logiken und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Eine mögliche Option zur Implementierung eines Authentifizierungssystems ist im Demoprojekt beschrieben.

Benutzeroberfläche erstellen

Erstellen Sie eine Szene für eine Anmeldeseite, und fügen Sie die Schaltfläche für das Anmelden über soziale Netzwerke hinzu. Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein SocialAuthorizationPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente der Anmeldeseite der Anwendung, und legen Sie die Werte dafür im Inspector-Fenster fest.
3. Fügen Sie Logiken hinzu, um den Klick auf die Anmeldeschaltfläche verarbeiten zu können:

1. 1. Abonnieren Sie in der Methode Start ein Klick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach Klick auf die Schaltfläche aufgerufen wird.
   3. Deklarieren Sie die Variable url in einer anonymen Methode, um die URL der Anmeldeseite übermitteln zu können. Initialisieren Sie diese Variable durch die SDK-Methode GetSocialNetworkAuthUrl, indem Sie den Wert Facebook im Parameter SocialProvider übermitteln.
   4. Rufen Sie zum Öffnen eines Browsers die Methode BrowserHelper.Instance.Open auf. Um einen integrierten Browser zu nutzen, übermitteln Sie die Variable url und den Wert true an die Methode.

1. 5. Um einen Token abzurufen und den Browser zu schließen, tracken sie die Änderung der Seiten-URL nach der erfolgreichen Benutzerregistrierung:
      1. Deklarieren Sie eine singlePageBrowser-Variable, und initialisieren Sie sie über die SDK-Methode BrowserHelper.Instance.GetLastBrowser.
      2. Abonnieren Sie das URL-Änderungsereignis einer aktiven Seite, und legen als Handler die Methode OnUrlChanged fest.

4. Implementieren Sie den Abruf des Tokens:
   1. Parsen Sie mithilfe der Dienstprogrammmethode ParseUtils.TryGetValueFromUrl die URL einer in der Methode OnUrlChanged übermittelten aktiven Seite.
   2. Prüfen Sie, ob ein Authentifizierungscode in der URL der aktiven Seite vorliegt. Die Methode ParseUtils.TryGetValueFromUrl übermittelt einen Authentifizierungscode in der Variable code.
   3. Rufen Sie die SDK-Methode ExchangeCodeToToken auf, und übermitteln Sie ihr eine code-Variable sowie die folgenden Methoden:
      • OnSuccess — wird nach erfolgreicher Registrierung aufgerufen
      • OnError — wird bei einem Problem aufgerufen

1. 4. Nachdem Sie den Token abgerufen haben, löschen Sie ein Spielobjekt mit einem Browser.

Beispielhaftes Skript für eine Anmeldeseite:

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);
                BrowserHelper.Instance.Close();
            }
        }

        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
     }
    }
}

Dieses Tutorial erläutert, wie Sie die SDK-Methoden verwenden, um die folgenden Artikel in einem Ingame-Shop anzuzeigen:

• virtuelle Gegenstände
• Gruppen von virtuellen Gegenständen
• Bundles
• Pakete mit virtueller Währung

Konfigurieren Sie zunächst Artikel im Kundenportal:

1. Konfigurieren Sie virtuelle Gegenstände und Gruppen virtueller Gegenstände.
2. Konfigurieren Sie Pakete mit virtuellen Währungen.
3. Konfigurieren Sie Bundles.

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Die Logiken und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Ein möglicher Artikelkatalog im Rahmen einer Ingame-Shop-Implementierung ist im Demoprojekt beschrieben.

Anzeige von virtuellen Gegenständen implementieren

Artikel-Widget erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Artikelhintergrundbild
   • Artikelname
   • Artikelbeschreibung
   • Artikelpreis
   • Artikelbild

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Artikel-Widget-Skript erstellen

1. Erstellen Sie ein VirtualItemWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Seite für die Anzeige von Artikellisten erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für Artikel-Widgets

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein VirtualItemsPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie die folgenden Variablen:
   • WidgetsContainer — Container für Widgets
   • WidgetPrefab — Prefab des Artikel-Widgets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein VirtualItemsPage-Skript aus.
4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.

5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:
   • einen Benutzernamen oder eine E-Mail-Adresse im Parameter username
   • ein Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie Logiken für das Abrufen der Artikelliste hinzu. Rufen Sie in der Methode OnAuthenticationSuccess die SDK-Methode XsollaCatalog.Instance.GetCatalog auf, und übermitteln Sie ihr Folgendes:
   • Projekt-ID im Parameter projectId

1. • die Rückrufmethode OnItemsRequestSuccess bei erfolgreichem Abruf einer Artikelliste
   • die Rückrufmethode OnError bei einem Fehler
   • einen Offset basierend auf dem ersten Artikel in der Liste im Parameter offset
   • die Anzahl der geladenen Artikel im Parameter limit

7. Fügen Sie in der Methode OnItemsRequestSuccess Logiken zum Erstellen eines Widgets für jeden empfangenen Artikel hinzu:
   1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
   2. Hängen Sie die empfangene VirtualItemWidget-Komponente einer widget-Variable an.

8. Übermitteln Sie dem Artikel-Widget folgende Daten:
   1. Übermitteln Sie den Wert der Variable storeItem.name an das Element mit dem Artikelnamen.
   2. Übermitteln Sie den Wert der Variable storeItem.description an das Element mit der Artikelbeschreibung.
   3. Implementieren Sie die folgenden Logiken, um den Artikelpreis anzeigen zu können:
      • Sofern der Wert der Variable storeItem.price ungleich null ist, wird der Artikel gegen echte Währung verkauft. Geben Sie den Preis im Format {amount} {currency} an, und übermitteln Sie ihn an das Widget-Element.
      • Sofern der Wert der Variable storeItem.virtual_prices ungleich null ist, wird der Artikel gegen virtuelle Währung verkauft. Geben Sie den Preis im Format {name}: {amount} an, und übermitteln Sie ihn an das Widget-Element.

1. 4. Nutzen Sie zum Anzeigen eines Artikelbilds die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Bild-URL.
      • Eine anonyme Funktion als Rückruf. Fügen Sie in dieser Funktion ein erhaltenes Sprite als Artikelbild ein.

Beispielhaftes Page-Controller-Skript:

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}");
        }
    }
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Anzeige von Gruppen virtueller Gegenstände implementieren

Artikel-Widget erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Artikelhintergrundbild
   • Artikelname
   • Artikelbeschreibung
   • Artikelpreis
   • Artikelbild

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Artikel-Widget-Skript erstellen

1. Erstellen Sie ein VirtualItemWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Widget für Schaltflächen zum Öffnen von Artikelgruppen erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die Schaltfläche, mit der sich Artikelgruppen anzeigen lassen, einem Prefab als untergeordnetes Objekt hinzu, und konfigurieren Sie ihr Erscheinungsbild.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Skript für Schaltflächen zum Öffnen von Artikelgruppen erstellen

1. Erstellen Sie das VirtualItemGroupButton-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Schaltfläche, mit der sich Artikelgruppen öffnen lassen, und legen Sie die Werte für die Variablen im Inspector-Fenster fest.
3. Fügen Sie dem Stammobjekt eines Prefabs ein Skript hinzu:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein VirtualItemGroupButton-Skript aus.

Beispielhaftes Widget-Skript:

using UnityEngine;
using UnityEngine.UI;

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

        public Button Button;
    }
}

Seite für die Anzeige von Artikellisten erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für Artikelgruppenschaltflächen
   • Anzeigebereich für Artikel-Widgets

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie das VirtualItemsByGroupsPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen:
   • GroupButtonsContainer — Container für Gruppenschaltflächen
   • GroupButtonPrefab — Schaltflächen-Prefab
   • ItemWidgetsContainer — Container für Artikel-Widgets
   • WidgetPrefab — Prefab des Artikel-Widgets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein VirtualItemsByGroupsPage-Skript aus.
4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:
   • einen Benutzernamen oder eine E-Mail-Adresse im Parameter username
   • ein Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie Logiken für das Abrufen der Artikelliste hinzu. Rufen Sie in der Methode OnAuthenticationSuccess die SDK-Methode XsollaCatalog.Instance.GetCatalog auf, und übermitteln Sie ihr Folgendes:
   • Projekt-ID im Parameter projectId

1. • die Rückrufmethode OnItemsRequestSuccess bei erfolgreichem Abruf einer Artikelliste
   • die Rückrufmethode OnError bei einem Fehler
   • einen Offset basierend auf dem ersten Artikel in der Liste im Parameter offset
   • die Anzahl der geladenen Artikel im Parameter limit

7. Fügen Sie in der Methode OnItemsRequestSuccess Logiken für die Erzeugung einer Liste von Artikelgruppen hinzu:
   1. Rufen Sie die Liste der individuellen Gruppen aus einer empfangenen Artikelliste ab. Fügen Sie ihr das Element All hinzu, das alle Artikel unabhängig von deren Kategorie anzeigt.
   2. Löschen Sie den Schaltflächen-Container, indem Sie alle untergeordneten Objekte löschen. Rufen Sie dazu die Methode DeleteAllChildren auf, und übermitteln Sie ihr ein Container-Objekt.
   3. Gehen Sie für jede Artikelgruppe wie folgt vor:

1. 1. 1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
      2. Legen Sie die empfangene VirtualItemGroupButton-Komponente als Variable groupButton fest.
      3. Übermitteln Sie den Wert der Variable groupName an das Element mit einem Gruppennamen.
      4. Ergänzen Sie die Handlung des Anklickens der Schaltfläche um eine anonyme Methode. Rufen Sie in dieser Methode die Methode OnGroupSelected auf, und übermitteln Sie den Namen der Artikelgruppe und die Artikelliste als Parameter.

1. 4. Rufen Sie zum Anzeigen aller Artikel die Methode OnGroupSelected auf, und übermitteln Sie All als Gruppennamen.

8. Fügen Sie in der Methode OnGroupSelected Logiken für die erstmalige Anzeige der Artikel hinzu:
   1. Erstellen Sie die Variable itemsForDisplay, und weisen Sie ihr alle empfangenen Artikel zu, wenn der Name der Artikelgruppe All lautet. Verknüpfen Sie andernfalls Artikel, deren Gruppenname mit der Variable groupName übereinstimmt, mit der Variable itemsForDisplay.
   2. Löschen Sie den Schaltflächen-Container, indem Sie alle untergeordneten Objekte löschen. Rufen Sie dazu die Methode DeleteAllChildren auf, und übermitteln Sie ihr ein Container-Objekt.

9. Fügen Sie Logiken zum Erstellen eines Widgets für jeden empfangenen Artikel hinzu:
   1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
   2. Hängen Sie die empfangene VirtualItemWidget-Komponente einer widget-Variable an.

10. Übermitteln Sie die folgenden Daten an das Artikel-Widget:
    1. Übermitteln Sie den Wert der Variable storeItem.name an das Element mit dem Artikelnamen.
    2. Übermitteln Sie den Wert der Variable storeItem.description an das Element mit der Artikelbeschreibung.
    3. Implementieren Sie die folgenden Logiken für die Anzeige von Artikelpreisen:

1. 1. • Sofern der Wert der Variable storeItem.price ungleich null ist, wird das Paket gegen echte Währung verkauft. Geben Sie den Preis im Format {amount} {currency} an, und übermitteln Sie ihn an das Widget-Element.
      • Sofern der Wert der Variable storeItem.virtual_prices ungleich null ist, wird das Paket gegen virtuelle Währung verkauft. Geben Sie den Preis im Format {name}: {amount} an, und übermitteln Sie ihn an das Widget-Element.

1. 4. Nutzen Sie zum Anzeigen eines Artikelbilds die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Bild-URL.
      • Eine anonyme Funktion als Rückruf. Fügen Sie in dieser Funktion ein erhaltenes Sprite als Artikelbild ein.

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}");
        }
    }
}

Beispielhaftes Page-Controller-Skript:

Anzeige von Bundles implementieren

Bundle-Widget erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:

1. • Widget-Hintergrundbild
   • Bundle-Name
   • Bundle-Beschreibung
   • Bundle-Preis
   • Beschreibung des Bundle-Inhalts (Artikel und deren Stückzahl)
   • Bundle-Bild

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Widget-Skript erstellen

1. Erstellen Sie ein BundleWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Seite für die Anzeige von Bundles erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für Bundle-Widgets

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie das BundlesPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen.
   • WidgetsContainer — Container für Widgets
   • WidgetPrefab — Prefab des Bundle-Widgets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein BundlesPage-Skript aus.

4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:
   • einen Benutzernamen oder eine E-Mail-Adresse im Parameter username
   • ein Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie Logiken für das Abrufen der Bundles-Liste hinzu. Rufen Sie in der Methode OnAuthenticationSuccess die SDK-Methode XsollaCatalog.Instance.GetBundles auf, und übermitteln Sie ihr Folgendes:
   • eine Projekt-ID im Parameter projectId

1. • die Rückrufmethode OnItemsRequestSuccess bei erfolgreichem Abruf einer Bundles-Liste
   • die Rückrufmethode OnError bei einem Fehler

7. Fügen Sie in der Methode OnBundlesRequestSuccess Logiken zum Erstellen eines Widgets für jedes empfangene Bundle hinzu:
   1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
   2. Hängen Sie die empfangene BundleWidget-Komponente einer widget-Variable an.

8. Übermitteln Sie folgende Daten an das Bundle-Widget:
   1. Übermitteln Sie den Wert der Variable bundleItem.name an das Element mit dem Artikelnamen.
   2. Übermitteln Sie den Wert der Variable bundleItem.description an das Element mit der Artikelbeschreibung.
   3. Implementieren Sie die folgenden Logiken, um den Bundle-Inhalt anzeigen zu können:
      1. Legen Sie für jeden Artikel in einem Bundle eine Zeile an, die den Artikelnamen und die Stückzahl enthält. Die Zeile sollte folgendes Format aufweisen: {name} x {quantity}.
      2. Fassen Sie diese Zeilen in einer neuen Zeile zusammen. Nutzen Sie dazu ein Zeilenvorschubzeichen als Trennzeichen.
      3. Übermitteln Sie die neue Zeile an das Widget-Element.

1. 4. Implementieren Sie die folgenden Logiken, um den Bundle-Preis anzeigen zu können:
      • Sofern der Wert der Variable bundleItem.price ungleich null ist, wird das Bundle gegen echte Währung verkauft. Geben Sie den Preis im Format {amount} {currency} an, und übermitteln Sie ihn an das Widget-Element.
      • Sofern der Wert der Variable bundleItem.virtual_prices ungleich null ist, wird das Bundle gegen virtuelle Währung verkauft. Geben Sie den Preis im Format {name}: {amount} an, und übermitteln Sie ihn an das Widget-Element.

1. 5. Nutzen Sie zum Anzeigen eines Artikelbilds die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Bild-URL.
      • Eine anonyme Funktion als Rückruf. Fügen Sie in dieser Funktion ein erhaltenes Sprite als Bundle-Bild.

Beispielhaftes Page-Controller-Skript:

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}");
        }
    }
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Anzeige von virtuellen Währungspaketen implementieren

Widget für virtuelle Währungspakete erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:

1. • Widget-Hintergrundbild
   • Paketname
   • Paketbeschreibung
   • Paketpreis
   • Paketbild

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Widget-Skript erstellen

1. Erstellen Sie ein VirtualCurrencyPackageWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Seite für die Anzeige der Liste der virtuellen Währungspaketen erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für die Widgets mit den virtuellen Währungspaketen

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie das VirtualCurrencyPackagesPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen.
   • WidgetsContainer — Container für Widgets
   • WidgetPrefab — Prefab des virtuellen Währungspakets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein VirtualCurrencyPackagesPage-Skript aus.
4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:

1. • Benutzername oder E-Mail-Adresse im Parameter username
   • Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie Logiken für das Abrufen der Artikelliste hinzu. Rufen Sie in der Methode OnAuthenticationSuccess die SDK-Methode XsollaCatalog.Instance.GetVirtualCurrencyPackagesList auf, und übermitteln Sie ihr Folgendes:
   • Projekt-ID im Parameter projectId

1. • die Rückrufmethode OnItemsRequestSuccess bei erfolgreichem Abruf einer Artikelliste
   • die Rückrufmethode OnError bei einem Fehler

7. Fügen Sie in der Methode OnPackagesRequestSuccess Logiken zum Erstellen eines Widgets für jedes empfangene Paket hinzu:
   1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
   2. Hängen Sie die empfangene VirtualCurrencyPackageWidget-Komponente einer widget-Variable an.

8. Übermitteln Sie die folgenden Daten an das Paket-Widget:
   1. Übermitteln Sie den Wert der Variable packageItem.name an das Element mit dem Paketnamen.
   2. Übermitteln Sie den Wert der Variable packageItem.description an das Element mit der Paketbeschreibung.
   3. Implementieren Sie die folgenden Logiken für die Anzeige von Paketpreisen:

1. 1. • Sofern der Wert der Variable packageItem.price ungleich null ist, wird das Paket gegen echte Währung verkauft. Geben Sie den Preis im Format {amount} {currency} an, und übermitteln Sie ihn an das Widget-Element.
      • Sofern der Wert der Variable packageItem.virtual_prices ungleich null ist, wird das Paket gegen virtuelle Währung verkauft. Geben Sie den Preis im Format {name}: {amount} an, und übermitteln Sie ihn an das Widget-Element.

1. 4. Nutzen Sie zum Anzeigen eines Artikelbilds die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Bild-URL.
      • Eine anonyme Funktion als Rückruf. Fügen Sie in dieser Funktion ein erhaltenes Sprite als Artikelbild ein.

Beispielhaftes Page-Controller-Skript:

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}");
        }
    }
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Diese Anleitung erläutert, wie Sie mithilfe der SDK-Methoden den Verkauf von virtuellen Gegenständen gegen echte Währung implementieren.

Zuerst müssen Sie die Anzeige von virtuellen Gegenständen in einem Katalog implementieren. Das folgende Beispiel zeigt, wie Sie den Kauf von virtuellen Gegenständen implementieren. Die Konfiguration für andere Artikeltypen erfolgt auf ähnliche Weise.

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Die Logik und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Eine mögliche Implementierungsoption für den Verkauf von Artikeln gegen echte Währung und die Anzeige eines Artikelkatalogs ist im Demoprojekt beschrieben.

Artikel-Widget fertigstellen

Fügen Sie dem Artikel-Widget eine Kaufen-Schaltfläche hinzu und konfigurieren Sie deren Erscheinungsbild.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Artikel-Widget-Skript fertigstellen

1. Öffnen Sie das VirtualItemWidget-Skript.
2. Deklarieren Sie die Variablen für die Kaufen-Schaltfläche, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Page Controller für Anzeige der Artikelliste fertigstellen

1. Öffnen Sie das VirtualItemsPage-Skript.
2. Übermitteln Sie in der OnAuthenticationSuccess-Methode den Autorisierungstoken an die Token.Instance-Variable.

3. Fügen Sie die Logik, mit deren Hilfe der Klick auf die Schaltfläche für den Kauf eines virtuellen Gegenstands verarbeitet wird, hinzu:
   1. Abonnieren Sie in der Methode OnItemsRequestSuccess das Schaltflächenklick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach dem Klick auf die Schaltfläche aufgerufen wird.
   3. Rufen Sie in dieser Methode die SDK-Methode XsollaCatalog.Instance.PurchaseItem auf, um eine Bestellung anzulegen und Folgendes zu übermitteln:

1. 1. • eine Projekt-ID im Parameter projectId
      • eine Artikelkennung im Parameter itemSku
      • die Methode OnOrderCreateSuccess, um bei einer erfolgreichen Artikelbestellung den Auftrag verarbeiten zu können
      • die Rückrufmethode OnError bei einem Fehler

4. Implementieren Sie das Öffnen einer Zahlungsseite. Fügen Sie dazu die Methode OnOrderCreateSuccess hinzu, und rufen Sie darin Folgendes auf:
   • die SDK-Methode XsollaOrders.Instance.OpenPurchaseUi, um eine Zahlungsseite zu öffnen.
   • die Coroutine TrackOrderStatus, um Bestellstatusänderungen zu tracken.

5. Implementieren Sie in der Coroutine TrackOrderStatus einen sekündlichen Abruf der Bestellstatusinfos. Nutzen Sie dazu die SDK-Methode XsollaOrders.Instance.CheckOrderStatus und übermitteln Sie ihr Folgendes:
   • eine Projekt-ID im Parameter projectId
   • eine Bestellnummer aus den Zahlungsdetails im Parameter orderId
   • eine anonyme Methode zur Verarbeitung des erfolgreichen Empfangs von Bestellstatusinfos
   • eine anonyme Methode zur Fehlerbearbeitung

6. Implementieren Sie in der Methode für die Verarbeitung des erfolgreichen Bestellstatusinfo-Erhalts den Rückruf einer OnPurchaseSuccess-Methode bei der Bezahlung der Bestellung (Zahlungsstatus: done oder paid).
7. Implementieren Sie in der Methode OnPurchaseSuccess die Verarbeitung eines erfolgreichen Kaufs eines virtuellen Gegenstands.

8. Wenn Sie einen integrierten Browser zum Öffnen einer Zahlungsseite verwenden, schließen Sie diesen Browser.

Beispielhaftes Skript für eine Seite:

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}");
        }
    }
}

Diese Anleitung erläutert, wie Sie mithilfe der SDK-Methoden den Verkauf von virtuellen Gegenständen gegen virtuelle Währung implementieren.

Zuerst müssen Sie die Anzeige von virtuellen Gegenständen in einem Katalog implementieren. Das folgende Beispiel zeigt, wie Sie den Kauf von virtuellen Gegenständen implementieren. Die Konfiguration für andere Artikeltypen erfolgt auf ähnliche Weise.

Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Die Logik und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Eine mögliche Implementierungsoption für den Verkauf von Artikeln gegen echte Währung und die Anzeige eines Artikelkatalogs ist im Demoprojekt beschrieben.

Artikel-Widget fertigstellen

Fügen Sie dem Artikel-Widget eine Kaufen-Schaltfläche hinzu und konfigurieren Sie deren Erscheinungsbild.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Artikel-Widget-Skript fertigstellen

1. Öffnen Sie das VirtualItemWidget-Skript.
2. Deklarieren Sie die Variablen für die Kaufen-Schaltfläche, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Page Controller für Anzeige der Artikelliste fertigstellen

1. Öffnen Sie das VirtualItemsPage-Skript.
2. Übermitteln Sie in der OnAuthenticationSuccess-Methode den Autorisierungstoken an die Token.Instance-Variable.

3. Fügen Sie die Logik, mit deren Hilfe der Klick auf die Schaltfläche für den Kauf eines virtuellen Gegenstands verarbeitet wird, hinzu:
   1. Abonnieren Sie in der Methode OnItemsRequestSuccess das Schaltflächenklick-Ereignis.
   2. Fügen Sie eine anonyme Methode hinzu, die nach dem Klick auf die Schaltfläche aufgerufen wird.
   3. Rufen Sie in dieser Methode die SDK-Methode XsollaCatalog.Instance.PurchaseItem auf, um eine Bestellung anzulegen und Folgendes zu übermitteln:

1. 1. • eine Projekt-ID im Parameter projectId
      • eine Artikelkennung im Parameter itemSku
      • die Methode OnOrderCreateSuccess, um bei einer erfolgreichen Artikelbestellung den Auftrag verarbeiten zu können
      • die Rückrufmethode OnError bei einem Fehler

5. Implementieren Sie in der Methode OnOrderCreateSuccess die Bestellstatusprüfung. Nutzen Sie dazu die SDK-Methode XsollaOrders.Instance.CheckOrderStatus und übermitteln Sie ihr Folgendes:
   • eine Projekt-ID im Parameter projectId
   • eine Bestellnummer aus den Zahlungsdetails im Parameter orderId
   • eine anonyme Methode zur Verarbeitung des erfolgreichen Empfangs von Bestellstatusinfos
   • eine anonyme Methode zur Fehlerbearbeitung

6. Implementieren Sie in der Methode für die Verarbeitung des erfolgreichen Bestellstatusinfo-Erhalts den Rückruf einer OnPurchaseSuccess-Methode bei der Bezahlung der Bestellung (Zahlungsstatus: done oder paid).
7. Implementieren Sie in der Methode OnPurchaseSuccess die Verarbeitung eines erfolgreichen Kaufs eines virtuellen Gegenstands.

Beispielhaftes Skript für eine Seite:

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}");
        }
    }
}

Dieses Tutorial erläutert, wie Sie die SDK-Methoden verwenden, um das virtuelle Währungsguthaben in Ihrer App anzuzeigen.

Die Logiken und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Ein möglicher Artikelkatalog im Rahmen einer Ingame-Shop-Implementierung ist im Demoprojekt beschrieben.

Widget für die Guthabenanzeige erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Widget-Hintergrundbild
   • Name der virtuellen Währung
   • Menge der virtuellen Währung
   • Bild der virtuellen Währung

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Widget-Skript für die Guthabenanzeige erstellen

1. Erstellen Sie ein VirtualCurrencyWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Seite mit Liste virtueller Währungen erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für Widgets

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Controller für Seite mit Liste virtueller Währungen erstellen

1. Erstellen Sie ein VirtualCurrenciesPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie die folgenden Variablen:
   • WidgetsContainer — Container für Widgets
   • WidgetPrefab — Prefab des Guthabenanzeige-Widgets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein VirtualCurrenciesPage-Skript aus.

4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:
   • einen Benutzernamen oder eine E-Mail-Adresse im Parameter username
   • ein Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie die Logiken für den Abruf einer Liste von virtuellen Währungen hinzu. Gehen Sie dazu in der OnAuthenticationSuccess-Methode wie folgt vor:
   1. Übermitteln Sie den Autorisierungstoken an die Variable Token.Instance.

1. 2. Rufen Sie die SDK-Methode XsollaInventory.Instance.GetVirtualCurrencyBalance auf, und übermitteln Sie Ihr Folgendes:
      • die Projekt-ID im Parameter projectId

1. 1. • die Methode OnBalanceRequestSuccess bei erfolgreichem Abruf einer Artikelliste
      • die Rückrufmethode OnError bei einem Fehler

7. Fügen Sie in der Methode OnBalanceRequestSuccess Logiken zum Erstellen eines Widgets für jeden empfangene virtuelle Währung hinzu:
   1. Instanziieren Sie ein Prefab des Artikel-Widgets als untergeordnetes Container-Objekt.
   2. Hängen Sie die empfangene VirtualCurrencyWidget-Komponente einer widget-Variable an.

8. Übermitteln Sie die folgenden Daten an das Guthaben-Widget:
   1. Übermitteln Sie den Wert der Variable balanceItem.name an das Element mit dem Namen der virtuellen Währung.
   2. Übermitteln Sie den Wert der Variable balanceItem.amount.ToString() an das Element mit der Menge der virtuellen Währung.
   3. Implementieren Sie die folgenden Logiken für die Anzeige des Artikelpreises. Um das Bild einer virtuellen Währung anzuzeigen, verwenden Sie die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Die Bild-URL.
      • Eine anonyme Rückruffunktion. Legen Sie in dieser Funktion den erhaltenen Sprite als Bild der virtuellen Währung fest.

Beispielhaftes Page-Controller-Skript:

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}");
        }
    }
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Dieses Tutorial erläutert, wie Sie die SDK-Methoden verwenden, um Artikel im Benutzerinventar anzuzeigen.

Die Logiken und die Benutzeroberfläche in den Beispielen sind einfach gehalten und können in Ihrer Anwendung durchaus komplexer ausfallen. Eine mögliche Option zur Implementierung des Inventars ist im Demoprojekt beschrieben.

Artikel-Widget erstellen

1. Erstellen Sie ein leeres Spielobjekt. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Konvertieren Sie das erstellte Spielobjekt in ein Prefab. Ziehen Sie dazu ein Spielobjekt aus dem Hierarchy-Fenster in ein Project-Fenster.
3. Wählen Sie ein erstelltes Prefab aus, und klicken Sie im Inspector-Fenster auf Open Prefab.
4. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Artikelhintergrundbild
   • Artikelname
   • Artikelbeschreibung
   • Artikelmenge
   • Artikelbild

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

Artikel-Widget-Skript erstellen

1. Erstellen Sie ein InventoryItemWidget-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie Variablen für die Benutzeroberflächenelemente des Artikel-Widgets, und legen Sie die Werte dafür im Inspector-Fenster fest.

Beispielhaftes Widget-Skript:

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;
    }
}

Seite für die Anzeige des Inventars erstellen

1. Legen Sie in der Szene ein leeres Spielobjekt an. Wechseln Sie dazu in das Hauptmenü, und klicken Sie auf GameObject > Create Empty.
2. Fügen Sie die folgenden Benutzeroberflächenelemente als untergeordnete Prefab-Objekte hinzu, und konfigurieren Sie deren Erscheinungsbild:
   • Seitenhintergrundbild
   • Anzeigebereich für Artikel-Widgets

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

Page Controller erstellen

1. Erstellen Sie ein InventoryItemsPage-Skript, übernommen aus der Basisklasse MonoBehaviour.
2. Deklarieren Sie die folgenden Variablen:
   • WidgetsContainer — Container für Artikel-Widgets
   • WidgetPrefab — Prefab des Artikel-Widgets

3. Hängen Sie einem Seiten-Spielobjekt ein Skript an:
   1. Wählen Sie ein Objekt im Hierarchy-Fenster aus.
   2. Klicken Sie im Inspector-Fenster auf Add Component, und wählen Sie ein InventoryItemsPage-Skript aus.

4. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
5. Fügen Sie Anmeldelogiken hinzu. Rufen Sie dazu eine XsollaAuth.Instance.SignIn-SDK-Methode in der Methode Start auf, und übermitteln Sie ihr Folgendes:
   • einen Benutzernamen oder eine E-Mail-Adresse im Parameter username
   • ein Benutzerpasswort im Parameter password

1. • ein Flag/Merker im Parameter rememberUser bezüglich dessen, ob man am Konto angemeldet bleibt
   • die Rückrufmethode OnAuthenticationSuccess bei einer erfolgreichen Benutzeranmeldung
   • die Rückrufmethode OnError bei einem Fehler

6. Fügen Sie die Logik für den Abruf einer Artikelliste im Inventar hinzu. Gehen Sie dazu in der OnAuthenticationSuccess-Methode wie folgt vor:
   1. Übermitteln Sie einen Autorisierungstoken an die Variable Token.Instance.

1. 2. Rufen Sie die SDK-Methode XsollaInventory.Instance.GetInventoryItems auf, und übermitteln Sie Ihr Folgendes:
      • eine Projekt-ID im Parameter projectId

1. 1. • die Methode OnItemsRequestSuccess bei erfolgreichem Abruf einer Artikelliste
      • die Rückrufmethode OnError bei einem Fehler

7. Fügen Sie für jeden empfangenen Artikel in der Methode OnItemsRequestSuccess eine Logik für das Erstellen eines Widgets hinzu:
   1. Prüfen Sie mithilfe der Methode InventoryItem.IsVirtualCurrency, ob der empfangenen Artikel keine virtuelle Währung ist.

1. 2. Instanziieren Sie ein Prefab eines Artikel-Widgets als untergeordnetes Container-Objekt.
   3. Hängen Sie die empfangene InventoryItemWidget-Komponente einer widget-Variable an.

8. Übermitteln Sie die folgenden Daten an das Artikel-Widget:
   1. Übermitteln Sie den Wert der Variable inventoryItem.name an das Element mit dem Artikelnamen.
   2. Übermitteln Sie den Wert der Variable inventoryItem.description an das Element mit der Artikelbeschreibung.
   3. Übermitteln Sie den Wert der Variable inventoryItem.amount.ToString() an das Element mit der Artikelmenge.
   4. Nutzen Sie zum Anzeigen eines Artikelbilds die Dienstprogrammmethode ImageLoader.Instance.GetImageAsync, und übermitteln Sie ihr Folgendes:
      • Bild-URL
      • Eine anonyme Funktion als Rückruf. Fügen Sie in dieser Funktion ein erhaltenes Sprite als Artikelbild ein.

Beispielhaftes Page-Controller-Skript:

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}");
        }
    }
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.