> 技术文档 > unity转微信小游戏:全国排行榜_unity 微信排行榜

unity转微信小游戏:全国排行榜_unity 微信排行榜


unity转微信小游戏:全国排行榜

  • 准备工作和实现流程
  • uinty创建全国排行榜UI
  • 开通微信开发者工具云开发创建云函数
    • 配置云开发环境
    • 创建云函数文件夹和云函数
      • 1、创建云函数文件夹
      • 2、创建云函数
        • 创建上传云函数
        • 创建下载云函数
  • 参考官方Demo代码修改编写全国排行榜代码
    • 初始化微信SDK
    • 判断用户是否授权获取用户信息用于排行榜显示
    • 授权后上传用户信息用于排行榜
    • 下载数据库信息用于排行榜显示

准备工作和实现流程

1、unity安装微信小程序转换工具

unity转微信小游戏插件20250114版本

如果不会使用可以参考unity转微信小游戏:转换工具及使用方法学习

unity转微信小游戏:转换工具及使用方法

2、uinty创建全国排行榜UI

3、开通微信开发者工具云开发创建云函数

微信开发者工具云开发首次开通免费试用1个月,到期之后不会自动续费,续费就是每个月19.9元,云开发还可以使用CDN加载游戏等如果有需要可以开通

unity转微信小游戏:使用CDN加载游戏(微信开发者工具云开发CDN)

4、导入官方排行榜Demo,可以参考官方Demo修改编写全国排行榜代码

unity转微信小游戏排行榜Demo-202501

uinty创建全国排行榜UI

如果全国排行榜显示前50名或者更多固定的名次显示,可以创建固定数量名次显示的排行榜,本文章使用的就是固定名次排行榜

1、unity里在Canvas下面创建滚动视窗

unity转微信小游戏:全国排行榜_unity 微信排行榜

2、在滚动视图下的Connect下创建显示名次的排行榜item,50名就创建50个item,这种排行榜可以自定义每个名次的称号和其他显示不一样的东西,缺点就是每个item都需要手动修改

如果排行榜名次只显示固定排序的数字也可以创建1个item预制体,然后通过代码控制生成其他的item显示

unity转微信小游戏:全国排行榜_unity 微信排行榜

注意

滚动视窗里Viewport的宽度和高度控制显示排行榜的大小

unity转微信小游戏:全国排行榜_unity 微信排行榜

Connect下的Vertical Layout Group里面的间距控制每个item之间的间距

unity转微信小游戏:全国排行榜_unity 微信排行榜

开通微信开发者工具云开发创建云函数

进入微信开发者工具点击右上角云开发开通云开发服务

unity转微信小游戏:全国排行榜_unity 微信排行榜

配置云开发环境

1、创建云开发数据库

点击云开发找到云开发控制台里的数据库点击进入,在数据库页面左边集合名称旁点击unity转微信小游戏:全国排行榜_unity 微信排行榜创建数据集合,操作完成后数据库就创建完了

unity转微信小游戏:全国排行榜_unity 微信排行榜

创建完成后点击云开发控制台左边的概览,里面能看见刚才创建的数据库,页面右边有一个环境ID点击环境ID右边的蓝框可以复制环境ID,下面就要用到这个环境ID

unity转微信小游戏:全国排行榜_unity 微信排行榜

2、初始化云开发环境

资源管理器找到game.js在代码页最下面189行添加如下代码

wx.cloud.init ({  env: \'环境ID\'})

把环境ID替换成上面复制的自己的环境ID

unity转微信小游戏:全国排行榜_unity 微信排行榜

3、配置云函数目录位置

资源管理器找到project.config.json在代码页最下面添加代码
最下面最后一行是 } 新添加代码不要忘了上面的 } 后面加 , 最后还要加 }
60行 } 加,下面添加如下代码

 \"cloudfunctionRoot\": \"cloundfunctions/\", \"cloudfunctionTemplateRoot\": \"cloudfunctionTemplate/\"}

完成上面这几个操作配置云开发云函数的环境就完成了

unity转微信小游戏:全国排行榜_unity 微信排行榜

创建云函数文件夹和云函数

1、创建云函数文件夹

资源管理器下创建cloundfunctions文件夹,上面我们配置的目录文件夹名字是cloundfunctions所以创建的文件夹也叫cloundfunctions

创建完成后文件夹会有个云朵图标unity转微信小游戏:全国排行榜_unity 微信排行榜
如果没有就是上面讲的配置没配好

创建完后右键文件夹可以选择之前创建的数据库环境,有时会自动给选择如果选择不了或者环境为空重启一下微信开发者工具

unity转微信小游戏:全国排行榜_unity 微信排行榜

2、创建云函数

unity和微信小游戏之间交换全国排行榜数据需要两个云函数,一个上传的一个下载的,所以我们需要创建两个云函数,如果还需要定期清理数据库排行榜空或者老旧数据还可以创建一个清理数据库的云函数

创建上传云函数

资源管理器cloundfunctions文件夹右键选择新建Node.js云函数创建云函数

unity转微信小游戏:全国排行榜_unity 微信排行榜

新建一个UpLoadData云函数,云函数下会有几个代码页,我们只需要修改云函数下的index.js代码然后上传部署就可以了

unity转微信小游戏:全国排行榜_unity 微信排行榜

UpLoadData云函数代码如下

// 云函数入口文件const cloud = require(\'wx-server-sdk\');cloud.init({  env: cloud.DYNAMIC_CURRENT_ENV});// 使用当前云环境//获取数据库引用const db = cloud.database();const gamedata = db.collection(\'环境ID\');// 云函数入口函数//上传用户存档数据exports.main = async (event, context) => {  const wxContext = cloud.getWXContext(); const {  userInfo, ...cleanedEventData } = event; //查询用户是否已经保存过数据 let _isHas = await gamedata.where({  openid: wxContext.OPENID }).get(); //如果没有,首次保存 if (_isHas.data.length == 0) {  let _isAdd = null; let addData = {  openid: wxContext.OPENID, gamedata: cleanedEventData, } _isadd = await gamedata.add({  data: addData }) return