博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何利用开放数据域为微信小游戏添加社交关系链玩法
阅读量:5881 次
发布时间:2019-06-19

本文共 2546 字,大约阅读时间需要 8 分钟。

3月23日, 小程序游戏类目开放测试,开发者可开发、调试小游戏,同时,微信官方还对小游戏开放了微信社交关系链、虚拟支付能力。但是令一些开发者感到困惑的是「如何才能利用开放数据域为微信小游戏添加社交关系链玩法」。

图片描述

这张图片是来自于微信小游戏的跳一跳排行榜,小游戏不但开放了用户注册也把关系链数据开放了出来,有了这些数据普通的开发者也可以开发出类似的排行榜功能,有了关系链数据,会大大增加游戏玩法,玩家之间的互动,给游戏带来了更大的趣味性。

小游戏主要提供了 wx.getFriendCloudStorage() 和 wx.getGroupCloudStorage() 两个 API 接口。但是为了保护关系链数据,小游戏增加了开放数据域的概念,开放数据域只能在离屏画布(sharedCanvas)上使用,这块画布和主域是可以共享的,我们需要把 sharedCanvas 绘制到主域上,这个过程需要开发者接触底层的 canvas 底层 API,对于不熟悉的同学会带来很大的不便,所以白鹭引擎对做了进一步的优化与封装。

请开发者先阅读微信小游戏开放数据的文档这样对关系链会有更好的理解。

使用示例:

1、白鹭引擎使用开放数据域的原理简介。关系链数据必须在开放数据域中获取。引擎在主域中使用window["sharedCanvas"]接口获取到 sharedCanvas,然后直接使用 sharedCanvas 作为 egret.Bitmap 的 egret.BitmapData ,添加在主域的舞台上即可。这样在使用上带来了极大的方便性。

2、由于 开放数据域 是一个封闭、独立的 JavaScript 作用域 所以要建立两个 egret 项目,主域项目 (egretToWxDemo) 和开放数据域项目 (myOpenDataContext) ,为了减少小游戏的体积,在开放数据域项目中只保留 egret、game两个模块。关于图片的加载可以白鹭提供的 egret.ImageLoader 或者直接使用 微信小游戏原生提供的 Image 对象进行加载。

3、在 launcher 中将主域项目发布成小游戏项目,发布成功后得到一个 egretToWxDemo_wxgame 文件夹,然后需要在 game.json 中添加配置项 openDataContext 指定开放数据域的代码目录,这里我们填写 openDataContext,一会我们要将开放数据域的项目发布到这里。修改 Main.ts 文件,将离屏画布绘制到主域上;

//主要示例代码开始  const bitmapdata = new egret.BitmapData(window["sharedCanvas"]);  bitmapdata.$deleteSource = false;  const texture = new egret.Texture();  texture._setBitmapData(bitmapdata);  this.bitmap = new egret.Bitmap(texture);  this.bitmap.width = this.stage.stageWidth;  this.bitmap.height = this.stage.stageHeight;  this.addChild(this.bitmap);  egret.startTick((timeStarmp: number) => {      egret.WebGLUtils.deleteWebGLTexture(bitmapdata.webGLTexture);      bitmapdata.webGLTexture = null;      return false;  }, this);  //主要示例代码结束
{    "deviceOrientation": "portrait",    "networkTimeout": {        "request": 5000,        "connectSocket": 5000,        "uploadFile": 5000,        "downloadFile": 5000    },    "openDataContext": "openDataContext"}

4、再使用 wing 打开开放数据域项目,打开 egretProperties.json 配置模块中值保留 egret、game 、'promise'模块,删除 resource 目录下所有内容,这是为了减少游戏的体积。

"modules": [    {      "name": "egret"    },    {      "name": "game"    },    {      "name": "promise"    }  ]

5、在开放数据域 script 目录里打开 config.wxgame.ts 文件。 输出路径 (outputDir) 改为 ../egretToWxDemo_wxgame/openDataContext,然后把 demo 中的 wxgame.ts 插件替换到 script 的 wxgame 目录内。

图片描述

6、由于开放数据域可以使用主域的图片资源,我们直接利用主域内的图片,修改 Main.ts 文件,由于篇幅所限,具体见示例 demo。

7、在 launcher 中将开放数据域项目发布成小游戏,这时有可能发布的目录不正确,不要着急,回到开放数据域项目中执行 egret publish --target wxgame 命令,如果报错请在主域发布的小游戏项目中找到 openDataContext 目录,创建一个 index.js 文件,再次回到开放数据域项目中执行 egret publish --target wxgame 命令,正常情况发布成功后如图所示。

图片描述

注意事项

一定要帧率为 60 帧。避免屏幕闪烁。

开发后数据域尽量少使用库。

如您在开发过程中遇到任何问题,请登录官方论坛进行讨论。

示例DEMO下载请访问

转载地址:http://ckvix.baihongyu.com/

你可能感兴趣的文章
Android系统的创世之初以及Activity的生命周期
查看>>
彻底解决Linux下memcached的安装
查看>>
人人都会数据采集- Scrapy 爬虫框架入门
查看>>
Android网络编程11之源码解析Retrofit
查看>>
韩国SK电讯宣布成功研发量子中继器
查看>>
TCP - WAIT状态及其对繁忙的服务器的影响
查看>>
安全预警:全球13.5亿的ARRIS有线调制解调器可被远程攻击
查看>>
麦子学院与阿里云战略合作 在线教育领军者技术实力被认可
查看>>
正确看待大数据
查看>>
Facebook通过10亿单词构建有效的神经网络语言模型
查看>>
2016股市投资风向标 大数据说了算
查看>>
发展大数据不能抛弃“小数据”
查看>>
中了WannaCry病毒的电脑几乎都是Win 7
查看>>
学生机房虚拟化(九)系统操作设计思路
查看>>
nginx报错pread() returned only 0 bytes instead of 4091的分析
查看>>
HTML 字符实体
查看>>
质数因子
查看>>
在NVIDIA Quadro NVS 295 显卡上装redhat 黑屏 无信号输入
查看>>
Announcing the new Office 365 admin center
查看>>
小白经营网站的前前后后
查看>>