拼图游戏笔记2

拼图游戏中截止目前为止，所做的步骤有：

1，创建两个界面：

开始界面：一张背景图，两个按钮，一个关卡的提示文本框。

游戏界面：一个背景层容器，一个图片容器，一个返回按钮。

2，添加所有组件，并显示到舞台。

3，开始界面里需要实现的功能：

点击左右按钮加减关卡，其中形成一个数字的循环滚动效果。按钮左点击数字减小，当小于最低关卡时，设置文本框内容为最大关卡，按钮是右一回事。

点击确定按钮切进入游戏界面，需要一个场景切换的方法做回按钮点击事件的回调方法。

---------------------------------------游戏核心------------------------------------------------

1，首先就是从10长图片中随机获取一种图片作为背景，背景图片需要设置锚点，坐标，还有透明度

2，生成碎片，需要用到矩形的属性（锚点，坐标，大小），通过两个for循环可以生成指定数量的碎片。

3，碎片点击选中的原理，需要将鼠标点击的事件坐标（即图层上的坐标），转换成碎片的节点坐标，然后比较，如果在图片的矩形范围内，则判定点中。

4，拖拽功能的实现，将节点的坐标加上将鼠标移动时的偏移实现跟随鼠标移动功能。

5，吸附，当图片拖拽至正确正确位置一定的偏移范围内时判定游戏完成，并且图片不再移动

这是目前所以理解的大概，很明显比较模糊，还有很多细节没有涉及到，这一块需要花大力气。

今天还讲了一个汉诺塔的玩法及规律，单数找双数，小的优先动，以下是欢哥的代码（虽然目前还看不懂）：

<span style="background-color: rgb(255, 255, 255);">var HelloWorldLayer = cc.Layer.extend({
    _s: null,
    _t: null,
    _e: null,
    _n: null,
    _lockPos:null,
    _tempNum:null,
    ctor:function () {
        this._super();
        this._init();
    },
    _init:function(){
        this._s = [];
        this._t = [];
        this._e = [];
        this._n = 10;
        this._index = 0;
        this._lockPos = 1;
        for(var i=this._n; i>0; i--)  this._s.push(i);
        this._checkFirst();
    },
    /*
    *  开始检查
    * */
    _check: function(){
        var a = this._s[this._s.length-1];
        var b = this._t[this._t.length-1];
        var c = this._e[this._e.length-1];
        this._lockPos = this._getPos(a,b,c);
        this._changePos(a,b,c);
        cc.log("次数---", ++this._index);
        cc.log("a---", this._s.toString());
        cc.log("b---", this._t.toString());
        cc.log("c---", this._e.toString());
        if(this._e.length < this._n) this._check();
    },
    /*
    *  获取位置
    * */
    _getPos:function(a,b,c){
        if(this._lockPos == 1){
            if(b == undefined) return 3;
            else if(c == undefined) return 2;
            else return (b<c)?2:3;
        }
        else if(this._lockPos == 2){
            if(a == undefined) return 3;
            else if(c == undefined) return 1;
            else return (a<c)?1:3;
        }
        else if(this._lockPos == 3){
            if(a == undefined) return 2;
            else if(b == undefined) return 1;
            else return (a<b)?1:2;
        }
    },
    /*
    *  获取位置  1表示返回前面一个值  (b,a,c)
    * */
    _getV: function(x,y,z){
        if(x%2 == 0){
            if(y==undefined){
                if(z%2 != 0 && x < z) return 2;
                return 1;
            }else{
                if(y%2 != 0 && x < y) return 1;
                return 2;
            }
        }else{
            if(y==undefined){
                if(z%2 == 0 && x < z) return 2;
                return 1;
            }else{
                if(y%2 == 0 && x < y) return 1;
                return 2;
            }
        }
    },
    /*
    *
    * */
    _changePos:function(a,b,c){
        if(this._lockPos == 1){
            if(this._getV(a,b,c) == 1){
                this._t.push(this._s.pop());
                this._lockPos = 2;
            }
            else{
                this._e.push(this._s.pop());
                this._lockPos = 3;
            }
        }
        else if(this._lockPos == 2){
            if(this._getV(b,a,c) == 1){
                this._s.push(this._t.pop())
                this._lockPos = 1;
            }else{
                this._e.push(this._t.pop());
                this._lockPos = 3;
            }
        }
        else if(this._lockPos == 3){
            if(this._getV(c,a,b) == 1){
                this._s.push(this._e.pop())
                this._lockPos = 1;
            }else {
                this._t.push(this._e.pop());
                this._lockPos = 2;
            }
        }
    },
    /*
    *  第一次
    * */
    _checkFirst: function(){
        if(this._n%2 == 0) {
            this._t.push(this._s.pop());
            this._lockPos = 2;
        }
        else{
            this._e.push(this._s.pop());
            this._lockPos = 3;
        }
        this._check();
    }
});
var HelloWorldScene = cc.Scene.extend({
    onEnter:function () {
        this._super();
        var layer = new HelloWorldLayer();
        this.addChild(layer);
    }
});
</span>