ccc.raphael icon indicating copy to clipboard operation
ccc.raphael copied to clipboard

[bug] getWorldTransform 中 cc.affineTransformConcat的调用参数需要反一下

Open happyfire opened this issue 6 years ago • 0 comments

发现这个bug是因为我用到了group的层次,当旋转时子group没有绕自己的中心旋转,而是绕父group的中心旋转,一开始我就怀疑是矩阵串联反了,当时改了下updateTransform里面居然没有效果(后来发现我的用法确实走不到这儿),后来跟了下代码,并把每步的矩阵算出来看,发现走到:

getWorldTransform: function () {
        if (this.parent) {
            //return cc.affineTransformConcat(this.parent.getWorldTransform(), this.getTransform());
            return cc.affineTransformConcat(this.getTransform(), this.parent.getWorldTransform());
        }

        return this.getTransform();
    },

这儿算出来的矩阵是错误的。然后把cc.affineTransformConcat的参数顺序改一下就对了。那么为什么呢?因为cocos creator不走寻常路,而且文档非常水,看一下他的实现和文档:

/**
 * !#en
 * Concatenate a transform matrix to another and return the result:<br/>
 * t' = t1 * t2
 * !#zh 拼接两个矩阵,并返回结果:<br/>
 * t' = t1 * t2
 *
 * @method affineTransformConcat
 * @param {AffineTransform} t1 - The first transform object.
 * @param {AffineTransform} t2 - The transform object to concatenate.
 * @return {AffineTransform} The result of concatenation.
 */
cc.affineTransformConcat = function (t1, t2) {
    return {a: t1.a * t2.a + t1.b * t2.c,                          //a
        b: t1.a * t2.b + t1.b * t2.d,                               //b
        c: t1.c * t2.a + t1.d * t2.c,                               //c
        d: t1.c * t2.b + t1.d * t2.d,                               //d
        tx: t1.tx * t2.a + t1.ty * t2.c + t2.tx,                    //tx
        ty: t1.tx * t2.b + t1.ty * t2.d + t2.ty};				    //ty
};

文档里说返回的是 t1 * t2,如果真是这样,没有问题的,我们的向量在右边。但实际上,他里面算的是 t2 * t1,自己算一下就知道。这样我们调用的结果就是先乘父级的世界矩阵再乘自己的本地矩阵了。有可能cocos是用的行向量左乘,所以他需要 v x t2 x t1。但是他的文档里面我是看不出来到底哪个矩阵先起作用,谁没事会自己算一遍矩阵去弄明白呢。 总之,建议改一下吧,毕竟现在这么是错的,估计这个库没几个人用,作者也不维护了,这个issuse给有缘人少走弯路吧

happyfire avatar May 10 '18 06:05 happyfire