SDK aufseiten der Anwendung integrieren

  1. Entwerfen Sie eine Benutzeroberfläche für das Anmeldesystem, den Ingame-Shop und sonstige Seiten Ihrer Anwendung.
  2. Richten Sie die Ereignisbehandlung gemäß Ihrer Anwendungslogik mithilfe der SDK-Methoden ein. Befolgen Sie die nachstehenden Schritt-für-Schritt-Tutorials, um die grundlegenden SDK-Funktionen kennenzulernen.

Hinweis

Sie können Ihre eigene Lösung erstellen, befolgen Sie dazu die UMG UI-Dokumentation. Alternativ können Sie die Demo-Map als Vorlage verwenden. Um die Benutzeroberfläche der Demoszene an Ihre Anwendung anzupassen, verwenden Sie den Benutzeroberflächen-Baukasten.

Befolgen Sie die Anleitung für die SDK-Modifizierung, um das SDK für Ihre Anwendung zu modifizieren.

In den folgenden Schritt-für-Schritt-Anleitungen erfahren Sie mehr über die grundlegenden SDK-Funktionen.

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

Dieses Tutorial 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
Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

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 verwendet standardmäßig die E-Mail-Adresse zur Authentifizierung. Um die Benutzeranmeldung über Benutzernamen einzurichten, wenden Sie sich an Ihren Account Manager.

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

Widget erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Benutzername-Feld
    • E-Mail-Adresse-Feld
    • Benutzerpasswort-Feld
    • Registrierungsschaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Sorgen Sie dafür, dass das Widget beim Levelstart angezeigt wird. Fügen Sie dazu, wie unten gezeigt, Knoten hinzu. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Ereignisbehandlung hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine Registrierungsschaltfläche aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Verknüpfen Sie einen RegisterUser-Methodenaufruf auf dem XsollaLoginSubsystem-Objekt mit dem OnClicked-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
  3. Fügen Sie folgende Rückruffunktionen hinzu:
    • OnRegistered — wird nach erfolgreicher Registrierung aufgerufen
    • OnError — wird bei einem Problem aufgerufen

Hinweis
Im Beispiel der Ereignisbehandlung nutzen die Rückruffunktionen die Klasse PrintString. Ein Code und eine Fehlerbeschreibung werden in den Parametern Code und Description übermittelt. Sie können weitere Aktionen hinzufügen, z. B. eine Anmeldeseite oder eine Seite für das erneute Senden einer Bestätigungs-E-Mail nach erfolgreicher Registrierung öffnen.

  1. Starten Sie ein Level, um mit dem Widget-Debugging zu beginnen.

Beispielhafte Implementierung einer Ereignisbehandlung:

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

Widget erstellen

  1. Wechseln Sie zum Content Browser, und öffnen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Benutzername-/E-Mail-Adresse-Feld
    • "E-Mail erneut senden"-Schaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Ereignisbehandlung hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine "E-Mail erneut senden"-Schaltfläche aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Verknüpfen Sie einen ResendAccountConfirmationEmail-Methodenaufruf auf dem XsollaLoginSubsystem-Objekt mit dem OnClicked-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
  3. Fügen Sie die Rückruffunktionen OnEmailResent und OnError hinzu.
  4. Starten Sie ein Level, um mit dem Widget-Debugging zu beginnen.

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

Beispielhafte Implementierung einer Ereignisbehandlung:

Benutzeranmeldung implementieren

Widget erstellen

  1. Wechseln Sie zum Content Browser, und öffnen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Benutzername-Feld
    • Passwort-Feld
    • "Angemeldet bleiben"-Kontrollkästchen
    • Anmeldeschaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Ereignisbehandlung hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine Anmeldeschaltfläche aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Verknüpfen Sie einen AuthenticateUser-Methodenaufruf auf dem XsollaLoginSubsystem-Objekt mit dem OnClicked-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
  3. Fügen Sie die Rückruffunktionen OnAuthenticated und OnError hinzu.

Hinweis
Nach erfolgreicher Benutzeranmeldung wird der Autorisierungstoken im Parameter LoginData übermittelt. Der Autorisierungstoken kommt in Anfragen an Xsolla-Server zum Einsatz.

  1. Starten Sie ein Level, um mit dem Widget-Debugging zu beginnen.

Beispielhafte Implementierung einer Ereignisbehandlung:

Zurücksetzen von Passwörtern implementieren

Widget erstellen

  1. Wechseln Sie zum Content Browser, und öffnen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Benutzername-/E-Mail-Adresse-Feld
    • "Passwort zurücksetzen"-Schaltfläche

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Ereignisbehandlung hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine "Passwort zurücksetzen"-Schaltfläche aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Verknüpfen Sie einen ResetUserPassword-Methodenaufruf auf dem XsollaLoginSubsystem-Objekt mit dem OnClicked-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
  3. Fügen Sie die Rückruffunktionen OnEmailSent und OnError hinzu.
  4. Starten Sie ein Level, um mit dem Widget-Debugging zu beginnen.

Beispielhafte Implementierung einer Ereignisbehandlung:

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 > Allgemeine Einstellungen > URL > Rückruf-URL eine URL-Adresse oder einen Pfad festlegen, an die bzw. der der Benutzer nach einer erfolgreichen Authentifizierung, der Bestätigung seiner E-Mail-Adresse oder dem Zurücksetzen seines Passworts weitergeleitet wird.

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

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.

Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.
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 LinkSocialNetworkToUserAccount.

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.

Widget erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis.
  2. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  3. Fügen Sie im Widget-Blueprint die Schaltfläche für das Anmelden über das soziale Netzwerk hinzu.

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Sorgen Sie dafür, dass das Widget beim Levelstart angezeigt wird. Fügen Sie dazu, wie unten gezeigt, Knoten hinzu. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Ereignisbehandlung hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine Anmeldeschaltfläche aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Implementieren Sie das Öffnen der Anmeldeseite in einem integrierten Browser:

    1. Verknüpfen Sie einen mit dem XsollaLoginSubsystem-Objekt verbundenen GetSocialAuthenticationUrl-Methodenaufruf mit dem OnClicked-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu. Übermitteln Sie den Wert Twitter an den Parameter ProviderName.
    2. Fügen Sie folgende Rückruffunktionen hinzu:
      • OnUrlReceived — wird beim erfolgreichen Empfang einer Seiten-URL aufgerufen. Die empfangene URL wird im Parameter Url übermittelt.
      • OnError — wird bei einem Problem aufgerufen.

Hinweis
Im Beispiel der Ereignisbehandlung nutzt die Rückruffunktion OnError die Klasse PrintString. Ein Code und eine Fehlerbeschreibung werden in den Parametern Code und Description übermittelt. Sie können weitere Aktionen hinzufügen.

  1. Implementieren Sie die Benutzeranmeldung:
    1. Rufen Sie die mit dem XsollaLoginSubsystem-Objekt verbundene SDK-Methode LaunchSocialAuthentication auf.
    2. Übermitteln Sie die URL einer Anmeldeseite.

  1. Um einen Token abzurufen, tracken Sie die Änderung der Anmeldeseiten-URL:
    1. Implementieren Sie das Schließen eines Browsers nach der erfolgreichen Anmeldung.
    2. Rufen Sie die Methode OnSocialAuthCompleted auf, und abonnieren Sie ein BrowserClosed-Ereignis.

Hinweis
Der Abruf eines Tokens aus einer URL erfolgt durch den Blueprint eines integrierten Browsers. Der Autorisierungstoken wird an den Parameter LoginData übermittelt. Verwenden Sie ihn in Anfragen an Xsolla-Server.

Beispielhafte Implementierung einer Ereignisbehandlung:

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

Anzeige von Artikelkatalog

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
Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

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.

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

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

Widget für Katalogseite erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis.
  2. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  3. Fügen Sie im Widget-Blueprint die folgenden Benutzeroberflächenelemente hinzu:

    • Schaltflächen für den Wechsel zwischen der Anzeige von Artikeln und der Anzeige von virtuellen Währungspaketen
    • einen Anzeigebereich für Artikelgruppen
    • einen Anzeigebereich für die Artikelliste
    • einen Anzeigebereich für die Liste der virtuellen Währungspakete

Das folgende Bild zeigt einen beispielhaften Seitenaufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Sorgen Sie dafür, dass das Widget beim Levelstart angezeigt wird. Fügen Sie dazu, wie unten gezeigt, Knoten hinzu. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Widget-Ereignisbehandlung für Katalogseite hinzufügen

  1. Wählen Sie im Hierarchy-Fenster eine Schaltfläche für den Wechsel zur Artikelliste aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Wählen Sie im Hierarchy-Fenster eine Schaltfläche für den Wechsel zur Liste der virtuellen Gegenstände aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Implementieren Sie die Logik für den Wechsel zwischen den Listen. Fügen Sie dazu die Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Anzeige von Gruppen virtueller Gegenstände implementieren

Klasse für Artikelgruppe erstellen

  1. Wechseln Sie zum Content Browser. Klicken Sie im dortigen Kontextmenü auf Blueprint Class.
  2. Wählen Sie im Abschnitt All classes die Option Object aus, und klicken Sie auf Select.
  3. Geben Sie BP_ItemGroupData als Klassenname an.
  4. Öffnen Sie den Blueprint einer erstellten Klasse.
  5. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  6. Gehen Sie im Details-Feld wie folgt vor:

    1. Geben Sie im Variable Name-Feld GroupData an.
    2. Wählen Sie im Feld Variable Type die Option XsollaItemGroup aus.
    3. Aktivieren Sie die Kontrollkästchen Instance Editable und Expose on Spawn.

Widget für Artikelgruppe erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint ein Element für den Namen der Artikelgruppe hinzu.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Klicken Sie auf Class settings.
  3. Navigieren Sie im Details-Fenster zu Interfaces > Implemented interfaces.
  4. Klicken sie auf Add, und wählen Sie UserObjectListEntry aus. Dabei handelt es sich um eine standardmäßige UE-Benutzeroberfläche, die es dem UI-Primitive gestattet, ein für das Listenelement normales Verhalten zu implementieren.
  5. Implementieren Sie die Logik zum Erstellen einer Artikelgruppe:

    1. Fügen Sie den EventOnListItemObjectSet-Knoten hinzu, um ein Listenelement erstellen und das Widget initialisieren zu können.
    2. Übermitteln Sie den Wert aus dem Objekt mit den Gruppendaten an das Element mit dem Gruppennamen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

    1. Implementieren Sie eine Logik für die Anzeige aller Artikel aus der Kategorie All. Bearbeiten Sie dazu einen Blueprint wie in der folgenden Abbildung gezeigt.

  1. Implementieren Sie eine Logik zum Hervorheben einer in der Liste ausgewählten Artikelgruppe. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Liste der Artikelgruppen zur Katalogseite hinzufügen

  1. Öffnen Sie den Widget-Blueprint der Katalogseite.
  2. Fügen Sie das Element List View zum Anzeigebereich der Artikelgruppen hinzu.
  3. Wählen Sie im Details-Fenster im Feld Entry Widget Class eine zuvor erstellte Klasse für eine Artikelgruppe aus.
  4. Implementieren Sie eine Logik für das Hinzufügen von Artikeln zu Gruppen:

    1. Öffnen Sie eine Graph-Anzeige.
    2. Verknüpfen Sie einen mit dem XsollaLoginSubsystem-Objekt verbundenen GetItemGroups-SDK-Methodenaufruf mit dem EventConstruct-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
    3. Implementieren Sie die Logik, die Artikel Gruppen zuteilt. Die Aktion sollte während der erfolgreichen Aktualisierung der Virtuellen-Gegenstände-Gruppe erfolgen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

  1. Implementieren Sie eine Logik für die Anzeige aller Artikel aus der Kategorie All. Bearbeiten Sie dazu einen Blueprint wie in der folgenden Abbildung gezeigt.

Anzeige von virtuellen Gegenständen erstellen

Klasse für Artikel erstellen

  1. Wechseln Sie zum Content Browser. Klicken Sie im dortigen Kontextmenü auf Blueprint Class.
  2. Wählen Sie im Abschnitt All classes die Option Object aus, und klicken Sie auf Select.
  3. Geben Sie BP_CatalogItemData als Klassenname an.
  4. Öffnen Sie den Blueprint einer erstellten Klasse.
  5. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  6. Gehen Sie im Details-Feld wie folgt vor:

    1. Geben Sie im CatalogItem-Feld Variable Name an.
    2. Wählen Sie im Feld StoreItem die Option Variable Type aus.
    3. Aktivieren Sie das Kontrollkästchen Instance Editable und Expose on Spawn.

Widget für Artikel erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Artikelname
    • Artikelpreis

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Klicken Sie auf Class settings.
  3. Navigieren Sie im Details-Fenster zu Interfaces > Implemented interfaces.
  4. Klicken sie auf Add, und wählen Sie UserObjectListEntry aus. Dabei handelt es sich um eine standardmäßige UE-Benutzeroberfläche, die es dem UI-Primitive gestattet, ein für das Listenelement normales Verhalten zu implementieren.
  5. Implementieren Sie die Logik zum Erstellen einer Artikelgruppe:

    1. Fügen Sie den EventOnListItemObjectSet-Knoten hinzu, um ein Listenelement erstellen und das Widget initialisieren zu können.
    2. Übermitteln Sie die Werte aus dem Objekt mit den Artikeldaten an die Elemente mit dem Artikelnamen und ‑preis. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Artikelliste zur Katalogseite hinzufügen

  1. Öffnen Sie den Widget-Blueprint der Katalogseite.
  2. Fügen Sie das Element List View zum Anzeigebereich der Artikelliste hinzu.
  3. Wählen Sie im Details-Fenster im Feld Entry Widget Class eine zuvor erstellte Klasse für einen Artikel aus.
  4. Implementieren Sie eine Logik für das Hinzufügen von Artikeln zu Gruppen:

    1. Öffnen Sie eine Graph-Anzeige.
    2. Verknüpfen Sie einen mit dem XsollaLoginSubsystem-Objekt verbundenen GetVirtualItems-SDK-Methodenaufruf mit dem EventConstruct-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
    3. Implementieren Sie die Logik, die Artikel Gruppen zuteilt. Die Aktion sollte während der erfolgreichen Aktualisierung der Virtuellen-Gegenstände-Gruppe erfolgen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Hinweis
Die Parameter offset und limit der GetVirtualItems-Methode sind nicht zwingend erforderlich, jedoch lässt sich darüber eine Seitennummerierung implementieren, also eine seitenweise Anzeige der Artikel im Katalog. Die maximale Anzahl von Artikeln pro Seite beträgt 50. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Seitennummerierung erforderlich.

  1. Implementieren Sie eine Logik, die prüft, ob ein Artikel einer bestimmten Gruppe zugeordnet ist. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung dargestellt.

  1. Implementieren Sie eine Logik, die Artikel Gruppen zuteilt. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Anzeige von virtuellen Gegenständen anhand von Gruppen implementieren

  1. Öffnen Sie den Widget-Blueprint der Katalogseite.
  2. Wählen Sie im Hierarchy-Fenster die Liste der Artikelgruppen aus.
  3. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Item Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Implementieren Sie die Logik für das Filtern von Artikeln anhand von Gruppen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Hinweis
Artikel werden anhand einer individuellen Gruppenkennung gefiltert. Die Kategorie All besitzt keine Kennung, weswegen der Filter zurückgesetzt wird und alle Artikel angezeigt werden.

Anzeige von Bundles implementieren

In dieser Anleitung werden Bundles und virtuelle Gegenstände in einer Liste angezeigt. Außerdem verwenden wir dasselbe Widget für die Anzeige eines einzelnen Bundles oder Artikels.

Bundles-Liste auf Katalogseiten hinzufügen

  1. Öffnen Sie einen Katalogseiten-Blueprint.
  2. Öffnen Sie eine Graph-Anzeige.
  3. Ergänzen Sie die Logik für das Hinzufügen von Bundles zu einer Liste. Fügen Sie den GetBundles-SDK-Methodenrückruf sowie den GetVirtualItems-Methodenrückruf hinzu, wie in der folgenden Abbildung gezeigt.

Item-Widget fertigstellen

  1. Öffnen Sie ein Artikel-Widget-Blueprint.
  2. Fügen Sie eine Schaltfläche zum Anzeigen des Bundle-Inhalts neben dem Artikelnamen hinzu.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Ergänzen Sie die Logik zum Erstellen eines Artikels. Fügen Sie dazu eine Anzeigebedingung für eine Schaltfläche zum Anzeigen von Bundle-Inhalten hinzu. Das folgende Bild dient dabei als Beispiel.

Logik für die Anzeige von Bundle-Inhalten hinzufügen

  1. Öffnen Sie im Blueprint des Artikel-Widgets eine Designer-Anzeige.
  2. Wählen Sie im Hierarchy-Fenster eine Schaltfläche für die Anzeige des Bundle-Inhalts aus.
  3. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Implementieren Sie eine Logik für die Anzeige von Bundle-Inhalten (eine Liste der im Bundle enthaltenen Artikel und die Stückzahl jedes Artikels im Bundle). Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Anzeige von virtuellen Währungspaketen implementieren

Klasse für virtuelle Währungspakete erstellen

  1. Wechseln Sie zum Content Browser. Klicken Sie im dortigen Kontextmenü auf Blueprint Class.
  2. Wählen Sie im Abschnitt All classes die Option Object aus, und klicken Sie auf Select.
  3. Geben Sie BP_VcPackItemData als Klassenname an.
  4. Öffnen Sie den Blueprint einer erstellten Klasse.
  5. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  6. Gehen Sie im Details-Feld wie folgt vor:

    1. Geben Sie im PackItem-Feld Variable Name an.
    2. Wählen Sie im Feld VirtualCurrencyPackage die Option Variable Type aus.
    3. Aktivieren Sie das Kontrollkästchen Instance Editable und Expose on Spawn.

Widget für virtuelles Währungspaket erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Paketname
    • Paketpreis

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Klicken Sie auf Class settings.
  3. Navigieren Sie im Details-Fenster zu Interfaces > Implemented interfaces.
  4. Klicken sie auf Add, und wählen Sie UserObjectListEntry aus. Dabei handelt es sich um eine standardmäßige UE-Benutzeroberfläche, die es dem UI-Primitive gestattet, ein für das Listenelement normales Verhalten zu implementieren.
  5. Implementieren Sie die Logik zum Erstellen einer Artikelgruppe:

    1. Fügen Sie den EventOnListItemObjectSet-Knoten hinzu, um ein Listenelement erstellen und das Widget initialisieren zu können.
    2. Übermitteln Sie den Wert aus dem Objekt mit den Paketdaten an das Element mit dem Paketnamen und ‑preis. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Liste der virtuellen Währungspakete auf Katalogseiten hinzufügen

  1. Öffnen Sie den Widget-Blueprint der Katalogseite.
  2. Fügen Sie das Element List View zum Anzeigebereich der Liste der virtuellen Währungspakete hinzu.
  3. Wählen Sie im Details-Fenster im Feld Entry Widget Class eine zuvor erstellte Klasse für ein virtuelles Währungspaket aus.
  4. Implementieren Sie die Logik für das Hinzufügen von Paketen zur Liste:

    1. Öffnen Sie eine Graph-Anzeige.
    2. Verknüpfen Sie einen mit dem XsollaStoreSubsystem-Objekt verbundenen GetVirtualCurrencyPackage-Methodenaufruf mit dem EventConstruct-Knoten, und fügen Sie die Übermittlung der von Benutzern eingegebenen Daten hinzu.
    3. Implementieren Sie die Logik für das Hinzufügen eines Pakets zur Liste. Die Aktion sollte während der erfolgreichen Aktualisierung des virtuellen Währungspakets erfolgen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Hinweis
Die Parameter offset und limit der GetVirtualCurrencyPackage-Methode sind nicht zwingend erforderlich, jedoch lässt sich darüber eine Seitennummerierung implementieren, also eine seitenweise Anzeige der Artikel im Katalog. Die maximale Anzahl von Artikeln pro Seite beträgt 50. Wenn der Katalog mehr als 50 Artikel enthält, ist eine Seitennummerierung erforderlich.
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.
Ausblenden

Virtuelle Gegenstände gegen echte Währung verkaufen

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.

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.

Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

Katalogseiten-Widget fertigstellen

  1. Öffnen Sie das Katalogseiten-Widget.
  2. Öffnen Sie eine Graph-Anzeige.
  3. So öffnen Sie eine Zahlungsseite in einem Browser:
    1. Implementieren Sie den Erhalt eines Zahlungstokens:
      1. Fügen Sie den InitiatePurchase-Knoten hinzu, und verknüpfen Sie ihn mit dem SDK-Methodenaufruf FetchPaymentToken, der mit dem XsollaStoreSubsystem-Objekt verbunden ist.
      2. Übermitteln sie der FetchPaymentToken-Methode die SKU eines gekauften Artikels und einen Benutzerautorisierungstoken.

Hinweis
Sie können einen der folgenden Token verwenden:

    1. Rufen Sie die mit dem LaunchPaymentConsole-Objekt verknüpfte SDK-Methode XsollaStoreSubsystem auf, und übermitteln Sie ihr einen Zahlungstoken.

Beispiel für das Öffnen der Zahlungsseite und die Implementierung des Zahlungsstatusempfangs:

Artikeldatenklasse erweitern

  1. Öffnen Sie den Blueprint BP_CatalogItemData.
  2. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  3. Gehen Sie im Details-Fenster wie folgt vor:

    1. Geben Sie im CatalogWidget-Feld Variable Name an.
    2. Wählen Sie im Feld Variable Typedie Option W_StoreCatalog aus.
    3. Aktivieren Sie das Kontrollkästchen bei Instance Editable und Expose on Spawn.

Daraufhin erhält jedes Element der Liste einen Link zu einem übergeordneten Widget und kann dessen Methoden aufrufen.

Hinzufügen der Artikelliste zur Katalogseite fertigstellen

  1. Öffnen Sie den Blueprint eines Katalogseiten-Widgets.
  2. Öffnen Sie eine Graph-Anzeige.
  3. Bearbeiten Sie die Logik für das Ausfüllen der Artikelliste wie in der folgenden Abbildung gezeigt.

Artikel-Widget fertigstellen

  1. Öffnen Sie das Widget-Blueprint eines Artikels.
  2. Fügen Sie eine Schaltfläche für den Artikelkauf hinzu.

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Wählen Sie im Hierarchy-Fenster eine Schaltfläche für den Artikelkauf aus.
  2. Klicken Sie im Details-Fenster auf das +-Symbol neben dem On Clicked-Ereignis.

  1. Öffnen Sie die Graph-Anzeige.
  2. Implementieren Sie die Logik für den Klick auf eine Artikelkauf-Schaltfläche. Fügen Sie dazu die Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Wenn Sie daraufhin auf die Artikelkauf-Schaltfläche klicken, wird gemäß der im Katalogseiten-Widget implementierten Logik im Browser eine Zahlungsseite geöffnet.

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

Virtuelle Gegenstände gegen virtuelle Währung verkaufen

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.

Hinweis
Das folgende Beispiel zeigt, wie Sie den Kauf von virtuellen Gegenständen implementieren. Die Konfiguration für andere Artikeltypen erfolgt auf ähnliche Weise.
Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

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 Artikelkatalog ist im Demoprojekt beschrieben.

So implementieren Sie den Verkauf von virtuellen Gegenständen gegen virtuelle Währung:

  1. Fügen Sie die Logik für den Artikelkauf zum Katalogseiten-Widget hinzu.
  2. Fügen Sie einer Artikelklasse einen Mechanismus hinzu, um die Logik für den Artikelkauf initiieren zu können.
  3. Verfeinern Sie das Hinzufügen einer Artikelliste zur Katalogseite.
  4. Ergänzen Sie das Widget um eine Schaltfläche für den Artikelkauf.
  5. Ergänzen Sie das Widget um die Logik des Artikelkaufs gegen virtuelle Währung:
    1. Öffnen Sie den Widget-Blueprint eines Artikels.
    2. Wechseln Sie zur Graph-Anzeige.
    3. Fügen Sie, wie unten gezeigt, Knoten hinzu.

Dadurch wird ein für einen Artikel angegebener Preis in virtueller Währung im Widget angezeigt und beim Kauf des Artikels berechnet. Wenn der Preis eines Artikels in mehreren virtuellen Währungen angegeben ist, wird die erste virtuelle Währung in der Liste für die Anzeige und den Kauf verwendet.

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

Anzeige von Artikeln im Inventar

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. Ein möglicher Artikelkatalog im Rahmen einer Ingame-Shop-Implementierung ist im Demoprojekt beschrieben.

Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

Widget für Inventarseite erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis.
  2. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  3. Fügen Sie im Widget-Blueprint den Anzeigebereich für die Artikelliste hinzu.

Das folgende Bild zeigt den beispielhaften Imventaraufbau.

  1. Öffnen Sie einen Level-Blueprint:
    1. Wählen Sie im Content Browser ein Level.
    2. Navigieren Sie im Hauptmenü zu Blueprints > Open Level Blueprint.
  2. Sorgen Sie dafür, dass das Widget beim Levelstart angezeigt wird. Fügen Sie dazu, wie unten gezeigt, Knoten hinzu. Geben Sie im CreateWidget-Knoten das erstellte Widget an.

Klasse für Artikel erstellen

  1. Wechseln Sie zum Content Browser. Klicken Sie im dortigen Kontextmenü auf Blueprint Class.
  2. Wählen Sie im Abschnitt All classes die Option Object aus, und klicken Sie auf Select.
  3. Geben Sie BP_UserInventoryItemData als Klassenname an.
  4. Öffnen Sie den Blueprint einer erstellten Klasse.
  5. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  6. Gehen Sie im Details-Feld wie folgt vor:

    1. Geben Sie im Variable Name-Feld UserInventoryItem an.
    2. Wählen Sie im Feld Variable Type die Option InventoryItem aus.
    3. Aktivieren Sie das Kontrollkästchen Instance Editable und Expose on Spawn.

  1. Klicken Sie im Anzeigebereich My Blueprint auf Add New, und wählen Sie Variable aus.
  2. Gehen Sie im Anzeigebereich Details wie folgt vor:
    1. Geben Sie im Feld Variable Name die Bezeichnung ExpiresIn an.
    2. Wählen Sie im Feld Variable Type die Option Integer64 aus.
    3. Aktivieren Sie die Kontrollkästchen Instance Editable und Expose on Spawn.

Widget für Artikel erstellen

  1. Wechseln Sie zum Content Browser, und erstellen Sie ein UI-Verzeichnis. Navigieren Sie im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Artikelname
    • Artikeleigenschaft:
      • für zeitlich begrenzte Artikel – Artikelstatus (aktiv oder abgelaufen)
      • für aufbrauchbare Artikel – Artikelmenge
      • für nicht aufbrauchbare Artikel – keine Eigenschaft vorhanden

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Klicken Sie auf Class settings.
  3. Navigieren Sie im Details-Fenster zu Interfaces > Implemented interfaces.
  4. Klicken sie auf Add, und wählen Sie UserObjectListEntry aus. Dabei handelt es sich um eine standardmäßige UE-Benutzeroberfläche, die es dem UI-Primitive gestattet, ein für das Listenelement normales Verhalten zu implementieren.
  5. Implementieren Sie die Logik für das Erstellen eines Artikels:

    1. Fügen Sie den OnListItemObjectSet-Knoten hinzu, um ein Listenelement erstellen und das Widget initialisieren zu können.
    2. Übermitteln Sie den Wert aus dem Objekt mit den Artikeldaten an das Element mit dem Artikelnamen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

    1. Implementieren Sie die Logik für die Definition eines Artikeltyps, indem Sie die Daten des Artikels entsprechend seines Typs an das Element mit den Artikeleigenschaften übermitteln. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Artikelliste zur Inventarseite hinzufügen

  1. Öffnen Sie den Widget-Blueprint der Inventarseite.
  2. Fügen Sie das Element List View zum Anzeigebereich der Artikelliste hinzu.
  3. Wählen Sie im Details-Fenster im Feld Entry Widget Class eine zuvor erstellte Klasse für eine Artikelgruppe aus.
  4. Implementieren Sie eine Logik für das Hinzufügen von Artikeln zu Gruppen:

    1. Öffnen Sie die Graph-Anzeige.
    2. Verknüpfen Sie die mit dem XsollaInventorySubsystem-Objekt verbundenen SDK-Methodenaufrufe GetInventory und GetTimeLimitedItems nacheinander mit dem EventConstruct-Knoten, wie in der folgenden Abbildung gezeigt:

    1. Implementieren Sie die Logik für das Ausfüllen der Artikelliste. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

    1. Fügen Sie Logik für das Festlegen der Verfallsdauer von zeitlich begrenzten Artikeln hinzu. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

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

Virtuelles Währungsguthaben anzeigen

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

Im Beispiel zeigen wir virtuelle Währungen und das zugehörige Guthaben im Benutzerinventar an. Daher sollten Sie zuvor die Artikelanzeige im Benutzerinventar implementieren.

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.

Quellcode
Den Quellcode für diese Beispiele finden Sie bei GitHub.

Klasse für die Guthabenanzeige erstellen

  1. Wechseln Sie zum Content Browser. Klicken Sie im dortigen Kontextmenü auf Blueprint Class.
  2. Wählen Sie im Abschnitt All classes die Option Object aus, und klicken Sie auf Select.
  3. Geben Sie BP_VcBalanceItemData als Klassenname an.
  4. Öffnen Sie den Blueprint einer erstellten Klasse.
  5. Klicken Sie im My Blueprint-Fenster auf Add New, und wählen Sie Variable aus.
  6. Gehen Sie im Details-Feld wie folgt vor:

    1. Geben Sie im Variable Name-Feld VcBalanceItem an.
    2. Wählen Sie im Feld Variable Type die Option VirtualCurrencyBalance aus.
    3. Aktivieren Sie das Kontrollkästchen Instance Editable und Expose on Spawn.

Widget für die Guthabenanzeige erstellen

  1. Wechseln Sie zum Content Browser, erstellen Sie ein UI-Verzeichnis, und navigieren Sie anschließend im Kontextmenü zu User Interface > Widget Blueprint.
  2. Fügen Sie im Widget-Blueprint folgende Benutzeroberflächenelemente hinzu:
    • Name der virtuellen Währung
    • Menge der virtuellen Währung

Das folgende Bild zeigt den beispielhaften Widget-Aufbau.

  1. Öffnen Sie eine Graph-Anzeige.
  2. Klicken Sie auf Class settings.
  3. Navigieren Sie im Details-Fenster zu Interfaces > Implemented interfaces.
  4. Klicken sie auf Add, und wählen Sie UserObjectListEntry aus. Dabei handelt es sich um eine standardmäßige UE-Benutzeroberfläche, die es dem UI-Primitive gestattet, ein für das Listenelement normales Verhalten zu implementieren.
  5. Implementieren Sie die Logik für das Hinzufügen der virtuellen Währung zur Liste:

    1. Fügen Sie den EventOnListItemObjectSet-Knoten hinzu, um ein Listenelement zu erstellen und das Widget initialisieren zu können.
    2. Übermitteln Sie die Werte aus dem Objekt mit den Daten der virtuellen Währung an die Elemente mit dem Namen und der Menge der virtuellen Währung. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

Widget für die Inventaranzeige fertigstellen

  1. Öffnen Sie den Widget-Blueprint der Inventarseite.
  2. Fügen Sie das Element List View zum Anzeigebereich der Liste virtueller Währungen hinzu.
  3. Wählen Sie im Details-Fenster im Feld Entry Widget Class eine zuvor erstellte Klasse für die Guthabenanzeige aus.
  4. Implementieren Sie eine Logik für das Ausfüllen der Liste virtueller Währungen:

    1. Öffnen Sie eine Graph-Anzeige.
    2. Verknüpfen Sie einen mit dem XsollaInventorySubsystem-Objekt verbundenen GetVirtualCurrencyBalance-Methodenaufruf mit dem EventConstruct-Knoten.
    3. Implementieren Sie die Logik für das Befüllen der Liste virtueller Währungen. Die Aktion sollte während der erfolgreichen Aktualisierung des virtuellen Währungsguthabens erfolgen. Fügen Sie dazu Knoten hinzu, wie in der folgenden Abbildung gezeigt.

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.
Ausblenden
Ihr Fortschritt
Vielen Dank für Ihr Feedback!

Nützliche Links

Letztmalig aktualisiert: 8. August 2022

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!