本教程介绍如何使用SDK方法实现以下内容：

• 用户注册
• 重新发送注册验证邮件请求
• 用户登录
• 用户密码重置

源代码

在GitHub上查看这些示例的源代码。

实现用户注册

创建小组件

1. 前往Content Browser并创建UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下界面元素：
   • 用户名字段
   • 用户邮箱地址字段
   • 用户密码字段
   • 注册按钮

下图为页面结构的示例。

3. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
4. 实现在关卡启动时显示小组件。在CreateWidget节点中，指定创建的小组件。

添加事件处理

1. 在Hierarchy面板中，选择注册按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 打开Graph视图。
4. 关联XsollaLoginSubsystem对象上的一个RegisterUser方法调用至OnClicked节点，并添加用户输入数据传递。
5. 添加回调函数：
   • OnRegistered — 注册成功时调用
   • OnError — 发生错误时调用

6. 要开始调试小组件，请启动一个关卡。

事件处理实现示例：

设置注册验证邮件

成功注册后，用户将在指定邮箱中收到一封注册验证邮件。您可以在发布商帐户中自定义发送给用户的邮件。

如果您开发的是Android应用程序，请设置深度链接以在用户验证注册后将用户返回到应用程序。

实现重新发送注册验证邮件请求

创建小组件

1. 前往Content Browser并打开UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下界面元素：
   • 用户名/邮箱字段
   • 重新发送邮件按钮

下图为页面结构的示例。

3. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
4. 在CreateWidget节点中，指定创建的小组件。

添加事件处理

1. 在Hierarchy面板中，选择重新发送邮件按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 打开Graph视图。
4. 关联XsollaLoginSubsystem对象上的一个ResendAccountConfirmationEmail方法调用至OnClicked节点，并添加用户输入数据传递。
5. 添加OnEmailResent和OnError回调函数。
6. 要开始调试小组件，请启动一个关卡。

如果请求成功，用户将在注册时指定的邮箱中收到一封注册验证邮件。

事件处理实现示例：

实现用户登录

创建小组件

1. 前往Content Browser并打开UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下界面元素：
   • 用户名字段
   • 密码字段
   • 记住我复选框
   • 登录按钮

下图为页面结构的示例。

3. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
4. 在CreateWidget节点中，指定创建的小组件。

添加事件处理

1. 在Hierarchy面板中，选择登录按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 打开Graph视图。
4. 关联XsollaLoginSubsystem对象上的一个AuthenticateUser方法调用至OnClicked节点，并添加用户输入数据传递。
5. 添加OnAuthenticated和OnError回调函数。

6. 要开始调试小组件，请启动一个关卡。

事件处理实现示例：

实现密码重置

创建小组件

1. 前往Content Browser并打开UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下界面元素：
   • 用户名/用户邮箱地址字段
   • 密码重置按钮

下图为页面结构的示例。

3. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
4. 在CreateWidget节点中，指定创建的小组件。

添加事件处理

1. 在Hierarchy面板中，选择密码重置按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 打开Graph视图。
4. 关联XsollaLoginSubsystem对象上的一个ResetUserPassword方法调用至OnClicked节点，并添加用户输入数据传递。
5. 添加OnEmailSent和OnError回调函数。
6. 要开始调试小组件，请启动一个关卡。

事件处理实现示例：

成功发出密码重置请求后，用户将收到一封包含密码重置链接的邮件。在发布商帐户 > 登录管理器项目 > 安全性 > OAuth 2.0 > OAuth 2.0重定向URI中，您可以配置用户成功完成认证、邮箱验证或密码重置后将其重定向到的URL地址或路径。

本指南说明如何使用SDK方法实现用户通过社交网络帐户进行注册和登录。

与通过用户名/邮箱地址和密码进行用户认证不同，您无需实现单独的用户注册逻辑。如果用户的首次登录是通过社交网络进行，将自动创建一个帐户。

如果您在应用程序中将社交网络登录设置为一种备选认证方法，则在满足下列条件的情况下，社交网络帐户将自动与现有用户帐户关联：

• 使用用户名/邮箱地址和密码注册的用户通过社交网络帐户登录您的应用程序。
• 社交网络返回一个邮箱地址。
• 社交网络帐户中用户邮箱地址与其注册您的应用程序时使用的邮箱地址一致。

源代码

在GitHub上查看这些示例的源代码。

示例展示了如何设置通过Twitter帐户进行用户登录。您可以用相同的方法设置其他社交网络。

示例中的逻辑与界面比您在应用程序中的简单得多。演示项目提供了一种可能的认证系统实现方案。

创建小组件

1. 前往Content Browser并创建UI目录。
2. 在快捷菜单中，前往User Interface > Widget Blueprint。
3. 在小组件蓝图中，添加社交网络登录按钮。

下图为页面结构的示例。

4. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
5. 实现在关卡启动时显示小组件。在CreateWidget节点中，指定创建的小组件。

添加事件处理

1. 在Hierarchy面板中，选择登录按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 打开Graph视图。
4. 实现在内置浏览器中打开登录页：

1. 1. 将与XsollaLoginSubsystem对象连接的AuthenticateViaSocialNetwork方法调用添加到OnClicked节点，并添加用户输入数据传递。将Twitter值传入ProviderName参数。
   2. 添加回调函数：
      • OnSocialAuthSuccess — 身份认证成功后调用。
      • OnSocialAuthCancel — 身份认证被取消时调用。
      • OnSocialAuthError — 发生错误时调用。

本教程介绍如何使用SDK方法在游戏内商店中显示以下商品：

• 虚拟物品
• 虚拟物品组
• 捆绑包
• 虚拟货币套餐

源代码

在GitHub上查看这些示例的源代码。

开始之前，请在发布商帐户中配置商品：

1. 配置虚拟物品和虚拟物品组。
2. 配置虚拟货币套餐。
3. 配置捆绑包。

示例中的逻辑与界面比您实际在应用程序中的要简单得多。演示项目提供了一种可能的游戏内商店商品目录实现方案。

创建目录页的小组件

1. 前往Content Browser并创建UI目录。
2. 在快捷菜单中，前往User Interface > Widget Blueprint。
3. 在小组件蓝图中，添加以下UI元素：

1. • 在商品和虚拟货币套餐显示之间切换的按钮
   • 商品组的显示区域
   • 商品列表的显示区域
   • 虚拟货币套餐列表的显示区域

下图为页面结构的示例。

4. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
5. 实现在关卡启动时显示小组件。在CreateWidget节点中，指定创建的小组件。

添加目录页的小组件事件处理

1. 在Hierarchy面板中，选择切换到商品列表的按钮。
2. 在Details面板中，单击On Clicked事件旁边的+图标。

3. 在Hierarchy面板中，选择切换到虚拟货币套餐列表的按钮。
4. 在Details面板中，单击On Clicked事件旁边的+图标。

5. 打开Graph视图。
6. 实现在列表间切换的逻辑。方法是按照下图所示添加节点。

实现虚拟物品组的显示

创建商品组的类

1. 前往Content Browser。在快捷菜单中，单击Blueprint Class。
2. 在All classes部分，选择Object，然后单击Select。
3. 用BP_ItemGroupData作为类名。
4. 打开已创建类的蓝图。
5. 在My Blueprint面板中，单击Add New，然后选择Variable。
6. 在Details面板中：

1. 1. 在Variable Name字段中指定GroupData。
   2. 在Variable Type字段中选择XsollaItemGroup。
   3. 勾选Instance Editable和Expose on Spawn复选框。

创建商品组的小组件

1. 前往Content Browser并创建UI目录。在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加商品组名称的元素。

下图为小组件结构的示例。

3. 打开Graph视图。
4. 单击Class settings。
5. 在Details面板中，前往Interfaces > Implemented interfaces。
6. 单击Add，然后选择UserObjectListEntry。此为标准UE界面，允许UI基元实现列表元素常规的行为。
7. 实现创建商品组的逻辑：

1. 1. 添加EventOnListItemObjectSet节点以创建列表元素并初始化小组件。
   2. 将来自包含组数据的对象的值传入组名称元素。方法是按照下图所示添加节点。

1. 3. 实现类别为All的所有商品的显示逻辑。方法是如下图所示编辑蓝图。

8. 实现高亮列表中被选中商品组的逻辑。方法是如下图所示添加节点。

向目录页添加商品组列表

1. 打开目录页小组件蓝图。
2. 向商品组显示区域添加List View元素。
3. 在Details面板中，在Entry Widget Class字段中选择一个之前为商品组创建的类。
4. 实现向组添加商品的逻辑：

1. 1. 打开Graph视图。
   2. 将与XsollaLoginSubsystem对象连接的GetItemGroups SDK方法调用与EventConstruct节点关联，并添加用户输入数据传递。
   3. 实现向组添加商品的逻辑。该动作应在处理成功更新虚拟物品组时进行。方法是按照下图所示添加节点。

5. 实现类别为All的所有商品的显示逻辑。方法是如下图所示编辑蓝图。

实现虚拟物品的显示

创建商品的类

1. 前往Content Browser。在快捷菜单中，单击Blueprint Class。
2. 在All classes部分，选择Object，然后单击Select。
3. 用BP_CatalogItemData作为类名。
4. 打开已创建类的蓝图。
5. 在My Blueprint面板中，单击Add New，然后选择Variable。
6. 在Details面板中：

1. 1. 在Variable Name字段中指定CatalogItem。
   2. 在Variable Type字段中选择StoreItem。
   3. 勾选Instance Editable和Expose on Spawn复选框。

创建商品的小组件

1. 前往Content Browser并创建一个UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下UI元素：
   • 商品名称
   • 商品价格

下图为小组件结构的示例。

3. 打开Graph视图。
4. 单击Class settings。
5. 在Details面板中，前往Interfaces > Implemented interfaces。
6. 单击Add，然后选择UserObjectListEntry。此为标准UE界面，允许UI基元实现列表元素常规的行为。
7. 实现创建商品组的逻辑：

1. 1. 添加EventOnListItemObjectSet节点以创建列表元素并初始化小组件。
   2. 将来自包含商品数据的对象的值传入商品名称和商品价格元素。方法是按照下图所示添加节点。

向目录页添加商品列表

1. 打开目录页小组件蓝图。
2. 向商品列表显示区域添加List View元素。
3. 在Details面板中，在Entry Widget Class字段中选择一个之前为商品创建的类。
4. 实现向组添加商品的逻辑：

1. 1. 打开Graph视图。
   2. 将与XsollaLoginSubsystem对象连接的GetVirtualItems SDK方法调用与EventConstruct节点关联，并添加用户输入数据传递。
   3. 实现向组添加商品的逻辑。该动作应在处理成功更新虚拟物品组时进行。方法是按照下图所示添加节点。

5. 实现检查商品是否属于某个特定组的逻辑。方法是如下图所示添加节点。

6. 实现向组中添加商品的逻辑。方法是如下图所示添加节点。

实现按组显示虚拟物品

1. 打开目录页小组件蓝图。
2. 在Hierarchy面板中，选择商品组列表。
3. 在Details面板中，单击On Item Clicked事件旁边的+图标。

4. 打开Graph视图。
5. 实现按组筛选商品的逻辑。方法是按照下图所示添加节点。

实现捆绑包的显示

在本指南中，捆绑包和虚拟物品在一个列表中显示。此外，我们还使用同一个小组件来显示单个捆绑包或物品。

在目录页上添加捆绑包列表

1. 打开目录页蓝图。
2. 打开Graph视图。
3. 完成向列表添加捆绑包的逻辑。如下图所示添加GetBundles SDK方法回调和GetVirtualItems方法回调。

完成商品小组件

1. 打开商品小组件蓝图。
2. 在商品名称旁边添加一个查看捆绑包内容的按钮。

下图为小组件结构的示例。

3. 打开Graph视图。
4. 为捆绑包内容查看按钮添加显示条件，完成创建商品的逻辑。如下图所示。

添加显示捆绑包内容的逻辑

1. 在商品小组件的蓝图中，打开Designer视图。
2. 在Hierarchy面板中，选择查看捆绑包内容的按钮。
3. 在Details面板中，单击On Clicked事件旁边的+图标。

4. 打开Graph视图。
5. 实现显示捆绑包内容（捆绑包中的商品列表和每个商品的数量）的逻辑。方法是按照下图所示添加节点。

实现虚拟货币套餐的显示

创建虚拟货币套餐的类

1. 前往Content Browser。在快捷菜单中，单击Blueprint Class。
2. 在All classes部分，选择Object，然后单击Select。
3. 用BP_VcPackItemData作为类名。
4. 打开已创建类的蓝图。
5. 在My Blueprint面板中，单击Add New，然后选择Variable。
6. 在Details面板中：

1. 1. 在Variable Name字段中指定PackItem。
   2. 在Variable Type字段中选择VirtualCurrencyPackage。
   3. 勾选Instance Editable和Expose on Spawn复选框。

创建虚拟货币套餐小组件

1. 前往Content Browser并创建一个UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下UI元素：
   • 套餐名称
   • 套餐价格

下图为小组件结构的示例。

3. 打开Graph视图。
4. 单击Class settings。
5. 在Details面板中，前往Interfaces > Implemented interfaces。
6. 单击Add，然后选择UserObjectListEntry。此为标准UE界面，允许UI基元实现列表元素常规的行为。
7. 实现创建商品组的逻辑：

1. 1. 添加EventOnListItemObjectSet节点以创建列表元素并初始化小组件。
   2. 将来自包含套餐数据的对象的值传入显示名称和套餐价格的元素。方法是按照下图所示添加节点。

在目录页上添加虚拟货币套餐列表

1. 打开目录页小组件蓝图。
2. 向虚拟货币套餐列表显示区域添加List View元素。
3. 在Details面板中，在Entry Widget Class字段中选择一个之前为虚拟货币套餐创建的类。
4. 实现向列表添加套餐的逻辑：

1. 1. 打开Graph视图。
   2. 将与XsollaStoreSubsystem对象连接的GetVirtualCurrencyPackage方法调用与EventConstruct节点关联，并添加用户输入数据传递。
   3. 实现向列表添加套餐的逻辑。该动作应在处理成功更新虚拟货币套餐时进行。方法是按照下图所示添加节点。

本说明主要介绍如何使用SDK方法实现以真实货币计价的形式销售虚拟物品。

开始之前，需实现在目录中显示虚拟物品。下方示例中我们描述了如何实现虚拟物品的购买。其他商品类型的配置与此类似。

示例中的逻辑与界面比您在应用程序中的简单得多。演示项目提供了一种以真实货币计价的形式销售商品以及显示商品目录的可能方案。

源代码

在GitHub上查看这些示例的源代码。

完成目录页小组件

1. 打开目录页小组件。
2. 打开Graph视图。
3. 要在浏览器中打开支付页面：
   1. 实现支付令牌的接收：
      1. 添加InitiatePurchase节点，将与XsollaStoreSubsystem对象关联的FetchPaymentToken SDK方法调用连接至添加的节点。
      2. 向FetchPaymentToken方法传入所购商品的SKU以及用户授权令牌。

1. 2. 调用关联至XsollaStoreSubsystem对象的LaunchPaymentConsole SDK方法，并向其传入支付令牌。

实现支付页面打开以及支付状态接收的示例：

强化商品数据类

1. 打开BP_CatalogItemData蓝图。
2. 在My Blueprint面板中，单击Add New并选择Variable。
3. 在Details面板中：

1. 1. 在Variable Name字段中指定CatalogWidget。
   2. 在Variable Type字段中，选择W_StoreCatalog。
   3. 勾选Instance Editable和Expose on Spawn复选框。

结果是，列表中的每个元素将包含指向父级小组件的链接并可以调用其方法。

完成向目录页添加商品列表

1. 打开目录页小组件的蓝图。
2. 打开Graph视图。
3. 如下图所示完成填充商品列表的逻辑。

完成商品的小组件

1. 打开商品的小组件蓝图。
2. 添加一个商品购买按钮。

下图为小组件结构的示例。

3. 在Hierarchy面板中，选择一个商品购买按钮。
4. 在Details面板中，单击On Clicked事件旁边的+图标。

5. 打开Graph视图。
6. 实现点击商品购买按钮的逻辑。方法是按照下图所示添加节点。

结果是，点击商品购买按钮后，将根据目录页小组件中实现的逻辑在浏览器中打开一个支付页面。

本说明主要介绍如何使用SDK方法实现以虚拟货币计价的形式销售虚拟物品。

开始之前，需实现在目录中显示虚拟物品。

注：

下方示例中我们描述了如何实现虚拟物品的购买。其他商品类型的配置与此类似。

源代码

在GitHub上查看这些示例的源代码。

示例中的逻辑与界面比您在应用程序中的简单得多。演示项目提供了一种以虚拟货币计价的形式销售商品以及显示商品目录的可能方案。

要实现以虚拟货币计价的形式销售虚拟物品：

1. 向目录页小组件添加商品购买逻辑。
2. 向商品类添加发起商品购买逻辑的机制。
3. 完善向目录页添加商品列表。
4. 向小组件添加商品购买按钮。
5. 向小组件添加用虚拟货币购买商品的逻辑：
   1. 打开商品小组件的蓝图。
   2. 前往Graph视图。
   3. 如下所示添加节点。

结果是小组件中将显示为商品指定的虚拟货币价格。如果商品有多种虚拟货币价格，则列表中的第一种虚拟货币将用于显示和购买。

本教程介绍如何使用SDK方法显示用户物品库中的商品。

示例中的逻辑与界面比您实际在应用程序中的要简单得多。演示项目提供了一种可能的游戏内商店商品目录实现方案。

源代码

在GitHub上查看这些示例的源代码。

创建物品库页面的小组件

1. 前往Content Browser并创建UI目录。
2. 在快捷菜单中，前往User Interface > Widget Blueprint。
3. 在小组件蓝图中，添加商品列表的显示区域。

下图为物品库结构的示例。

4. 打开一个关卡蓝图：
   1. 在Content Browser中选择一个关卡。
   2. 在主菜单中，前往Blueprints > Open Level Blueprint。
5. 实现在关卡启动时显示小组件。在CreateWidget节点中，指定创建的小组件。

创建商品的类

1. 前往Content Browser。在快捷菜单中，单击Blueprint Class。
2. 在All classes部分，选择Object，然后单击Select。
3. 用BP_UserInventoryItemData作为类名。
4. 打开已创建类的蓝图。
5. 在My Blueprint面板中，单击Add New，然后选择Variable。
6. 在Details面板中：

1. 1. 在Variable Name字段中指定UserInventoryItem。
   2. 在Variable Type字段中选择InventoryItem。
   3. 勾选Instance Editable和Expose on Spawn复选框。

7. 在My Blueprint面板中，单击Add New，然后选择Variable。
8. 在Details面板中：
   1. 在Variable Name字段中指定ExpiresIn。
   2. 在Variable Type字段中选择Integer64。
   3. 勾选Instance Editable和Expose on Spawn复选框。

创建商品的小组件

1. 前往Content Browser并创建一个UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下UI元素：
   • 商品名称
   • 商品特征：
     • 对于时效性商品 — 商品状态（激活或到期）
     • 对于消耗品 — 商品数量
     • 对于非消耗品 — 不显示任何特征

下图为小组件结构的示例。

3. 打开Graph视图。
4. 单击Class settings。
5. 在Details面板中，前往Interfaces > Implemented interfaces。
6. 单击Add，然后选择UserObjectListEntry。此为标准UE界面，允许UI基元实现列表元素常规的行为。
7. 实现创建商品的逻辑：

1. 1. 添加OnListItemObjectSet节点以创建列表元素并初始化小组件。
   2. 将来自包含商品数据的对象的值传入商品名称元素。方法是按照下图所示添加节点。

1. 3. 通过根据商品类型将商品数据传入商品特征元素，实现定义商品类型。方法是如下图所示添加节点。

向物品库页面添加商品列表

1. 打开物品库页面小组件蓝图。
2. 向商品列表显示区域添加List View元素。
3. 在Details面板中，在Entry Widget Class字段中选择一个之前为商品组创建的类。
4. 实现向组添加商品的逻辑：

1. 1. 打开Graph视图。
   2. 将与XsollaInventorySubsystem对象连接的GetInventory和GetTimeLimitedItems连续SDK方法调用与EventConstruct节点关联，如下图所示：

1. 3. 实现填充商品列表的逻辑。方法是如下图所示添加节点。

1. 4. 添加定义时效性商品到期时间的逻辑。方法是如下图所示添加节点。

本教程介绍如何使用SDK方法在应用中显示虚拟货币的余额。

在示例中，我们显示了用户物品库中的虚拟货币及其余额。因此，开始之前应先实现用户物品库中商品的显示。

示例中的逻辑与界面比您实际在应用程序中的要简单得多。演示项目提供了一种可能的游戏内商店商品目录实现方案。

源代码

在GitHub上查看这些示例的源代码。

创建余额显示类

1. 前往Content Browser。在快捷菜单中，单击Blueprint Class。
2. 在All classes部分，选择Object，然后单击Select。
3. 用BP_VcBalanceItemData作为类名。
4. 打开已创建类的蓝图。
5. 在My Blueprint面板中，单击Add New，然后选择Variable。
6. 在Details面板中：

1. 1. 在Variable Name字段中指定VcBalanceItem。
   2. 在Variable Type字段中选择VirtualCurrencyBalance。
   3. 勾选Instance Editable和Expose on Spawn复选框。

创建显示余额的小组件

1. 前往Content Browser并创建一个UI目录，在快捷菜单中，前往User Interface > Widget Blueprint。
2. 在小组件蓝图中，添加以下UI元素：
   • 虚拟货币名称
   • 虚拟货币数量

下图为小组件结构的示例。

3. 打开Graph视图。
4. 单击Class settings。
5. 在Details面板中，前往Interfaces > Implemented interfaces。
6. 单击Add，然后选择UserObjectListEntry。此为标准UE界面，允许UI基元实现列表元素常规的行为。
7. 实现向列表添加虚拟货币的逻辑：

1. 1. 添加EventOnListItemObjectSet节点以创建列表元素并初始化小组件。
   2. 将来自包含虚拟货币数据的对象的值传入虚拟货币名称和虚拟货币数量元素。方法是按照下图所示添加节点。

完成显示物品库的小组件

1. 打开物品库页面小组件蓝图。
2. 向虚拟货币列表显示区域添加List View元素。
3. 在Details面板中，在Entry Widget Class字段中选择一个之前为余额显示创建的类。
4. 实现填充虚拟货币列表的逻辑：

1. 1. 打开Graph视图。
   2. 将与XsollaInventorySubsystem对象连接的GetVirtualCurrencyBalance方法调用与EventConstruct节点关联。
   3. 实现填充虚拟货币列表的逻辑。该动作应在处理成功更新虚拟货币余额时进行。方法是按照下图所示添加节点。