Flappy Bird游戏的开发暂时告一段落，今天看看如何在微信小程序发布体验版游戏，以及如何实现虚拟摇杆。

发布微信小程序

1. 在微信公众平台注册一个用于发布小程序的号，补充相关信息（类目选其他游戏）。
2. 在电脑上下载微信开发者工具，配置环境变量，开放调试端口。
3. 在Cocos2D引擎上设置微信开发者工具路径，打包游戏。
4. 在微信开发者工具上对打包好的游戏进行验证并上传，开启体验版。
5. 邀请用户体验游戏。

实现虚拟摇杆

有不少手机游戏需要用虚拟摇杆控制角色的移动，这里看看它是怎么实现的。

虚拟摇杆主要由两部分组成：摇杆圆盘背景和摇杆本身。根据触屏事件的官方文档和虚拟摇杆的实际使用情况，可分为以下几种事件：

• 触摸到摇杆的一瞬间：TOUCH_START。
• 按压摇杆在圆盘背景区域内移动：TOUCH_MOVE。
• 因各种原因取消按压摇杆：TOUCH_CANCEL，TOUCH_END。

脚本实现

虚拟摇杆的脚本实现如下：

//1.游戏虚拟摇杆的逻辑实践
//（1）判断是否点击到背景图上面
//（2）如果点击到摇杆上面，把中心那个摇杆的把手放到鼠标（手指）所点击的位置
//（3）手指没有松开之前，根据手指的位置不断的设置中心把手的位置
//（4）如果松开手指，摇杆回到中心点

cc.Class({
    extends: cc.Component,

    properties: {
        //获取摇杆的背景图
        rockerBg:cc.Node,
        //获取到摇杆中心点
        center:cc.Node,
        //控制的目标
        targetN:cc.Node,
        speed:0
    },

    onLoad () {
        this.rockerBg.on(cc.Node.EventType.TOUCH_START, this.onTouchStart, this);
        this.rockerBg.on(cc.Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
        this.rockerBg.on(cc.Node.EventType.TOUCH_END, this.onTouchEndAndCancel, this);
        this.rockerBg.on(cc.Node.EventType.TOUCH_CANCEL, this.onTouchEndAndCancel, this);
        //保存摇杆当前所控制的向量
        this.dir = cc.v2(0,0);
    },

    //点击到摇杆的时候触发的回调
    onTouchStart(event){
        //把中心点移动到手指点击的位置即可
        //event.getLocation()返回世界坐标
        let worldPos = event.getLocation();
        //转成中心点的坐标
        let clickPos = this.node.convertToNodeSpaceAR(worldPos);
        this.center.x = clickPos.x;
        this.center.y = clickPos.y;
        //保存初始的方向向量
        this.dir = clickPos.sub(cc.v2(0,0));
    },

    //在摇杆当中不断移动的时候的回调
    onTouchMove(event){
        let worldPos = event.getLocation();
        //转成中心点的坐标
        let clickPos = this.node.convertToNodeSpaceAR(worldPos);
        //拿到点击点跟中心(0,0)连成的向量的长度
        let dir = clickPos.sub(cc.v2(0,0));
        //算出点击点跟中心连线的长度
        let dist = dir.len();
        //半径
        let radius = this.rockerBg.width / 2;
        // 如果按压点在背景圆盘内, 设置摇杆本身位置为按压点
        if(dist <= radius){
            this.center.x = clickPos.x;
            this.center.y = clickPos.y;
        }
        // 否则获取按压点相对圆盘中心点的方向向量, 将摇杆本身位置设置到背景圆盘沿这一方向的边缘
        else{
            //归一化向量
            let norDir = dir.normalize();
            let pos = norDir.mul(radius);
            this.center.x = pos.x;
            this.center.y = pos.y;
        }
        this.dir = dir;
    },

    //手指松开的回调
    onTouchEndAndCancel(event){
        this.center.x = 0;
        this.center.y = 0;
        this.dir = cc.v2(0,0);
    },

    // 让控制目标移动
    update(dt){
        if(!this.targetN || !this.speed){
            return;
        }
        let norDir = this.dir.normalize();
        this.targetN.x += norDir.x * this.speed * dt;
        this.targetN.y += norDir.y * this.speed * dt; 
    }
});

接下来该做什么

可能看教程学Cocos3.x引擎了。