cocos creator 基础一文通(三) ---坐标空间及空间几何体

266 阅读2分钟

坐标空间

本文主要记录了cocos creator的坐标空间体系,由于cocos引擎基于OPenGL,所以使用的是笛卡尔坐标系(左下为原点),而手机等设备,使用的是屏幕坐标系(左上为原点),所以存在转换,不过,所幸我们先暂时不用关心这些. 此外,由于cocos creator组件化开发的模式,与cocos2dx不同,推荐用锚点定位组件.进行空间计算.

一. 二维向量 Vec2

便捷创建二维对象的方法:cc.V2(x,y) //cc.p()已被弃用

  1. 向量相减 sub()
① 减向量.sub(被减向量) //返回Vec2对象
        var start_pos=cc.v2(200,200);
        var end_pos=cc.v2(300,300);
        var result_pos=end_pos.sub(start_pos);
        console.log(result_pos);
② 减向量.sub(被减向量,接收结果Vec2) //将结果给接收结果向量,同时返回Vec2对象
        var start_pos=cc.v2(200,200);
        var end_pos=cc.v2(300,300);
        var result_pos=new cc.Vec2();
        var what=end_pos.sub(start_pos,result_pos);
        console.log(what,result_pos);
2. 向量加法 //和减法一样
3. 向量自加 自减
4. 计算向量长度 mag()

二. 矩形 Rect

便捷创建方法 cc.rect(x,y,长,宽)

1.点是否在矩形内. contains() //返回布尔值
        var rec1=new cc.Rect(0,0 ,100,100);
        var rec2=cc.rect(0,0,200,200);
        var pos1=cc.v2(50,50);
        console.log(rec1.contains(pos1));
2.两个矩形是否相交 intersects();
3.两个矩形相交的矩形 intersection();

三. creator的坐标系

四.坐标系转换

1 节点坐标转世界坐标(以左下角为原点)(不常用) //返回Vec2类值
2 节点坐标转世界坐标(以锚点为原点) //返回Vec2类值
3 世界坐标转节点坐标(以左下角为原点)(不常用) //返回Vec2类值
4 世界坐标转节点坐标(以锚点为原点) //返回Vec2类值
例子
        var pos1=this.node.convertToWorldSpace(cc.v2(0,0)); //以节点左下角为原点计算;
        var pos2=this.node.convertToWorldSpaceAR(cc.v2(0,0));//以锚点为原点计算;
        console.log(pos1,pos2);
        //世界坐标转节点坐标
        var pos_temp=cc.v2(50,50);
        var pos3=this.node.convertToNodeSpace(pos_temp);
        var pos4=this.node.convertToNodeSpace(pos_temp);
        console.log(pos3,pos4);
例子2: 将子元素定位于世界坐标系的某个位置 如(900,500)
this.node.setPosition(this.node.parent.convertToNodeSpaceAR(cc.v2(900,500)));
this.node.position=this.node.parent.convertToNodeSpaceAR(cc.v2(900,500));
例子3:获取节点在世界坐标中的位置
this.node.convertToWorldSpaceAR(cc.v2(0,0));

五.节点包围盒

1.包围盒
包围盒是一种求解离散点集最优包围空间的算法,基本思想是用体积稍大且特性简单的几何体(称为包围盒)来近似地代替复杂的几何对象。
主要是用来做碰撞检测
2.获取包围盒