打开开发者工具，添加项目，快速启动模板。
小游戏开发文档：
https://mp.weixin.qq.com/debug/wxagame/dev/index.html
看一下配置，比如在game.json里面添加一个showStatuBar:ture ，就可以实现出现状态栏。进行全局配置。
canvas创建的API：
web上创建canvas，需要getElementById 获得节点，微信这里创建，也是基于这个原理。只不过是做了一个封装。基架里有一个文件，可以看到：这是一个适配器文件，里面已经有了wx.createCanvas() 操作。
如果不删除这个文件，再做一次createCanvas，就成了离屏的canvas，
离屏canvas是不可见的，怎么操作都是无效的。
readme，项目说明。把东西都删掉。就剩一个game.js和game.json
有很多不严谨的地方，官方文档代码，如果在webstorm打开，有很多报错和提示。很多写法是不严谨的。如分号。
官方文档这么创建canvas：
创建 Canvas
调用 wx.createCanvas() 接口，可以创建一个 Canvas 对象。
varcanvas = wx.createCanvas()
在 Canvas 上进行绘制
但是由于没有在 canvas 上进行绘制，所以 canvas 是透明的。使用 2d 渲染上下文的进行简单的绘制，可以在屏幕左上角看到一个 100x100 的红色矩形。
var context = canvas.getContext('2d')
context.fillStyle ='red'
context.fillRect(0,0,100,100)
由于微信开发者工具用的没有webstorm方便，所以可以在webstorm中进行操作。
微信小游戏的编程语法完全是和canvas一致的。 也就是说我们在webstorm里面通过html写的canvas，做的一系列逻辑操作，把我们HTML文件移除掉，再把js中的canvas创建换成微信的canvas创建的语句，就可以平滑的移植了。比如在webstorm中创建一个空项目，新建一个html文件，在里面写一个canvas，给它一个宽，一个高，id是game_canvas。用严格模式。把微信上的四行代码复制过来，alt+enter，会有程序自动修补。然后进行调试，wx is not defined ，这个api是没有的。只需要把wx换成getElementById("game_canvas")，刷新后，跟微信开发者工具没有任何区别。
不用纠结使用什么开发工具，用更好的就行了。
而且微信开发者工具代码同步比较慢。刷新比较慢。之后项目在在webstorm中开发。之后只需要一换就OK了。
网友评论