Intégrer le SDK côté application
- Concevez une interface pour le système de connexion, le magasin en jeu et les autres pages de votre application.
- Implémentez dans votre application la logique d'authentification utilisateur, d'affichage du magasin, d'achat, etc., en utilisant les méthodes SDK.
Assets/Xsolla/Samples
du SDK.Connexion utilisateur par nom d'utilisateur/adresse e-mail et mot de passe
Cette instruction montre comment utiliser les méthodes SDK pour implémenter :
- l’inscription utilisateur ;
- la demande utilisateur de renvoi d’e-mail de confirmation d’inscription ;
- la connexion utilisateur ;
- la réinitialisation du mot de passe utilisateur.
Vous pouvez authentifier les utilisateurs à l’aide de leur nom d’utilisateur ou de leur adresse e-mail. Dans les exemples ci-dessous, nous authentifions les utilisateurs à l’aide de leur nom d’utilisateur, tandis que l’adresse e-mail est utilisée pour confirmer l’inscription et réinitialiser le mot de passe.
Implémenter l'inscription utilisateur
Ce tutoriel décrit l’implémentation de la logique suivante :Créer une interface de page
Créez une scène de page d’inscription et ajoutez-y les éléments suivants :
- champ de nom d’utilisateur ;
- champ d’adresse e-mail utilisateur ;
- champ de mot de passe utilisateur ;
- bouton d’inscription.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
RegistrationPage
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface de la page et définissez leurs valeurs dans le panneau
Inspector . - Ajoutez la logique de traitement du clic sur le bouton de connexion, comme indiqué dans l'exemple de script.
Dans les exemples de script, les méthodes OnSuccess
et OnError
appellent la méthode standard Debug.Log. En cas d’erreur, le code d’erreur et la description sont passés dans le paramètre error
.
Vous pouvez ajouter d’autres actions, telles que l’ouverture d’une page de demande de renvoi d’e-mail d’inscription ou d’une page de connexion, après une inscription réussie.
- C#
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
}
}
}
Configurer un e-mail de confirmation d'inscription
Après une inscription réussie, l’utilisateur reçoit un e-mail de confirmation d’inscription à l’adresse spécifiée. Vous pouvez customiser les e-mails envoyés aux utilisateurs dans le Compte éditeur.
Si vous développez une application Android, configurez les liens profonds pour renvoyer l’utilisateur à l’application après la confirmation d’inscription.
Implémenter la demande utilisateur de renvoi d'e-mail de confirmation d'inscription
Ce tutoriel décrit l’implémentation de la logique suivante :Créer une interface de page
Créez une scène de page de demande de renvoi d’e-mail de confirmation et ajoutez-y les éléments suivants :
- Champ de nom d’utilisateur/adresse e-mail ;
- bouton de renvoi d’e-mail.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
ResendConfirmationEmail
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface de la page et définissez leurs valeurs dans le panneau
Inspector . - Ajoutez la logique de traitement du clic sur le bouton de renvoi d'e-mail, comme indiqué dans l'exemple de script.
Exemple de script de page de renvoi d’e-mail :
- C#
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
}
}
}
Après une demande réussie, l’utilisateur reçoit un e-mail de confirmation d’inscription à l’adresse e-mail spécifiée lors de l’inscription.
Implémenter la connexion utilisateur
Ce tutoriel décrit l’implémentation de la logique suivante :Créer une interface de page
Créez une scène de page de connexion et ajoutez-y les éléments suivants :
- champ de nom d’utilisateur ;
- champ de mot de passe ;
- case à cocher se souvenir de moi ;
- bouton de connexion.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
AutorizationPage
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface de la page et définissez leurs valeurs dans le panneau
Inspector . - Ajoutez la logique de traitement du clic sur le bouton d'inscription, comme indiqué dans l'exemple de script.
Exemple de script de page de connexion :
- C#
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
}
}
}
Implémenter la réinitialisation du mot de passe utilisateur
Ce tutoriel décrit l’implémentation de la logique suivante :Créer une interface de page
Créez une scène de page de réinitialisation du mot de passe et ajoutez-y les éléments suivants :
- champ de nom d’utilisateur/adresse e-mail ;
- bouton de réinitialisation du mot de passe.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
ResetPasswordPage
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface de la page et définissez leurs valeurs dans le panneau
Inspector . - Ajoutez la logique de traitement du clic sur le bouton de réinitialisation du mot de passe, comme indiqué dans l'exemple de script.
Exemple de script de page de réinitialisation du mot de passe :
- C#
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
}
}
}
Après une demande de réinitialisation de mot de passe réussie, l’utilisateur reçoit un e-mail contenant un lien de réinitialisation du mot de passe. Accédez au Compte éditeur sous la section votre projet de connexion > Security > OAuth 2.0 > OAuth 2.0 redirect URIs pour configurer une adresse URL ou un chemin vers lequel l’utilisateur est redirigé après une authentification, une confirmation par e-mail ou une réinitialisation du mot de passe réussies.
Connexion via les réseaux sociaux
Ce guide explique comment utiliser les méthodes SDK pour implémenter l’inscription et la connexion utilisateur via un compte de réseau social.
Contrairement à l’authentification utilisateur par nom d’utilisateur/adresse e-mail et mot de passe, vous n’avez pas à implémenter de logique distincte pour l’inscription des utilisateurs. Si l’utilisateur se connecte pour la première fois via un réseau social, un nouveau compte est automatiquement créé.
Si vous avez implémenté la connexion via les réseaux sociaux dans votre application comme méthode d’authentification alternative, le compte de réseau social est automatiquement lié à un compte utilisateur existant si les conditions suivantes sont remplies :
- l'utilisateur inscrit par nom d'utilisateur/adresse e-mail et mot de passe se connecte à votre application via un compte de réseau social ;
- le réseau social renvoie une adresse e-mail ;
- l'adresse e-mail de l'utilisateur sur le réseau social est la même que l'adresse e-mail utilisée pour l'inscription dans votre application.
LinkSocialProvider
.Les exemples montrent comment configurer la connexion utilisateur via un compte Facebook. Vous pouvez configurer tous les réseaux sociaux de la même manière.
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation du système d’authentification.
Créer une interface de page
Créez une scène de page de connexion et ajoutez-y le bouton de connexion via un réseau social. L’image suivante montre un exemple de structure de la page.Créer un contrôleur de page
- Créez un script
SocialAuthorizationPage
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface de la page de connexion de l'application et définissez leurs valeurs dans le panneau
Inspector . - Ajoutez la logique de traitement du clic sur le bouton de connexion, comme indiqué dans l'exemple de script.
Dans les exemples de script, les méthodes OnSuccess
et OnError
appellent la méthode standard Debug.Log. Vous pouvez ajouter d’autres actions.
En cas d’erreur, le code d’erreur et la description sont passés dans le paramètre error
.
- C#
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
}
}
}
Affichage du catalogue des objets
Ce tutoriel montre comment utiliser les méthodes SDK pour afficher les objets suivants dans le magasin en jeu :
- objets virtuels ;
- groupes d’objets virtuels ;
- lots ;
- packages de monnaie virtuelle.
Avant de commencer, configurez les objets dans le Compte éditeur :
- Configurez les objets virtuels et les groupes d’objets virtuels.
- Configurez les packages de monnaie virtuelle.
- Configurez les lots.
Ce tutoriel décrit l’implémentation de la logique suivante :
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation du catalogue des objets dans le magasin en jeu.
Dans l’exemple, pour chaque objet, le catalogue affiche :
- le nom de l’objet ;
- la description de l’objet ;
- le prix de l’objet ;
- l’image.
Vous pouvez également afficher d’autres informations sur l’objet si ces informations sont stockées dans le magasin en jeu.
Implémenter l'affichage des objets virtuels
Créer un widget d'objet
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de l'objet ;
- nom de l'objet ;
- description de l'objet ;
- prix de l'objet ;
- image de l'objet.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget d'objet
- Créez un script
VirtualItemWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer une page d'affichage de la liste des objets
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de la page ;
- zone d'affichage des widgets des objets.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
VirtualItemsPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
WidgetsContainer
— conteneur des widgets ;WidgetPrefab
— prefab du widget de l'objet.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptVirtualItemsPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector .
- Ajoutez une logique de connexion et une logique pour obtenir la liste des objets, comme indiqué dans l'exemple de script.
Dans l’exemple de script, des informations d’identification d’un compte de démo sont utilisées pour se connecter (nom d’utilisateur : xsolla
, mot de passe : xsolla
).
L’exemple de script ne comprend pas l’implémentation de l’affichage page par page des objets du catalogue (pagination). Pour implémenter la pagination, utilisez les paramètres offset
et limit
de la méthode SDK GetCatalog
. Le nombre maximum d’objets par page est de 50. Si le catalogue contient plus de 50 objets, la pagination est nécessaire.
- C#
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
}
}
}
L’image ci-dessous montre le résultat du script.
Implémenter l'affichage de groupes d'objets virtuels
Créer un widget d'objet
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de l'objet ;
- nom de l'objet ;
- description de l'objet ;
- prix de l'objet ;
- image de l'objet.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget d'objet
- Créez un script
VirtualItemWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer un widget de bouton qui affiche un groupe d'objets
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez le bouton qui permet l'affichage du groupe d'objets en tant qu'objet enfant du prefab et configurez son apparence.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de bouton qui affiche un groupe d'objets
- Créez un
VirtualItemGroupButton
hérité de la classe de baseMonoBehaviour
. - Déclarez des variables pour le bouton qui affiche le groupe d'objets et définissez leurs valeurs dans le panneau
Inspector . - Pour ajouter un script à l'objet racine d'un prefab :
- sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptVirtualItemGroupButton
.
- sélectionnez un objet dans le panneau
Exemple de script de widget :
- C#
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;
}
}
Créer une page d'affichage de la liste des objets
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- zone d'affichage des boutons des groupes d'objets ;
- image image d'arrière-plan de la page ;
- zone d'affichage des widgets des objets.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
VirtualItemsByGroupsPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
GroupButtonsContainer
— conteneur des boutons des groupes ;GroupButtonPrefab
— prefab de bouton ;ItemWidgetsContainer
— conteneur des widgets des objets ;WidgetPrefab
— prefab de widget d'objet.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptVirtualItemsByGroupsPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector . - Ajoutez une logique de connexion et une logique pour obtenir la liste des objets, comme indiqué dans l'exemple de script.
Dans l’exemple de script, des informations d’identification d’un compte de démo sont utilisées pour se connecter (nom d’utilisateur : xsolla
, mot de passe : xsolla
).
L’exemple de script ne comprend pas l’implémentation de l’affichage page par page des objets du catalogue (pagination). Pour implémenter la pagination, utilisez les paramètres offset
et limit
de la méthode SDK GetCatalog
. Le nombre maximum d’objets par page est de 50. Si le catalogue contient plus de 50 objets, la pagination est nécessaire.
- C#
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);
}
}
}
}
L’image ci-dessous montre le résultat du script.
Implémenter l'affichage des lots
Créer un widget de lot
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan du widget ;
- nom du lot ;
- description du lot ;
- prix du lot ;
- description du contenu du lot (objets et leur quantité) ;
- image du lot.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget
- Créez un script
BundleWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer une page d'affichage des lots
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de la page ;
- zone d'affichage des widgets des lots.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
BundlesPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
WidgetsContainer
— conteneur des widgets ;WidgetPrefab
— prefab du widget du lot.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptBundlesPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector . - Ajoutez une logique de connexion et une logique pour obtenir la liste des objets, comme indiqué dans l'exemple de script.
Dans l’exemple de script, des informations d’identification d’un compte de démo sont utilisées pour se connecter (nom d’utilisateur : xsolla
, mot de passe : xsolla
).
L’exemple de script ne comprend pas l’implémentation de l’affichage page par page des objets du catalogue (pagination). Pour implémenter la pagination, utilisez les paramètres offset
et limit
de la méthode SDK GetCatalog
. Le nombre maximum d’objets par page est de 50. Si le catalogue contient plus de 50 objets, la pagination est nécessaire.
- C#
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
}
}
}
L’image ci-dessous montre le résultat du script.
Implémenter l'affichage des packages de monnaie virtuelle
Créer un widget de package de monnaie virtuelle
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan du widget ;
- nom du package ;
- description du package ;
- prix du package ;
- image du package.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget
- Créez un script
VirtualCurrencyPackageWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer une page d'affichage de la liste des packages de monnaie virtuelle
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de la page ;
- zone d'affichage des widgets des packages de monnaie virtuelle.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
VirtualCurrencyPackagesPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
WidgetsContainer
— conteneur des widgets ;WidgetPrefab
— prefab du package de monnaie virtuelle.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptVirtualCurrencyPackagesPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector . - Ajoutez une logique de connexion et une logique pour obtenir la liste des packages de monnaie virtuelle, comme indiqué dans l'exemple de script.
Dans l’exemple de script, des informations d’identification d’un compte de démo sont utilisées pour se connecter (nom d’utilisateur : xsolla
, mot de passe : xsolla
).
L’exemple de script ne comprend pas l’implémentation de l’affichage page par page des objets du catalogue (pagination). Pour implémenter la pagination, utilisez les paramètres offset
et limit
de la méthode SDK GetCatalog
. Le nombre maximum d’objets par page est de 50. Si le catalogue contient plus de 50 objets, la pagination est nécessaire.
- C#
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
}
}
}
L’image ci-dessous montre le résultat du script.
Vendre des objets virtuels contre des devises réelles
Cette section explique comment utiliser les méthodes SDK pour implémenter la vente de biens contre des devises réelles. Les objets virtuels sont utilisés comme exemple de biens.
Avant de commencer, implémentez l’affichage des objets virtuels dans le catalogue. Dans l’exemple suivant, nous décrivons comment implémenter l’achat d’objets virtuels. La configuration pour les autres types de biens est similaire.
Ce tutoriel décrit l’implémentation de la logique suivante :
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation de la vente de biens contre des devises réelles et de l’affichage du catalogue des objets.
Compléter le widget d'objet
Ajoutez un bouton d’achat au widget de l’objet et configurez son apparence.
L’image ci-dessous montre un exemple de structure du widget.
Compléter le script de widget d'objet
- Ouvrez le script
VirtualItemWidget
. - Déclarez les variables pour le bouton d'achat et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Compléter le contrôleur de page d'affichage de la liste des objets
- Ouvrez le script
VirtualItemsPage
. - Ajoutez une logique de traitement du clic sur le bouton d'achat d'un objet virtuel, comme indiqué dans l'exemple de script.
Dans l’exemple de script, après un achat d’objet réussi, la méthode de base Debug.Log est appelée. Vous pouvez ajouter d’autres actions telles que l’affichage de l’inventaire, etc.
Par défaut, la page de paiement s’ouvre dans un navigateur intégré. Pour l’ouvrir dans un navigateur externe, accédez à
- C#
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
}
}
}
Vendre des objets virtuels contre de la monnaie virtuelle
Cette section explique comment utiliser les méthodes SDK pour implémenter la vente de biens contre de la monnaie virtuelle. Les objets virtuels sont utilisés comme exemple de biens.
Avant de commencer, implémentez l’affichage des objets virtuels dans le catalogue. Dans l’exemple suivant, nous décrivons comment implémenter l’achat d’objets virtuels. La configuration pour les autres types de biens est similaire.
Ce tutoriel décrit l’implémentation de la logique suivante :
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation de la vente de biens contre de la monnaie virtuelle et de l’affichage du catalogue des objets.
Compléter le widget d'objet
Ajoutez un bouton d’achat au widget de l’objet et configurez son apparence.
L’image ci-dessous montre un exemple de structure du widget.
Compléter le script de widget d'objet
- Ouvrez le script
VirtualItemWidget
. - Déclarez les variables pour le bouton d'achat et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Compléter le contrôleur de page d'affichage de la liste des objets
- Ouvrez le script
VirtualItemsPage
. - Ajoutez une logique de traitement du clic sur le bouton d'achat d'un objet virtuel, comme indiqué dans l'exemple de script.
Dans l’exemple de script, après un achat d’objet réussi, la méthode de base Debug.Log est appelée. Vous pouvez ajouter d’autres actions telles que l’affichage de l’inventaire, le changement du solde de la monnaie virtuelle ; etc.
L’implémentation d’une logique d’ajout des objets achetés à l’inventaire n’est pas requise ; cela se fait automatiquement.
- C#
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
}
}
}
Affichage du solde de la monnaie virtuelle
Ce tutoriel montre comment utiliser les méthodes SDK pour afficher le solde de la monnaie virtuelle dans votre application.
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation du catalogue des objets dans le magasin en jeu.
Créer un widget d'affichage de solde
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan du widget ;
- nom de la monnaie virtuelle ;
- quantité de la monnaie virtuelle ;
- image de la monnaie virtuelle.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget d'affichage de solde
- Créez un script
VirtualCurrencyWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer une page avec la liste des monnaies virtuelles
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de la page ;
- zone d'affichage des widgets.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page avec la liste des monnaies virtuelles
- Créez un script
VirtualCurrenciesPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
WidgetsContainer
— conteneur des widgets ;WidgetPrefab
— prefab du widget d'affichage du solde.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptVirtualCurrenciesPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector . - Ajoutez une logique de connexion et une logique pour obtenir la liste des monnaies virtuelles, comme indiqué dans l'exemple de script.
xsolla
, mot de passe : xsolla
).- C#
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
}
}
}
L’image ci-dessous montre le résultat du script.
Affichage des objets de l'inventaire
Ce tutoriel montre comment utiliser les méthodes SDK pour afficher les objets de l’inventaire utilisateur.
La logique et l’interface des exemples sont simples, celles de votre application seront bien plus complexes. Le projet de démo décrit une option possible d’implémentation de l’inventaire.
Créer un widget d'objet
- Créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Convertissez l'objet de jeu créé en un prefab en le faisant glisser du panneau
Hierarchy vers le panneauProject . - Sélectionnez le prefab créé et cliquez sur
Open Prefab dans le panneauInspector . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de l'objet ;
- nom de l'objet ;
- description de l'objet ;
- quantité de l'objet ;
- image de l'objet.
L’image ci-dessous montre un exemple de structure du widget.
Créer un script de widget d'objet
- Créez un script
InventoryItemWidget
hérité de la classe de base MonoBehaviour. - Déclarez des variables pour les éléments de l'interface du widget d'objet et définissez leurs valeurs dans le panneau
Inspector .
Exemple de script de widget :
- C#
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;
}
}
Créer une page d'affichage de l'inventaire
- Sur la scène, créez un objet de jeu vide. Pour ce faire, accédez au menu principal et sélectionnez
GameObject > Create Empty . - Ajoutez les éléments d'interface ci-dessous en tant qu'objets enfants du prefab et configurez leur apparence :
- image d'arrière-plan de la page ;
- zone d'affichage des widgets des objets.
L’image ci-dessous montre un exemple de structure de la page.
Créer un contrôleur de page
- Créez un script
InventoryItemsPage
hérité de la classe de baseMonoBehaviour
. - Déclarez les variables suivantes :
WidgetsContainer
— conteneur des widgets des objets ;WidgetPrefab
— prefab de widget d'objet.
- Attachez un script à un objet de jeu de la page :
- Sélectionnez un objet dans le panneau
Hierarchy ; - Dans le panneau
Inspector , cliquez surAdd Component et sélectionnez un scriptInventoryItemsPage
.
- Sélectionnez un objet dans le panneau
- Définissez les valeurs des variables dans le panneau
Inspector . - Ajoutez une logique de connexion et une logique pour obtenir la liste des objets de l'inventaire.
xsolla
, mot de passe : xsolla
).- C#
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
}
}
}
L’image ci-dessous montre le résultat du script.
Liens utiles
Faute de frappe ou autre erreur dans le texte ? Sélectionnez le texte concerné et appuyez sur Ctrl+Entée.