Weitere Funktionen

Erfahren Sie mehr über erweiterte Einrichtungen in unseren Anleitungen.

So testen Sie die Kontoverknüpfung in der Demo

Sie können die folgenden Funktionen implementieren, indem Sie das Konto des Spielers auf verschiedenen Plattformen mit dem Hauptkonto verknüpfen:

  • automatische Spieleridentifizierung auf verschiedenen Plattformen
  • Verwaltung eines einzigen plattformübergreifenden Inventars auf verschiedenen Plattformen

Sie können Demo-Maps verwenden, um die Verknüpfung von Plattformkonten mit dem Hauptkonto für ein voreingestelltes Kundenportal-Projekt zu überprüfen.

Hinweis
Sie können nur ein Konto pro Plattform mit dem Hauptkonto verknüpfen.

So testen Sie die Kontoverknüpfung in einem Demoprojekt:

  1. Navigieren Sie zu Ihrem UE4-Projekt in Unreal Editor.
  2. Richten Sie eine Demo-Map ein, um sich über das Plattformkonto bei der Anwendung anzumelden:
    1. Navigieren Sie zu Settings > Project Settings > Plugins > Xsolla Login. Aktivieren Sie die Option Use Cross-Platform Account Linking. Geben Sie die Platform und die Platform Account ID an.

    1. Navigieren Sie zu Settings > Project Settings > Plugins > Xsolla Store. Aktivieren Sie die Option Use Cross-Platform Account Linking. Wählen Sie dieselbe Platform wie in Xsolla Login aus.
  1. Starten Sie die Demo-Map Demo_Store aus dem Ordner Content Browser > Xsolla Content > Maps. Die Demo simuliert die Authentifizierung über das Plattformkonto. Dadurch werden Sie automatisch authentifiziert und gelangen zum Ingame-Shop.
  1. Klicken Sie in der Demo-Map auf User account und anschließend auf Account linking. Daraufhin wird das Demoprojekt im Standard-Browser geöffnet, wodurch der Start der Anwendung auf einer anderen Plattform simuliert wird.
  1. Klicken Sie auf Create an account.
  1. Geben Sie eine E-Mail-Adresse und ein Passwort ein. Klicken Sie auf Accept and create.
  1. Wählen Sie einen Gegenstand im Katalog aus, und klicken Sie auf Buy on Xsolla. Kaufen Sie den Gegenstand mithilfe einer der Testbankkarten. Schließen Sie die Quittung.
  1. Klicken Sie oben im Bildschirm auf die E-Mail-Adresse, um das Menü zu öffnen. Klicken Sie auf Inventory. Vergewissern Sie sich, dass der gekaufte Gegenstand im Inventar verfügbar ist.
  1. Klicken Sie auf Get code. Klicken Sie im geöffneten Fenster auf Request the code. Notieren Sie sich den erhaltenen Kontoverknüpfungscode.
  1. Navigieren Sie zur UE-Demo-Map.
  2. Geben Sie den erhaltenen Kontoverknüpfungscode (siehe Schritt 9) ein, und klicken Sie auf Confirm.
  1. Das Plattformkonto ist nunmehr mit dem Hauptkonto verknüpft. Stellen Sie sicher, dass der gekaufte Gegenstand im Inventar der Demo-Map verfügbar ist.
  1. Da dieses Konto bereits mit dem Hauptkonto verknüpft ist, können Sie den Kontoverknüpfungscode darüber abrufen. Klicken Sie dazu auf Get account link. Notieren Sie sich den erhaltenen Code.
  1. Richten Sie die Demo-Map ein, um sich über ein anderes Plattformkonto bei der Anwendung anzumelden (siehe Schritt 2). Die Publishing platform sollte sich von der in Schritt 2 ausgewählten unterscheiden.
  2. Starten Sie die Demo-MapDemo aus dem Ordner Content Browser > Xsolla Content > Maps.
  1. Stellen Sie sicher, dass das Spielerinventar leer ist.
  2. Klicken Sie auf Account linking. Bleiben Sie in der UE-Demo-Map.
  1. Geben Sie den erhaltenen Kontoverknüpfungscode (siehe Schritt 13) ein, und klicken Sie auf Confirm.
  1. Damit ist auch das Konto von der neuen Plattform mit dem Hauptkonto verknüpft. Stellen Sie sicher, dass der gekaufte Gegenstand im Inventar der UE-Demo-Map verfügbar ist.

Befolgen Sie die Anleitung, um die Kontoverknüpfung für Ihr Projekt zu konfigurieren.

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

So implementieren Sie einen Battle Pass in die Anwendung

Achtung
Diese Anleitung ist nur für die Arbeit mit dem Game Commerce Plug-in bestimmt.

Der Battle Pass steigert die Motivation der Spieler, indem Belohnungen für das Abschließen von Quests oder für das aktive Spielen während des Battle-Pass-Zeitraums gewährt werden.

Ein kostenloser Battle Pass mit begrenzten Belohnungen ist für alle Spieler verfügbar. Die letzte Belohnung ist im kostenlosen Battle Pass nicht enthalten.

Der Spieler kann eine Premium-Version des Battle Pass erwerben, in der alle Belohnungen, einschließlich der finalen, enthalten sind.

Der Battle-Pass-Fortschritt ist in Stufen unterteilt. Um aufzusteigen und die finale Belohnung zu erhalten, bevor der Battle Pass abläuft, muss der Spieler die notwendigen Erfahrungspunkte sammeln oder für den Stufenaufstieg zahlen.

Das Demoprojekt zeigt eine beispielhafte Implementierung des Battle Pass mithilfe von Xsolla-Produkten. So testen Sie den Battle Pass:

  1. Starten Sie die Demo-Map Xsollus.
  2. Melden Sie sich als Demonutzer an oder erstellen Sie einen neuen Nutzer.
  3. Klicken Sie im seitlichen Menü auf Battle pass.

So passen Sie den Battle Pass an Ihr Projekt an:

  1. Fügen Sie Ihrem Projekt die Battle-Pass-Logik hinzu.
  2. Erstellen Sie einen Satz Belohnungsgutscheine.
  3. Erstellen Sie eine Battle-Pass-Konfiguration.
  4. Erstellen Sie einen Battle-Pass-Gegenstand.
  5. Erstellen Sie einen Stufenaufstieg-Gegenstand.

Battle-Pass-Logik zum Projekt hinzufügen

So fügen Sie die Battle-Pass-Logik hinzu:

  1. Kopieren Sie den BP_BattlepassPanel- und den BP_StoreDemo-Blueprint samt allen Abhängigkeiten in Ihr Projekt.
  2. Ändern Sie die Benutzeroberfläche (optional).
  3. Modifizieren Sie die Logik für die Informationsspeicherung.

Belohnungsgutscheine erstellen

Sowohl virtuelle Gegenstände als auch virtuelle Währungspakete sind als Belohnung möglich.

Im Rahmen der aktuellen Lösung werden dem Spieler Belohnungen gewährt, wenn er einen entsprechenden Gutschein einlöst. So erstellen Sie einen Satz Belohnungsgutscheine:

  1. Wechseln Sie im Kundenportal zu Ihrem Projekt.
  2. Erstellen Sie virtuelle Gegenstände und virtuelle Währungspakete als Belohnung für Spieler.
  3. Richten Sie für jede Belohnung eine Gutscheinkampagne ein, beachten Sie dabei die folgenden Empfehlungen:

    • Geben Sie die Anzahl der Einlösungen pro Benutzer als voraussichtliche Anzahl der Gutscheineinlösung im Battle Pass an. Ein Gutschein kann im Rahmen des Battle Pass mehrfach eingelöst werden (z. B. auf verschiedenen Battle-Pass-Stufen, in Premium- und kostenlosen Versionen).
    • Die Kampagne muss für denselben Zeitraum wie der Battle Pass gültig sein.

Um die Battle-Pass-Konfiguration anzulegen, empfiehlt es sich, im Voraus eine Liste von Belohnungen zu erstellen und für jede davon Folgendes anzugeben:

  • Gutscheincode
  • SKU des virtuellen Gegenstands oder des virtuellen Währungspakets
  • ob die Belohnung an eine bestimmte Stufe des Battle Pass gebunden ist
  • ob die Belohnung an die kostenlose oder Premium-Version gebunden ist

Hinweis
Sie können Belohnungen für den neuen Battle Pass konfigurieren, bevor der vorherige abläuft. Aktivieren Sie die Gutscheinaktion erst nach dem Start des neuen Battle Pass, um die Anwendungslogik nicht zu verletzen.

Battle-Pass-Konfiguration erstellen

Die Battle-Pass-Konfiguration ist eine JSON-Datei und enthält:

  • den Namen des Battle Pass
  • das Ablaufdatum des Battle Pass
  • die Stufenstruktur samt Angabe der Belohnungen für die kostenlose und die Premium-Version

Hinweis
Die Belohnung für die höchste Stufe des Premium-Battle-Pass entspricht automatisch der finalen Battle-Pass-Belohnung. Deren Anzeige unterscheidet sich von der Belohnungsanzeige für abgeschlossene Stufen.

JSON-Dateistruktur:

ParameterTypBeschreibung
Name
stringDer Name des Battle Pass. Muss mit dem Namen des Battle-Pass-Gegenstands übereinstimmen.
ExpiryDate
stringDas Ablaufdatum des Battle Pass.
Levels
arrayStruktur der Battle Pass-Stufen.
Levels.Tier
integerStufennummer.
Levels.Experience
integerDie Anzahl von Erfahrungspunkten, um die nächste Stufe zu erreichen.
Levels.FreeItem
objectBelohnungsinformationen für die kostenlose Version des Battle Pass. Möglich ist null.
Levels.FreeItem.Sku
stringDie SKU eines virtuellen Gegenstands oder virtuellen Währungspakets. Dient dazu, dem Benutzer das Belohnungsbild und die entsprechenden Informationen anzuzeigen. Für ein virtuelles Währungspaket können sowohl die Paket-SKU als auch die SKU der virtuellen Währung verwendet werden.
Levels.FreeItem.Quantity
integerDie Anzahl der Belohnungen.
Levels.FreeItem.Promocode
stringDer Gutscheincode für die Belohnung.
Levels.PremiumItem
objectBelohnungsinformationen für die Premium-Version des Battle Pass. Möglich ist null.
Levels.PremiumItem.Sku
stringDie SKU eines virtuellen Gegenstands oder virtuellen Währungspakets. Dient dazu, dem Benutzer das Belohnungsbild und die entsprechenden Informationen anzuzeigen. Für ein virtuelles Währungspaket können sowohl die Paket-SKU als auch die SKU der virtuellen Währung verwendet werden.
Levels.PremiumItem.Quantity
integerDie Anzahl der Belohnungen.
Levels.PremiumItem.Promocode
stringDer Gutscheincode für die Belohnung.

Beispielhafte Battle-Pass-Konfiguration:

Copy
Full screen
Small screen
{
  "Name": "BP2021JAN",
  "ExpiryDate": "29-03-2021",
  "Levels": [
    {
      "Tier": 1,
      "Experience": 1000,
      "FreeItem": {
        "Sku": "Sku",
        "Quantity": 10,
        "Promocode": "HELLO_WORLD"
      },
      "PremiumItem": {
        "Sku": "Sku2",
        "Promocode": "HELLO_WORLD2"
      }
    },
    {
      "Tier": 2,
      "Experience": 1000
    },
    {
      "Tier": 3,
      "Experience": 1000
    }
  ]
}

Battle-Pass-Gegenstand erstellen

Der Battle-Pass-Gegenstand ist ein Container für die Battle-Pass-Konfiguration. Damit können Sie den Premium-Status des Spielers ermitteln, also ob der Spieler eine Premium-Version erworben hat.

So erstellen Sie einen Battle-Pass-Gegenstand:

  1. Wechseln Sie zu Ihrem Projekt im Kundenportal.
  2. Erstellen Sie eine Gruppe virtueller Gegenstände namens #BATTLEPASS#.

Hinweis
Die #BATTLEPASS#-Gruppe dient als Hilfsgruppe und erscheint weder im Ingame-Shop noch im Inventar.
  1. Erstellen Sie einen virtuellen Gegenstand mit den folgenden Parametern:
    • Gegenstandsname – Name des bei der Konfiguration angegebenen Battle Pass.
    • SKU – Battle-Pass-ID. Es wird empfohlen, den bei der Konfiguration angegebenen Namen des Battle Pass zu verwenden.
    • Gegenstandseigenschaften — aufbrauchbar oder nicht aufbrauchbar Gegenstand.
Hinweis
Es wird empfohlen, den aufbrauchbaren Gegenstand während des Debuggens der Anwendung zu erstellen. Auf diese Weise können Sie testen, wie das System auf das Vorhandensein bzw. Nichtvorhandensein des Battle-Pass-Gegenstands reagiert.
    • Preis – Preis der Premium-Version des Battle Pass. Lässt sich in virtueller oder echter Währung festlegen.
Hinweis
Wenn ein virtueller Gegenstand in echter und virtueller Währung bepreist ist, zeigt die Anwendung den Preis in virtueller Währung an.
    • Gruppe — #BATTLEPASS#.
  1. Fügen Sie dem erstellten virtuellen Gegenstand die Battle-Pass-Konfiguration hinzu:
    1. Rufen Sie die aktuelle Beschreibung des Gegenstands mithilfe des API-Aufrufs Get virtual item in einem JSON-Format ab.
    2. Konvertieren Sie die Battle-Pass-Konfiguration in einen String mithilfe eines Onlinediensts oder der Methode JSON.stringify() in JavaScript.
    3. Geben Sie in der Gegenstandsbeschreibung den erhaltenen String im en-Objekt des Parameters long_description an.
    4. Modifizieren Sie den Gegenstand mithilfe des API-Aufrufs Update virtual item, geben Sie dabei die aktualisierte Gegenstandsbeschreibung im Anfrage-Body an.

Beispielhafte Beschreibung des Battle-Pass-Gegenstands:

Copy
Full screen
Small screen
{
  "sku": "BP2021JAN",
  "name":{
    "en": "BP2021JAN"
  },
  "type": "virtual_good",
  "description":{
    "en": "BP2021JAN"
  },
  "image_url": "https://cdn3.xsolla.com/img/misc/images/7cb1c2b719af329a9bc1df994d58b749.png",
  "long_description": {
    "en": "{
                \"Name\":\"BP2021JAN\",
                \"ExpiryDate\":\"01-07-2021\",
                \"Levels\":
                    [
                        {
                            \"Tier\":1,
                            \"Experience\":100,
                            \"FreeItem\":
                                {
                                    \"Sku\":\"Bullets\",
                                    \"Promocode\":\"B2021S1FL1E100\",
                                    \"Quantity\":50
                                }
                        }
                    ]
            }"
  },
  "attributes":[
  ],
  "is_free": false,
  "order": 1,
  "groups":[
    "Battlepass"
  ],
  "regional_prices":[
  ],
  "prices":[
    {
      "amount": 1,
      "currency": "USD",
      "is_default": true,
      "is_enabled": true
    }
  ],
  "media_list":[
  ],
  "vc_prices":[
  ],
  "is_enabled": true,
  "is_show_in_store": true,
  "regions":[
  ],
  "inventory_options":{
    "consumable": false,
    "expiration_period": null
  }
}

Stufenaufstieg-Gegenstand erstellen

Momentan können Spieler im Rahmen der Battle-Pass-Lösung gegen Zahlung von echter oder virtueller Währung aufsteigen. Der Preis für einen Stufenaufstieg ist immer derselbe. Die Erfahrungspunkte, die der Spieler innerhalb der aktuellen Stufe gesammelt hat, werden in die nächste Stufe übernommen.

So erstellen Sie einen Stufenaufstieg-Gegenstand:

  1. Wechseln Sie im Kundenportal zu Ihrem Projekt.
  2. Erstellen Sie einen virtuellen Gegenstand mit folgenden Parametern:
    • Gegenstandsname — Name des Stufenaufstieg-Gegenstands im Format <battlepassname>_levelup_util, wobei <battlepassname> dem Namen des bei der Konfiguration angegebenen Battle Pass entspricht.
    • SKU — es wird empfohlen, den bei der Konfiguration angegebenen Namen des Battle Pass zu verwenden.
    • Gegenstandseigenschaften — aufbrauchbar oder nicht aufbrauchbar Gegenstand.
    • Preis — Preis für den Stufenaufstieg. Lässt sich in virtueller oder echter Währung festlegen.

Hinweis
Wenn ein Stufenaufstieg-Gegenstand in echter und virtueller Währung bepreist ist, zeigt die Anwendung den Preis in virtueller Währung an.
    • Gruppe — #BATTLEPASS#.

Besonderheiten der aktuellen Battle-Pass-Lösung

Logik für die Anzeige des Battle Pass

Die Anwendung zeigt nur einen Battle Pass entsprechend folgender Logik an:

  • Sind ein oder mehrere nicht abgelaufene Battle Passes vorhanden, zeigt die Anwendung den Battle Pass mit dem nächstliegenden Ablaufdatum an.
  • Wenn alle Battle Passes abgelaufen sind, zeigt die Anwendung den letzten abgelaufenen Battle Pass an.

BEISPIEL 1

Aktuelles Datum: 04.03.2021.

Das jeweilige Ablaufdatum der Battle Passes: 01.03.2021, 01.04.2021, 01.05.2021.

Die Anwendung zeigt den Battle Pass mit dem Ablaufdatum 01.04.2021 an.

BEISPIEL 2

Aktuelles Datum: 04.03.2021.

Das jeweilige Ablaufdatum der Battle Passes: 01.02.2021, 01.03.2021.

Die Anwendung zeigt den Battle Pass mit dem Ablaufdatum 01.03.2021 an.

Logik für die Informationsspeicherung

Momentan werden im Rahmen der Lösung alle Informationen über den Battle-Pass-Fortschritt eines Spielers (Stufe, Erfahrungspunkte, erhaltene Belohnungen usw.) in den vom Benutzer editierbaren Attributen gespeichert. Im Rahmen der Demo lassen sich diese Attribute auf der Character-Seite anzeigen und bearbeiten.

Wenn das System das erforderliche Attribut nicht findet, wird automatisch ein neues angelegt. Wenn das System Attribute von abgelaufenen Battle Passes findet, werden diese Attribute automatisch gelöscht.

Achtung
Von Benutzern editierbare Attribute lassen sich clientseitig ändern. Beim Implementieren Ihrer eigenen Logik wird empfohlen, schreibgeschützte Attribute zu verwenden, um die Battle-Pass-Fortschrittsdaten des Spielers zu schützen.

Um den Premium-Status eines Spielers zu ermitteln, wird geprüft, ob der Battle-Pass-Gegenstand im Inventar des Spielers vorhanden ist.

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

So konfigurieren Sie mit dem SDK die Benutzeroberfläche von Anwendungen

Das SDK umfasst einen UI-Baukasten. Mit diesem Baukasten können Sie das Erscheinungsbild der Anwendungsbenutzeroberfläche anpassen.

Sie können die Benutzeroberfläche ändern, indem Sie globale Einstellungen bearbeiten, die das Erscheinungsbild der UI-Elemente (Farbe, Textur und Schriftart) beeinflussen. Diese Eigenschaften sind in einem Theme zusammengefasst.

Um die UI-Elemente desselben Typs zu vertauschen, können Sie Widget-Wrapper verwenden. Dabei handelt es sich um Container für erstellte UI-Elemente.

Der UI-Baukasten besteht aus zwei unabhängigen Teilen:

  • Themes sind für das Erscheinungsbild zuständig.
  • Der Widget-Manager ist für die Arbeit mit Widgets zuständig und ermöglicht es, ganze Teile der Benutzeroberfläche zu ersetzen.

Mit Themes arbeiten

Theme ist ein Asset vom Typ XsollaUtilsTheme und enthält die Liste der Farben, Schriftarten und Texturen, die von den UI-Elementen verwendet werden. Jede Liste besteht aus einer Reihe von Schlüssel-Wert-Paaren, wobei der Schlüssel einem eindeutigen Namen eines Theme-Parameters und der Wert einer zugehörigen Farbe, Schriftart oder Textur entspricht.

Unter Settings > Project Settings > Plugins > Xsolla Utils können Sie mit Themes arbeiten:

  • Um das Theme der Benutzeroberfläche einzustellen, wählen Sie es im Feld Interface Theme aus.
  • Um das ausgewählte Theme zu bearbeiten, klicken Sie auf das 🔎-Symbol neben dem Interface Theme-Feld.

Hinweis
Sofern das SDK über den Epic Games Launcher installiert ist, bewirkt das Modifizieren des standardmäßigen Themes aus dem SDK auch Änderungen in anderen Projekten, die diese Themes verwenden. Wir empfehlen daher, ein eigenes Theme für Ihre Anwendung zu erstellen.
  • Um ein neues Theme zu erstellen, klicken Sie auf das +-Symbol neben dem Interface Theme-Feld.
  • Um ein ausgewähltes Theme zu löschen, klicken Sie auf das ×-Symbol neben dem Interface Theme-Feld.
Hinweis
Wenn Sie den Namen des Theme-Parameters ändern, müssen alle seine Widgets bearbeitet werden.

UI-Element mit dem Theme verbinden

So verbinden Sie das UI-Element mit dem Theme:

  1. Greifen Sie im Widget-Blueprint des UI-Elements über die folgenden Methoden auf das Theme zu:
    • GetCurrentTheme — ruft das aktuell in den Plug-in-Einstellungen festgelegte Theme ab.
    • GetTheme — ruft ein Theme anhand des im Parameter ThemeClass angegebenen Namen ab.
  2. Übermitteln Sie folgenden Methoden den Namen des Theme-Parameters, um die Werte bestimmter Parameter aus dem Theme abzurufen:
    • GetColor — ruft den Farbwert ab.
    • GetFont — ruft die Schriftart ab.
    • GetBrush — ruft die Textur ab.

Im Demoprojekt verfügt jedes Widget, das Themes unterstützt, über einen Satz von Parametern vom Typ String samt zugehöriger Theme-Parameternamen. Diese Parameter dienen dazu, das Erscheinungsbilds des UI-Elements einzustellen.

Unter Content Browser > Xsolla Content > Common > Components > Primitives finden Sie Beispiel-Widgets, die Themes unterstützen.

Mit dem Widget-Manager arbeiten

Der Widget-Manager ist ein Mechanismus, mit dem Sie die UI-Elemente automatisch durch UI-Elemente desselben Typs ersetzen können, indem Sie deren Erscheinungsbild und Verhalten ändern.

Damit Sie eine Benutzeroberfläche, die den Widget-Manager unterstützt, erstellen können, sollten folgende Bedingungen erfüllt sein:

  • Erstellen Sie ein Widget für das UI-Element mit der angegebenen einheitliche Schnittstelle.
  • Definieren Sie den Typnamen für das UI-Element-Widget in der Widget-Bibliothek.
  • Übermitteln Sie den Widget-Typ des UI-Elements an den Wrapper. Der Wrapper ist ein Container für die Erstellung der UI-Elemente. Der Name des Widget-Typs sollte mit dem Namen in der Bibliothek übereinstimmen.
  • Verwenden Sie beim Erstellen einer Benutzeroberfläche den Wrapper anstelle des Widgets.

Widget-Wrappers

Ein Wrapper in einem Container, der ein erforderliches Widget in dem Bereich der Seite erstellt, der von dem Wrapper belegt ist.

Durch die Verwendung der Widget-Wrapper beim Erstellen der Benutzeroberfläche können Sie die UI-Elemente innerhalb der gesamten Benutzeroberfläche automatisch ändern. Ändern Sie dazu das Widget im Wrapper. Beim Standardablauf, der auf UI-Primitives setzt, müssten in diesem Fall alle Widgets manuell ersetzen werden.

Es gibt die folgenden Wrapper für verschiedene Widget-Typen:

  • W_ButtonWrapper — für eine Schaltfläche
  • W_InputWrapper — für ein Eingabefeld
  • W_TextWrapper — für Text
  • W_RichTextWrapper — für Rich Text
  • W_ImageWrapper — für ein Bild
  • W_CheckBoxWrapper — für ein Kontrollkästchen

Im Details-Fensterbereich können Sie die Anzeigeparameter der von einem Wrapper erstellten Widgets konfigurieren. Im Feld Widget Library Name sollten Sie den Namen des Widget-Typs aus der aktuellen Widget-Bibliothek angeben.

Sie finden die Widget-Wrapper-Blueprints unter Content Browser > Xsolla Content > Common > Components > Wrappers.

Die Wrapper verwenden die Widget-Manager-Methoden, um mit den Widgets zu interagieren.

Widget-Schnittstellen

Damit die UI-Primitives mit dem Widget-Wrapper genauso interagieren wie mit dem normalen Widget, verwenden die Wrapper einheitliche Schnittstellen.

Es gibt die folgenden Wrapper für verschiedene Widget-Typen:

  • BPI_PrimitivesButton — für eine Schaltfläche
  • BPI_PrimitivesInput — für ein Eingabefeld
  • BPI_PrimitivesText — für Text
  • BPI_PrimitivesRichText — für Rich Text
  • BPI_PrimitivesImage — für ein Bild
  • BPI_PrimitivesCheckbox — für ein Kontrollkästchen

Sie können Schnittstellen für die UI-Elemente-Widgets unter Implemented Interfaces im Abschnitt Details konfigurieren.

Sie finden die Widget-Schnittstellen unter Content Browser > Xsolla Content > Common > Components > Interface.

Widget-Bibliothek

Die Widget-Bibliothek ist ein Asset vom Typ XsollaUtilsWidgetsLibrary, das die Liste der Widget-Klassen in Form von Schlüssel-Wert-Paaren enthält. Der Schlüssel enthält den Namen des Widget-Typs und der Wert enthält die Widget-Klasse, die durch einen entsprechenden Wrapper mit diesem Schlüssel erzeugt wird.

Die Widget-Bibliothek fungiert als Bindeglied zwischen den Wrappern und den Widget-Klassen.

Die standardmäßige Widget-Bibliothek BP_DefaultWidgetLibrary ist im SDK enthalten. Diese Bibliothek enthält die Liste der UI-Elemente aus dem Demoprojekt.

Unter Settings > Project Settings > Plugins > Xsolla Utils können Sie mit der Widget-Bibliothek arbeiten:

  • Um die aktuelle Widget-Bibliothek zu installieren, wählen Sie sie im Feld Widgets Library aus.
  • Um die ausgewählte Widget-Bibliothek zu bearbeiten, klicken Sie auf das 🔎-Symbol neben dem Widgets Library-Feld.

Hinweis
Sofern das SDK über den Epic Games Launcher installiert ist, bewirkt das Modifizieren der standardmäßigen Widget-Bibliothek aus dem SDK auch Änderungen in anderen Projekten, die diese Bibliothek verwenden. Wir empfehlen daher, eine eigene Widget-Bibliothek für Ihre Anwendung zu erstellen.
  • Um eine neue Widget-Bibliothek zu erstellen, klicken Sie auf das +-Symbol neben dem Widgets Library-Feld.
  • Um eine ausgewählte Widget-Bibliothek zu löschen, klicken Sie auf das ×-Symbol neben dem Widgets Library-Feld.

Verwenden Sie die folgenden Methoden in den Wrapper-Blueprints, um Zugriff auf die Widget-Bibliothek zu erhalten:

  • GetCurrentWidgetsLibrary — ruft die aktuell in den Plug-in-Einstellungen festgelegte Widget-Bibliothek ab.
  • GetWidgetsLibrary — ruft eine Widget-Bibliothek anhand des im Parameter WidgetLibraryClass angegebenen Namen ab.

Verwenden Sie die Methode GetWidget in den Wrapper-Blueprints, um den Widget-Typ aus der Bibliothek abzurufen.

Methoden des Widget-Managers

Die folgenden Methoden werden von den Wrappern verwendet, um mit den Widgets zu interagieren. Damit können Sie Ihre eigenen Wrapper und Widgets erstellen, die Themes unterstützen.

Methoden für die Arbeit mit Schaltflächen

MethodennameBeschreibung
SetButtonEnabledLegt den Schaltflächenstatus fest, der definiert, ob die Schaltfläche auf Tastatureingabe, Mausklick, Timer-Ereignisse usw. reagiert.
IsButtonEnabledRuft den Schaltflächenstatus ab, der definiert, ob die Schaltfläche auf Tastatureingabe, Mausklick, Timer-Ereignisse usw. reagiert.
GetWidgetRuft die Liste der UI-Primitives ab, die das Widget enthalten. Wird verwendet, um das Schaltflächenklick-Ereignis zu abonnieren.
ConstructButtonInitialisiert das Schaltflächen-Widget. Wird vom Widget-Wrapper verwendet.
SetExtraDataLegt eine Liste von zusätzlichen Daten für eine Schaltfläche fest. Jedes Widget verarbeitet die empfangenen Daten, veranschaulicht sie oder verwendet sie entsprechend der internen Logik. Beispielsweise können Sie mit den zusätzlichen Daten die Liste der Drop-down-Menü-Elemente an eine Schaltfläche übermitteln, die ein Drop-down-Menü aufweist.
SetIconDataLegt eine Liste von Symbolen fest, die für eine Schaltfläche angezeigt werden sollen. Mit dieser Methode lassen sich die Symbolgröße und der Abstand zwischen dem Symbol und anderen Schaltflächenelementen festlegen.
SetButtonSelectedLegt die Schalterstellung fest, z. B.: Ein oder Aus, im Warenkorb oder nicht im Warenkorb usw.
GetThemeDataRuft die vom Schaltflächen-Widget verwendeten Theme-Parameter ab.
SetButtonTextLegt den Text einer Schaltfläche fest.

Methoden für die Arbeit mit Kontrollkästchen

MethodennameBeschreibung
SetIsCheckedLegt den Status des Kontrollkästchens fest: aktiviert oder deaktiviert.
GetIsCheckedRuft den Status des Kontrollkästchens ab.
IsTickHoveredPrüft, ob der Mauszeiger über dem Kontrollkästchenbereich verweilt.
ConstructCheckboxInitialisiert das Kontrollkästchen-Widget. Wird vom Widget-Wrapper verwendet.
GetWidgetRuft die Liste der im Widget enthaltenen UI-Primitives ab. Wird verwendet, um Kontrollkästchen-Ereignisse zu abonnieren.
GetThemeDataRuft die vom Kontrollkästchen-Widget verwendeten Theme-Parameter ab.
SetTextLegt den Text des Kontrollkästchens fest.
GetTextRuft den Text des Kontrollkästchens ab.

Methoden für die Arbeit mit Text oder Rich Text

MethodennameBeschreibung
GetTextRuft den Textwert ab.
SetTextLegt den Textwert fest.
GetWidgetRuft die Liste der im Widget enthaltenen UI-Primitives ab. Wird verwendet, um Text-Ereignisse zu abonnieren.
GetThemeDataRuft die vom Text-Widget verwendeten Theme-Parameter ab.
ConstructTextInitialisiert das Text-Widget. Wird vom Widget-Wrapper verwendet.

Methoden für die Arbeit mit Bildern

MethodennameBeschreibung
GetImageRuft das Bild ab.
SetImageLegt das Bild fest.
GetWidgetRuft die Liste der im Widget enthaltenen UI-Primitives ab. Wird verwendet, um Bild-Ereignisse zu abonnieren.
GetThemeDataRuft die vom Bild-Widget verwendeten Theme-Parameter ab.
ConstructImageInitialisiert das Bild-Widget. Wird vom Widget-Wrapper verwendet.

Methoden für die Arbeit mit Eingabefeldern

MethodennameBeschreibung
GetTextRuft den Text des Eingabefelds ab.
SetTextLegt den Text des Eingabefelds fest.
GetWidgetRuft die Liste der im Widget enthaltenen UI-Primitives ab. Wird verwendet, um Eingabefeld-Ereignisse zu abonnieren.
ConstructInputInitialisiert das Eingabefeld-Widget. Wird vom Widget-Wrapper verwendet.
GetHintRuft den Hinweistext des Eingabefelds ab.
SetHintLegt den Hinweistext des Eingabefelds fest.
SetupFocusLegt den Fokus auf das Eingabefeld.
GetThemeDataRuft die vom Eingabefeld-Widget verwendeten Theme-Parameter ab.
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
Letztmalig aktualisiert: 22. Januar 2024

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!