Creator开放数据域排行榜wx.setUserCloudStorage,KVDataList,getFriendCloudStorage,keyList,postMessage,onMessage

//*********************************************************** 【【一】】主域介绍 **************************************************//
WXSubContextView 翻译：微信子上下文视野 //用在主域中//
1）控制子域再 WXSubContextView所在的节点中的大小，自动跟这个节点大小保持一致（【这个节点的大小】尽量和【子域中的排行榜大小】保持一致）
2）开放数据域的内容将被直接缩放到【主域的容器节点区域内】，只要宽高比一致就不会产生拉伸。
2）由于开放数据域只能在离屏画布 sharedCanvas 上渲染，因此需要我们把 sharedCanvas 绘制到主域上。
wx.setUserCloudStorage翻译：设置用户云存储【对用户托管数据进行写数据操作，允许同时写多组 KV 数据。托管数据的限制 > 每个openid所标识的微信用户在每个游戏上托管的数据不能超过128个key-value对】

   wx.getLaunchOptionsSync//微信库 -微信开发者文档      获取小游戏启动时的参数。.query表示启动参数wx.postMessage({     向子域   发消息给子域 message: 'Hide',隐藏排行榜//              message: 'Show',//显示排行榜      什么时候显示什么时候隐藏根据需求message: 'Hide',});

//****************************************************** 监听排行榜的显示与隐藏 *******************************************************//
/
* 更新排行
*/
UpdataPaiHangscore() {
var cardscore = 0;
for (let i = 0, length = mUserData.canupcard.length; i < length; ++i) {
cardscore += mUserData.canupcard[i];
}
var score = (mUserData.arr_hasstarcard.first.length * 2 + cardscore).toString();
if (cc.sys.platform == cc.sys.WECHAT_GAME) {
wx.setUserCloudStorage({
KVDataList: [{ key: ‘Gamescore’, value: score }], //KVDataList: K表示Key V表示Value DateList表示用户数据列表用户要修改的 KV 数据列表 , 即存入用户信息到//微信云存储上 , 在下面的子域中将获取这个值进行排序，
})
}
}

//********************************************************** 【【二】】子域介绍 *****************************************************//

1）wx.getFriendCloudStorage() 翻译：获取好友云存储 //用在子域中// 通常使用域好友排名
wx.getGroupCloudStorage() 翻译：获取组云存储 //用在子域中// 通常不使用
2）子域的摄像机的 BackgroundColor一定要设置完全透明，或者全黑 clearFlags不勾选 Depth为 -1

//****************************************************** 监听排行榜的显示与隐藏 *********************************************************//
this.UIPaiHang.active = false;
if (cc.sys.platform != cc.sys.WECHAT_GAME) {
return;
}
wx.onMessage(data => { // 接受监听主域发给子域的消息，可以放到canvas节点的Lanuch脚本的start方法中，用来控制UIPaiHang根节点的显示与隐藏
switch (data.message) {
case ‘Show’:
this.UIPaiHang.active = true;
break;
case ‘Hide’:
this.UIPaiHang.active = false;
break;
}
});

//********************** 获取用户游戏数据( creator得wx类库的UserGameData )进行排序 ********************************//
const DataSorter = function (dataArray: UserGameData[]) { //UserGameData[] 是微信类库里就是将要排序的用户数据的数组
return dataArray.sort(function (obj1, obj2): number { //(obj1, obj2）dataArray数组里默认传递过来的参数，【主要是【快速排序】进行分段，辅助以【插入排序】进行对数据量小的排序，（【堆排序】进行递归深层次进行排序）】每次取两个, 是等于把UserGameData的对象放进来，过滤一下，看是不是等于Gamescore键值对的值，是的话，还返回它自己的对象的索引
let index = function (obj: UserGameData) {
for (let i = 0; i < obj.KVDataList.length; i++) { //KVDataList用户的托管 KV 数据列表，就是UserGameData里面的的一个方法，就是主域里面存储的各个好友的用户数据
if (obj.KVDataList[i].key === ‘Gamescore’) {
return i;
}
}
return -1;
}
let val1 = obj1.KVDataList[index(obj1)].value;
let val2 = obj2.KVDataList[index(obj2)].value;
return parseInt(val1) > parseInt(val2) ? -1 : parseInt(val1) < parseInt(val2) ? 1 : 0; //可以理解为【parseInt(val1) > parseInt(val2) ? -1】 : 【parseInt(val1) < parseInt(val2) ? 1】 : 0; //大于的话赋值-1，小于的话赋值1，等于的话赋值为0
})
}

//****************************************************** 获取用户游戏数据进行排序 *********************************************************//
FriendpopulateList() {
var my = this;
wx.getFriendCloudStorage({
keyList: [“Gamescore”],
success: res => {
this.HaoYouGameData = DataSorter(res.data);
my.Root.removeAllChildren();
for (var i = 0; i < my.HaoYouGameData.length; i++) {
var playerInfo = my.HaoYouGameData[i];
var item = cc.instantiate(my.prefabRankItem);
item.getComponent(PaiHangItem).init(i, playerInfo);
my.Root.addChild(item);
}
}
})
}

原文链接 https://blog.csdn.net/qq_16224121/article/details/82459425

微信小游戏开放数据域及排行榜的使用

好久没有写博客了，距离上一次博客，已经有了近半年之久，这段时间发生了太多的事，当然，这些不是今天的主题，接下来我们主要讲一讲微信小游戏开放数据域的使用，以及如果制作排行榜。

首先，要进行知识的普及，这方面肯定是官方文档最靠谱啊，所以先上官方链接https://developers.weixin.qq.com/minigame/dev/tutorial/open-ability/open-data.html（微信对于开放数据域的解释），http://docs.cocos.com/creator/manual/zh/publish/publish-wechatgame-sub-domain.html?h=开放（creator对于接入微信小游戏开放数据域的方式及demo）。

其实这两篇文档看过之后，你基本就可以搞定了，那我为啥还写这篇呢，因为我喜欢技（zhuang）术（bi）啊。后面我们对此进行一些内容的扩展，以便能够让学习者能够尽快的上手，并能够用于项目中。

首先，我的creator是2.0.1版本，因为在2.0.1以下两种版本上屏方式不同（不明白上屏概念，请阅读微信的那篇文档），所以我们在文档中都会表述，以便大家可以选择适合自己的版本。

废话不再多说，代码开撸。

第一步，创建一个空工程，进行简单的布局，创建一个精灵，用于展示排行榜展示的区域，设置宽高，这个宽高很重要，因为你的开放数据域就是要创建这么大，demo中就为600*600在2.0.1版本中，选择添加组件->添加其他组件->WXSubContextView组件，即可完成上屏注册。

低版本的就比较坑了，需要使用代码注册一下，代码如下：

这个和官方的demo是一致的，不多做解释了。（我也解释不清楚，啦啦啦，你打我啊~~）

我们知道，排行版的数据是微信的数据，那么第一步就是要先把我们需要的数据上传给微信服务器那边，wx.setUserCloudStorage()微信提供了这个函数，以便能够将数据上传，函数定义（https://developers.weixin.qq.com/minigame/dev/document/open-api/data/wx.setUserCloudStorage.html）有兴趣的可以看一下，现在，就在需要上传数据的地方，上传数据，这里需要注意，必须依据微信定义的数据结构才能使用，不然会报错–无效的KVDataList。

这样，数据就可以上传了。

当然，我们是希望能够控制排行榜的展示与否，那么，当然是点击按钮的时候再展示出来，所以，我们需要在主域向子域中发送消息，告诉他，你可以展示了，不听话当心打你小屁屁哦。

至此，主域的内容算是完成，他的使命已经终结了，接下来，新创建一个工程，作为子域工程。

创建新工程，将scene大小改为600*600（上文已说明），同时，将maincamera的backgroundcolor属性中的A改为0，否则他的背景将是黑色，如果你需要其他的背景透明度，请自行调整数值。

既然是排行榜，当然首选的是scrollview控件，对此控件的用法可以参考官方文档或者百度一下，这里只说一下注意点：第一点，在content下挂载layout组件，resizemode选择container，另外，没有第二点。啦啦啦~~不皮一下不开心啊。

对于列表中的每一个item，当然是预制啦，这里就不多做解释，只说一个问题，那就是它的顶部要在0以下，就是说，整个item的坐标都是Y为负值。

好，准备工作已完成，下面又到了光辉的撸代码的时候了。

首先，我们要接收从主域发过来的消息，以便于知道要去展示排行榜。

好，接收到了消息，那么就可以去做操作啦。

接下来，自然是去请求数据：

拿到数据自然是去展示啦，这里就不贴代码了，毕竟只是对预制的内容赋值，但是有两点需要注意的，这次是真的有两点：第一点，当你的列表不能充满的时候，会出现划不动的情况，这个时候请设置layout的resizemode为NONE，其他情况不变，第二点，展示头像的方法需要拿到外面调用，如果写在循环体中，会出现只展示最后一个头像的问题，具体原因我不清楚，如有大神了解原因，烦请告知。（不明白我说的，请下载源码查看）

好，接下来就要构建发布了，因为使用的是wxAPI，所以必须到微信平台运行，主域的构建就是

子域的构建要把名称改为你写的开放数据域代码目录的名称，并更改发布路径到主域的发布路径下：

如此，在主域的wechatgame下就可以看到相应的目录了。

最后，在微信的开发者工具中打开主域工程，就能看到想要的效果啦。

这个数据比较少，你也可以模拟数据看看效果。

因为时间问题，文档不能够详细的说全（一个字，懒），大家有意见敬请提出，反正我也不改，啦啦啦，打我啊~~

以上就是微信开放数据域及排行榜的用法，还是老规矩，代码上传，如有需要，请下载查看，另外，群里也共享了很多技术资源，如有兴趣，欢迎加群：221725135

资源链接：https://download.csdn.net/download/qq_16224121/10649218，

Creator开放数据域排行榜wx.setUserCloudStorage,KVDataList,getFriendCloudStorage,keyList,postMessage,onMessage相关推荐

cocosjs微信头像本地服务器,Cocos creator游戏接入微信开放数据域，实现好友排行榜功能...
微信小游戏加入排行榜功能,可以增加游戏微信好友参与,增加分数竞争氛围,官方的说明文档不怎么详细,也有坑.本文实战以cocos creator v2.2版本为例,供大家参考. 结果显示: 前提: 1.创 ...
CocosCreator微信小游戏排行榜及开放数据域的理解与使用
微信小游戏开放数据域及排行榜的使用好久没有写博客了,距离上一次博客,已经有了近半年之久,这段时间发生了太多的事,当然,这些不是今天的主题,接下来我们主要讲一讲微信小游戏开放数据域的使用,以及如果制作 ...
微信小游戏|开放数据域的写与读
本文来自Cocos官方论坛,感谢「达闻西」的分享! 1. 引言本来是自己写的笔记,想想还是发出来把,能让不少新手少走弯路,毕竟自己也是摸索了好久!以图片的形式,让大家更直观点! 微信小游戏API官方 ...
LayaAir 绘制微信小游戏开放数据域画面
LayaAir 绘制微信小游戏开放数据域画面请大家关注我的微博:@NormanLin_BadPixel坏像素之前写过用cocosCreator绘制微信小游戏子域的教程,保持整体思路不变,现在再写一 ...
LayaAirIDE实现微信小游戏排行榜绘制（开放数据域）
看这篇文章的前提是你 1.已经在微信Web开发者平台里使用wx.setUserCloudStorage接口把自己的数据存储到微信提供的服务器上, 2.并且已经通过wx.getFriendCloudSt ...
初始化创建画布_使用HTML5，画布和开放数据创建全球降水（雨）可视化
初始化创建画布我目前正在为Three.js编写下一本书,其中一章涉及可视化开放数据. 在寻找可以使用的数据时,我遇到了来自NOAA的一组数据. 通过此站点,您可以以网格格式下载一组全世界的每月降水报 ...
使用HTML5，画布和开放数据创建全球降水（雨）可视化
我目前正在为Three.js编写下一本书,其中一章涉及可视化开放数据. 在寻找可以使用的数据时,我遇到了来自NOAA的一组数据. 通过此站点,您可以以网格格式下载一组全世界的每月降水报告. 因此,我下 ...
微信开放平台open认证_在Open Knowledge上传播开放数据的日常任务
微信开放平台open认证 Beatrice Martini是Open Knowledge的活动经理. 紧随其后的是她在日内瓦举行的开放知识会议(2013)的成功活动,她现在正在组织将于7月15日至17 ...
商户后台返回数据签名错误_微信小程序用户信息开放数据校验与解密
服务端获取开放数据小程序可以通过各种前端接口获取微信提供的开放数据.考虑到开发者服务端也需要获取这些开放数据,微信提供了两种获取方式: 方式一:开发者后台校验与解密开放数据方式二:云调用直接获取开 ...

Creator开放数据域排行榜wx.setUserCloudStorage,KVDataList,getFriendCloudStorage,keyList,postMessage,onMessage

原文链接 https://blog.csdn.net/qq_16224121/article/details/82459425

Creator开放数据域排行榜wx.setUserCloudStorage,KVDataList,getFriendCloudStorage,keyList,postMessage,onMessage相关推荐

最新文章

热门文章