SDK für Unity auf Unternehmensebene / SDK aufseiten der Anwendung integrieren
  Alle Dokumentation

SDK für Unity auf Unternehmensebene

SDK aufseiten der Anwendung integrieren

  1. Gestalten Sie eine Benutzeroberfläche für das Anmeldesystem, den Ingame-Shop und sonstige Seiten Ihrer Anwendung.
  2. Implementieren Sie in Ihrer Anwendungslogik mithilfe von SDK-Methoden die Benutzerauthentifizierung, die Anzeige des Shops, den Kaufvorgang und mehr.
Hinweis
Sie können Ihre eigene Lösung erstellen, befolgen Sie dazu die Unity-Anleitung. Alternativ können Sie die Demoszene als Vorlage verwenden. Verwenden Sie den Benutzeroberflächen-Baukasten, um die Demoszene an Ihre Anwendung anzupassen.
Die grundlegenden SDK-Funktionen sind in den folgenden Schritt-für-Schritt-Tutorials erläutert:Die verwendeten Skripte finden Sie im SDK-Verzeichnis Assets/Xsolla/Samples.

Benutzeranmeldung über Benutzername/E-Mail-Adresse und Passwort

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.

Hinweis
Wenn Sie ein Login-Widget auf Ihrer Website verwenden (z. B. in einem Onlineshop), müssen auf Ihrer Website und in Ihrer Anwendung dieselben Benutzerauthentifizierungsmethoden implementiert sein. Das Widget verlangt für die Authentifizierung standardmäßig die E-Mail-Adresse. Um die Anmeldung über Benutzername zu ermöglichen, wenden Sie sich an Ihren Customer Success Manager. oder senden Sie eine E-Mail an csm@xsolla.com.
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, und legen Sie die Werte dafür im Inspector-Fenster fest.
  3. Fügen Sie die Logik hinzu, die den Klick auf die Schaltfläche "Registrieren" verarbeitet, wie im Beispielskript gezeigt.
Hinweis

In den Skriptbeispielen rufen die Methoden OnSuccess und OnError die Standardmethode Debug.Log auf. Im Falle eines Fehlers werden der Fehlercode und die ‑beschreibung im Parameter error übermittelt.

Sie können weitere Aktionen hinzufügen, z. B. eine Anmeldeseite nach erfolgreicher Registrierung oder eine Seite für das erneute Senden einer Registrierungsbestätigungs-E-Mail öffnen.

Beispielhaftes Skript für eine Registrierungsseite:
Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Xsolla.Samples.Authorization
{
	public class RegistrationPage : MonoBehaviour
	{
		// Declaration of variables for UI elements
		public InputField UsernameInput;
		public InputField EmailInputField;
		public InputField PasswordInputField;
		public Button RegisterButton;

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

				// Call the user registration method
				// Pass credentials and callback functions for success and error cases
				XsollaAuth.Register(username, password, email, OnSuccess, OnError);
			});
		}

		private void OnSuccess(LoginLink loginLink)
		{
			Debug.Log("Registration successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Registration failed. Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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.

Hinweis
Sie können die Registrierungsbestätigung per E-Mail-Adresse deaktivieren, wenn Ihre Sicherheitsstandards dies gestatten. Wenden Sie sich dafür an Ihren Customer Success Manager oder kontaktieren Sie uns unter csm@xsolla.com.

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, und legen Sie die Werte dafür im Inspector-Fenster fest.
  3. Fügen Sie die Logik hinzu, die den Klick auf die Schaltfläche "E-Mail erneut senden" verarbeitet, wie im Beispielskript gezeigt.

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

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

namespace Xsolla.Samples.Authorization
{
	public class ResendConfirmationEmailPage : MonoBehaviour
	{
		// Declaration of variables for UI elements
		public InputField UsernameInput;
		public Button ResendEmailButton;

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

				// Call the resend confirmation email method
				// Pass the username and callback functions for success and error cases
				XsollaAuth.ResendConfirmationLink(username, OnSuccess, OnError);
			});
		}

		private void OnSuccess()
		{
			Debug.Log("Resend confirmation email successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Resend confirmation email failed. Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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 die Logik hinzu, die den Klick auf die Schaltfläche "Anmelden" verarbeitet, wie im Beispielskript gezeigt.

Beispielhaftes Skript für eine Anmeldeseite:

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

namespace Xsolla.Samples.Authorization
{
	public class AuthorizationPage : MonoBehaviour
	{
		// Declaration of variables for UI elements
		public InputField UsernameInput;
		public InputField PasswordInputField;
		public Button SignInButton;

		private void Start()
		{
			// Handling the button click
			SignInButton.onClick.AddListener(() =>
			{
				// Get the username and password from input fields
				var username = UsernameInput.text;
				var password = PasswordInputField.text;

				// Call the user authorization method
				// Pass credentials and callback functions for success and error cases
				XsollaAuth.SignIn(username, password, OnSuccess, OnError);
			});
		}

		private void OnSuccess()
		{
			Debug.Log("Authorization successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Authorization failed. Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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, und legen Sie die Werte dafür im Inspector-Fenster fest.
  3. Fügen Sie die Logik hinzu, die den Klick auf die Schaltfläche "Passwort zurücksetzen" verarbeitet, wie im Beispielskript gezeigt.

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

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

namespace Xsolla.Samples.Authorization
{
	public class ResetPasswordPage : MonoBehaviour
	{
		// Declaration of variables for UI elements
		public InputField UsernameInput;
		public Button ResetPasswordButton;

		private void Start()
		{
			// Handling the button click
			ResetPasswordButton.onClick.AddListener(() =>
			{
				// Get the username from the input field
				var username = UsernameInput.text;

				// Call the password reset method
				// Pass the username and callback functions for success and error cases
				XsollaAuth.ResetPassword(username, OnSuccess, OnError);
			});
		}

		private void OnSuccess()
		{
			Debug.Log("Password reset successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Password reset failed. Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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.

Anmeldung über soziale Netzwerke

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.
Hinweis
Sie können die manuelle Verknüpfung von Social-Media-Konten implementieren. Fügen Sie dazu Ihrer Anwendung eine Seite hinzu, auf der Benutzer ihr Social-Media-Konto mit ihrem Benutzerkonto verknüpfen können. Verwenden Sie dafür im Page Controller die SDK-Methode LinkSocialProvider.
Dieses Tutorial beschreibt die Implementierung der folgenden Logik:

Die Beispiele zeigen die Einrichtung der Benutzeranmeldung über ein Facebook-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 die Logik hinzu, die den Klick auf die Schaltfläche "Anmelden" verarbeitet, wie im Beispielskript gezeigt.
Hinweis

In den Skriptbeispielen rufen die Methoden OnSuccess und OnError die Standardmethode Debug.Log auf. Sie können weitere Aktionen hinzufügen.

Im Falle eines Fehlers werden der Fehlercode und die ‑beschreibung im Parameter error übermittelt.

Beispielhaftes Skript für eine Anmeldeseite:
Copy
Full screen
Small screen
using UnityEngine;
using UnityEngine.UI;
using Xsolla.Auth;
using Xsolla.Core;

namespace Xsolla.Samples.Authorization
{
	public class SocialAuthorizationPage : MonoBehaviour
	{
		// Declaration of variables for SocialProvider and signIn button
		public SocialProvider SocialProvider = SocialProvider.Facebook;
		public Button SignInButton;

		private void Start()
		{
			// Handling the button click
			SignInButton.onClick.AddListener(() =>
			{
				// Call the social authorization method
				// Pass the social network provider and callback functions for success, error and cancel cases
				XsollaAuth.AuthViaSocialNetwork(SocialProvider, OnSuccess, OnError, OnCancel);
			});
		}

		private void OnSuccess()
		{
			Debug.Log("Social authorization successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Social authorization failed. Error: {error.errorMessage}");
			// Add actions taken in case of error
		}

		private void OnCancel()
		{
			Debug.Log("Social authorization cancelled by user.");
			// Add actions taken in case the user canceles authorization
		}
	}
}

Artikelkatalog anzeigen

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.

Hinweis

Im Rahmen des Beispiels wird für jeden Artikel in einem Katalog Folgendes angezeigt:

  • Artikelname
  • Artikelbeschreibung
  • Artikelpreis
  • Bild

Auch andere Informationen über den Artikel lassen sich anzeigen, sofern diese Informationen in einem Ingame-Shop hinterlegt sind.

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:

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

namespace Xsolla.Samples.DisplayCatalog
{
	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

  1. 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.
  2. Legen Sie Werte für die Variablen im Inspector-Fenster fest.

  1. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Artikelliste hinzu, wie im Skriptbeispiel gezeigt.
Hinweis

Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demo-Kontos (Benutzername: xsolla, Passwort: xsolla).

Im Skriptbeispiel ist keine seitenweise Anzeige von Artikeln im Katalog (Paginierung) implementiert. Nutzen Sie die Parameter offset und limit der SDK-Methode GetCatalog, um eine Paginierung zu implementieren. Maximal können 50 Artikel pro Seite angezeigt werden. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Paginierung erforderlich.

Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.DisplayCatalog
{
	public class VirtualItemsPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the items request from the store after successful authentication
			XsollaCatalog.GetCatalog(OnItemsRequestSuccess, OnError);
		}

		private void OnItemsRequestSuccess(StoreItems storeItems)
		{
			// Iterating the items collection
			foreach (var storeItem in storeItems.items)
			{
				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualItemWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = storeItem.name;
				widget.DescriptionText.text = storeItem.description;

				// The item can be purchased for real money or virtual currency
				// Checking the price type and assigning the values for appropriate UI elements
				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}";
				}

				// Loading the item image and assigning it to the UI element
				ImageLoader.LoadSprite(storeItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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:

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

namespace Xsolla.Samples.DisplayCatalog
{
	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:

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

namespace Xsolla.Samples.DisplayCatalog
{
	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 die folgenden Variablen:
    • GroupButtonsContainer — Container für Gruppenschaltflächen
    • GroupButtonPrefab — Schaltflächen-Prefab
    • ItemWidgetsContainer — Container für Artikel-Widgets
    • WidgetPrefab — Prefab des Artikel-Widgets

  1. 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.
  2. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
  3. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Artikelliste hinzu, wie im Skriptbeispiel gezeigt.
Hinweis

Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demo-Kontos (Benutzername: xsolla, Passwort: xsolla).

Im Skriptbeispiel ist keine seitenweise Anzeige von Artikeln im Katalog (Paginierung) implementiert. Nutzen Sie die Parameter offset und limit der SDK-Methode GetCatalog, um eine Paginierung zu implementieren. Maximal können 50 Artikel pro Seite angezeigt werden. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Paginierung erforderlich.

Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using System.Collections.Generic;
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.DisplayCatalog
{
	public class VirtualItemsByGroupsPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform GroupButtonsContainer;
		public GameObject GroupButtonPrefab;
		public Transform ItemWidgetsContainer;
		public GameObject ItemWidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the items request from the store after successful authentication
			// Pass the callback functions for success and error cases
			XsollaCatalog.GetCatalog(OnItemsRequestSuccess, OnError);
		}

		private void OnItemsRequestSuccess(StoreItems storeItems)
		{
			// Selecting the group’s name from items and order them alphabetically
			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 catalog category with all items regardless of group affiliation
			groupNames.Insert(0, "All");

			// Iterating the group names collection
			foreach (var groupName in groupNames)
			{
				// Instantiating the button prefab as child of the container
				var buttonGo = Instantiate(GroupButtonPrefab, GroupButtonsContainer, false);
				var groupButton = buttonGo.GetComponent<VirtualItemGroupButton>();

				// Assigning the values for UI elements
				groupButton.NameText.text = groupName;

				// Adding listener for button click event
				groupButton.Button.onClick.AddListener(() => OnGroupSelected(groupName, storeItems));
			}

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

		private void OnGroupSelected(string groupName, StoreItems storeItems)
		{
			// Clear container
			DeleteAllChildren(ItemWidgetsContainer);

			// Declaring variable for items to be displayed on the page
			IEnumerable<StoreItem> itemsForDisplay;
			if (groupName == "All")
			{
				itemsForDisplay = storeItems.items;
			}
			else
			{
				itemsForDisplay = storeItems.items.Where(item => item.groups.Any(group => group.name == groupName));
			}

			// Iterating the items collection and assigning values for appropriate UI elements
			foreach (var storeItem in itemsForDisplay)
			{
				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(ItemWidgetPrefab, ItemWidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualItemWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = storeItem.name;
				widget.DescriptionText.text = storeItem.description;

				// The item can be purchased for real money or virtual currency
				// Checking the price type and assigning the appropriate value for price text
				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}";
				}

				// Loading the image for item icon and assigning it to the UI element
				ImageLoader.LoadSprite(storeItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			//  Add actions taken in case of error
		}

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

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

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:

    • 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:

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

namespace Xsolla.Samples.DisplayCatalog
{
	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 die folgenden Variablen:
    • WidgetsContainer — Container für Widgets
    • WidgetPrefab — Prefab des Bundle-Widgets

  1. 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.

  1. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
  2. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Artikelliste hinzu, wie im Skriptbeispiel gezeigt.
Hinweis

Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demo-Kontos (Benutzername: xsolla, Passwort: xsolla).

Im Skriptbeispiel ist keine seitenweise Anzeige von Artikeln im Katalog (Paginierung) implementiert. Nutzen Sie die Parameter offset und limit der SDK-Methode GetCatalog, um eine Paginierung zu implementieren. Maximal können 50 Artikel pro Seite angezeigt werden. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Paginierung erforderlich.

Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.DisplayCatalog
{
	public class BundlesPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the bundle request from the store after successful authentication
			// Pass the callback functions for success and error cases
			XsollaCatalog.GetBundles(OnBundlesRequestSuccess, OnError);
		}

		private void OnBundlesRequestSuccess(BundleItems bundleItems)
		{
			// Iterating the bundles collection
			foreach (var bundleItem in bundleItems.items)
			{
				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<BundleWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = bundleItem.name;
				widget.DescriptionText.text = bundleItem.description;

				// Creating the string with bundle content and assigning it to the UI element
				var bundleContent = bundleItem.content.Select(x => $"{x.name} x {x.quantity}");
				widget.ContentText.text = string.Join("\n", bundleContent);

				// The bundle can be purchased for real money or virtual currency
				// Checking the price type and assigning the values for appropriate UI elements
				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}";
				}

				// Loading the bundle image and assigning it to the UI element
				ImageLoader.LoadSprite(bundleItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

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:

    • 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:

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

namespace Xsolla.Samples.DisplayCatalog
{
	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 die folgenden Variablen:
    • WidgetsContainer — Container für Widgets
    • WidgetPrefab — Prefab des virtuellen Währungspakets

  1. 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.
  2. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
  3. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Liste der virtuellen Währungen hinzu, wie im Skriptbeispiel gezeigt.
Hinweis

Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demo-Kontos (Benutzername: xsolla, Passwort: xsolla).

Im Skriptbeispiel ist keine seitenweise Anzeige von Artikeln im Katalog (Paginierung) implementiert. Nutzen Sie die Parameter offset und limit der SDK-Methode GetCatalog, um eine Paginierung zu implementieren. Maximal können 50 Artikel pro Seite angezeigt werden. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Paginierung erforderlich.

Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.DisplayCatalog
{
	public class VirtualCurrencyPackagesPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// After successful authentication starting the request for packages from store
			// Pass the callback functions for success and error cases
			XsollaCatalog.GetVirtualCurrencyPackagesList(OnPackagesRequestSuccess, OnError);
		}

		private void OnPackagesRequestSuccess(VirtualCurrencyPackages packageItems)
		{
			// Iterating the virtual currency packages collection
			foreach (var packageItem in packageItems.items)
			{
				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualCurrencyPackageWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = packageItem.name;
				widget.DescriptionText.text = packageItem.description;

				// The package can be purchased for real money or virtual currency
				// Checking the price type and assigning the values for appropriate UI elements
				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}";
				}

				// Loading the package image and assigning it to the UI element
				ImageLoader.LoadSprite(packageItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Virtuelle Gegenstände gegen echte Währung verkaufen

In diesem Abschnitt wird erklärt, wie Sie mit den 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:

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

namespace Xsolla.Samples.SellForRealMoney
{
	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 Skript VirtualItemsPage.
  2. Fügen Sie die Logik hinzu, die den Klick auf die Schaltfläche "Virtuellen Gegenstand kaufen" verarbeitet, wie im Beispielskript gezeigt.
Hinweis

Im Skriptbeispiel rufen wir die Basismethode Debug.Log auf, wenn der Artikelkauf erfolgreich ist. Sie können weitere Aktionen hinzufügen, z. B. die Inventaranzeige usw.

Standardmäßig wird die Bezahlseite in einem integrierten Browser geöffnet. Damit sie in einem externen Browser geöffnet wird, navigieren Sie im Hauptmenü des Unity-Editors zu Window > Xsolla > Edit Settings, und entfernen Sie im Inspector-Fenster das Häkchen bei Enable in-app browser?. Wenn Sie bei Android-Apps einen externen Browser verwenden, empfehlen wir, Deep Links einzurichten, damit der Benutzer nach einer Zahlung zur App weitergeleitet wird.

Beispielhaftes Skript für eine Seite:
Copy
Full screen
Small screen
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.SellForRealMoney
{
	public class VirtualItemsPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the items request from the store after successful authentication
			// Pass the callback functions for success and error cases
			XsollaCatalog.GetCatalog(OnItemsRequestSuccess, OnError);
		}

		private void OnItemsRequestSuccess(StoreItems storeItems)
		{
			// Iterating the items collection
			foreach (var storeItem in storeItems.items)
			{
				// Skipping items without prices in real money
				if (storeItem.price == null)
					continue;

				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualItemWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = storeItem.name;
				widget.DescriptionText.text = storeItem.description;

				// Assigning the price and currency values for UI elements
				var price = storeItem.price;
				widget.PriceText.text = $"{price.amount} {price.currency}";

				// Loading the item image and assigning it to the UI element
				ImageLoader.LoadSprite(storeItem.image_url, sprite => widget.IconImage.sprite = sprite);

				// Assigning the click listener for the buy button
				widget.BuyButton.onClick.AddListener(() =>
				{
					// Starting the purchase process
					// Pass the item SKU and callback functions for success and error cases
					XsollaCatalog.Purchase(storeItem.sku, OnPurchaseSuccess, OnError);
				});
			}
		}

		private void OnPurchaseSuccess(OrderStatus status)
		{
			Debug.Log("Purchase successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

Virtuelle Gegenstände gegen virtuelle Währung verkaufen

In diesem Abschnitt wird erklärt, wie Sie mit den 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 virtuelle 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:

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

namespace Xsolla.Samples.SellForVirtualCurrency
{
	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 Skript VirtualItemsPage.
  2. Fügen Sie die Logik hinzu, die den Klick auf die Schaltfläche "Virtuellen Gegenstand kaufen" verarbeitet, wie im Beispielskript gezeigt.
Hinweis

Im Skriptbeispiel rufen wir die Basismethode Debug.Log auf, wenn der Artikelkauf erfolgreich ist. Sie können weitere Aktionen hinzufügen, z. B. die Inventaranzeige, Änderung des virtuellen Währungsguthabens usw.

Eine Logik für das Hinzufügen von gekauften Artikeln zum Inventar muss nicht hinzugefügt werden, das geschieht automatisch.

Beispielhaftes Skript für eine Seite:
Copy
Full screen
Small screen
using System.Linq;
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Catalog;
using Xsolla.Core;

namespace Xsolla.Samples.SellForVirtualCurrency
{
	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
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// After successful authentication starting the request for catalog from store
			// Pass the callback functions for success and error cases
			XsollaCatalog.GetCatalog(OnItemsRequestSuccess, OnError);
		}

		private void OnItemsRequestSuccess(StoreItems storeItems)
		{
			// Iterating the items collection
			foreach (var storeItem in storeItems.items)
			{
				// Skipping items without prices in virtual currency
				if (storeItem.virtual_prices.Length == 0)
					continue;

				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualItemWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = storeItem.name;
				widget.DescriptionText.text = storeItem.description;

				// Assigning the price and currency values for UI elements
				// The first price is used for the sake of simplicity
				var price = storeItem.virtual_prices.First(x => x.is_default);
				widget.PriceText.text = $"{price.name}: {price.amount}";

				// Loading the item image and assigning it to the UI element
				ImageLoader.LoadSprite(storeItem.image_url, sprite => widget.IconImage.sprite = sprite);

				// Assigning the click listener for the buy button
				widget.BuyButton.onClick.AddListener(() =>
				{
					// Starting the purchase process
					// Pass the item SKU, the price virtual currency SKU and callback functions for success and error cases
					XsollaCatalog.PurchaseForVirtualCurrency(storeItem.sku, price.sku, OnPurchaseSuccess, OnError);
				});
			}
		}

		private void OnPurchaseSuccess(OrderStatus status)
		{
			Debug.Log("Purchase successful");
			// Add actions taken in case of success
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

Virtuelles Währungsguthaben anzeigen

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:

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

namespace Xsolla.Samples.DisplayVirtualCurrencyBalance
{
	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

  1. 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.

  1. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
  2. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Liste der virtuellen Währungen hinzu, wie im Skriptbeispiel gezeigt.
Hinweis
Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demokontos (Benutzername: xsolla, Passwort: xsolla).
Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Core;
using Xsolla.Inventory;

namespace Xsolla.Samples.DisplayVirtualCurrencyBalance
{
	public class VirtualCurrenciesPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the virtual currencies request from the store after successful authentication
			// Pass the callback functions for success and error cases
			XsollaInventory.GetVirtualCurrencyBalance(OnBalanceRequestSuccess, OnError);
		}

		private void OnBalanceRequestSuccess(VirtualCurrencyBalances balance)
		{
			// Iterating the virtual currency balances collection
			foreach (var balanceItem in balance.items)
			{
				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<VirtualCurrencyWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = balanceItem.name;
				widget.AmountText.text = balanceItem.amount.ToString();

				ImageLoader.LoadSprite(balanceItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

Artikel im Inventar anzeigen

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:

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

namespace Xsolla.Samples.DisplayItemsInInventory
{
	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

  1. 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.

  1. Legen Sie Werte für die Variablen im Inspector-Fenster fest.
  2. Fügen Sie die Anmeldelogik und die Logik für den Abruf der Liste der im Inventar befindlichen Artikel hinzu.
Hinweis
Im Skriptbeispiel verwenden wir zur Anmeldung die Anmeldedaten eines Demokontos (Benutzername: xsolla, Passwort: xsolla).
Beispielhaftes Page-Controller-Skript:
Copy
Full screen
Small screen
using UnityEngine;
using Xsolla.Auth;
using Xsolla.Core;
using Xsolla.Inventory;

namespace Xsolla.Samples.DisplayItemsInInventory
{
	public class InventoryItemsPage : MonoBehaviour
	{
		// Declaration of variables for widget's container and prefab
		public Transform WidgetsContainer;
		public GameObject WidgetPrefab;

		private void Start()
		{
			// Starting the authentication process
			// Pass the credentials and callback functions for success and error cases
			// The credentials (username and password) are hard-coded for simplicity
			XsollaAuth.SignIn("xsolla", "xsolla", OnAuthenticationSuccess, OnError);
		}

		private void OnAuthenticationSuccess()
		{
			// Starting the items request from the store after successful authentication
			// Pass the callback functions for success and error cases
			XsollaInventory.GetInventoryItems(OnItemsRequestSuccess, OnError);
		}

		private void OnItemsRequestSuccess(InventoryItems inventoryItems)
		{
			// Iterating the items collection
			foreach (var inventoryItem in inventoryItems.items)
			{
				// Skipping virtual currency items
				if (inventoryItem.VirtualItemType == VirtualItemType.VirtualCurrency)
					continue;

				// Instantiating the widget prefab as child of the container
				var widgetGo = Instantiate(WidgetPrefab, WidgetsContainer, false);
				var widget = widgetGo.GetComponent<InventoryItemWidget>();

				// Assigning the values for UI elements
				widget.NameText.text = inventoryItem.name;
				widget.DescriptionText.text = inventoryItem.description;
				widget.QuantityText.text = inventoryItem.quantity.ToString();

				// Loading the item image and assigning it to the UI element
				ImageLoader.LoadSprite(inventoryItem.image_url, sprite => widget.IconImage.sprite = sprite);
			}
		}

		private void OnError(Error error)
		{
			Debug.LogError($"Error: {error.errorMessage}");
			// Add actions taken in case of error
		}
	}
}

Das folgende Bild zeigt das Arbeitsergebnis des Skripts.

War dieser Artikel hilfreich?
Vielen Dank!
Gibt es etwas, das wir verbessern können? Nachricht
Das tut uns leid
Bitte erläutern Sie, weshalb dieser Artikel nicht hilfreich ist. Nachricht
Vielen Dank für Ihr Feedback!
Wir werden Ihr Feedback aufgreifen und dazu nutzen, Ihr Erlebnis verbessern.

Nützliche Links

Letztmalig aktualisiert: 10. Oktober 2023

Haben Sie einen Tippfehler oder einen anderen Textfehler gefunden? Wählen Sie den Text aus und drücken Sie Strg+Eingabe.

Problem melden
Wir überprüfen unsere Inhalte ständig. Ihr Feedback hilft uns, sie zu verbessern.
Geben Sie eine E-Mail-Adresse an, damit wir Sie erreichen können
Vielen Dank für Ihr Feedback!