cc.Node—坐标系统
cc.Vec2
1: cc.Vec2 二维向量坐标, 表结构{x: 120, y: 120}; cc.v2(x, y) 创建一个二维向量 cc.p() 创建一个二外向量;
2: cc.pSub: 向量相减;
3: cc.pAdd: 向量相加;
4: cc.pLength: 向量长度;
cc.Size/cc.Rect
1: cc.Size: 包含宽度和高度信息的对象 {width: 100, height: 100};
2: new cc.Size(w, h), cc.size(w, h)创建一个 大小对象;
3: cc.Rect: 矩形对象 new cc.Rect(x, y, w, h); cc.rect(x, y, w, h); {x, y, width, height};
4: contains(Point): 点是否在矩形内;
5: intersects : 两个矩形是否相交;
creator坐标系
1: 世界(屏幕)坐标系;
2: 相对(节点)坐标系,两种相对节点原点的方式(1) 左下角为原点, (2) 锚点为原点(AR);
3: 节点坐标和屏幕坐标的相互转换; 我们到底使用哪个?通常情况下带AR;
4: 获取在父亲节点坐标系下(AR为原点)的节点包围盒;
5: 获取在世界坐标系下的节点包围盒;
6: 触摸事件对象世界坐标与节点坐标的转换;
// 获取节点的包围盒, 相对于父亲节点坐标系下的包围盒
var box = this.node.getBoundingBox();
console.log('box:',box); // 世界坐标系下的包围盒
var w_box = this.node.getBoundingBoxToWorld();
console.log(w_box); this.node.on(cc.Node.EventType.TOUCH_START, function(t) {
var w_pos = t.getLocation();
var pos = this.node.convertToNodeSpaceAR(w_pos);
console.log(pos); pos = this.node.convertTouchToNodeSpaceAR(t);
console.log("====", pos);
}, this); // 我要把当前这个sub移动到世界坐标为 900, 600;
// 把世界坐标转到相对于它的父亲节点的坐标
var node_pos = this.node.parent.convertToNodeSpaceAR(cc.p(500, 600));
this.node.setPosition(node_pos); // 相对于this.node.parent这个为参照物,AR为原点的坐标系
// 获取当前节点的世界坐标;
this.node.convertToWorldSpaceAR(cc.p(0, 0));
常用坐标函数
var pos = new cc.Vec2(100, 100);
console.log('Vec2 x:%f,y:%f', pos.x, pos.y); pos = cc.v2(200.45, 200.94);
console.log('v2 x:%f,y:%f', pos.x, pos.y); pos = cc.p(300, 300);
console.log('p x:%f,y:%f', pos.x, pos.y); var src = cc.p(50, 11);
var dst = cc.p(100, 100);
var dir = cc.pSub(dst, src); var len = cc.pLength(dir);
console.log('dir.pLength:%f,dir.x:%f,dir.y:%f', len, dir.x,dir.y); var s = new cc.Size(100, 100);
console.log('Size x:%f,y:%f,w:%f,h:%f', s.x, s.y, s.width, s.height); s = cc.size(200, 200);
console.log('Size x:%f,y:%f,w:%f,h:%f', s.x, s.y, s.width, s.height);
var r = new cc.Rect(0, 0, 100,100);
console.log(r); r = cc.rect(0, 0, 200, 200);
console.log(r);
var ret = r.contains(cc.p(300, 300));
console.log(ret);
var rhs = cc.rect(100, 100, 100, 100);
ret = r.intersects(rhs);
console.log(ret); // 节点坐标转到屏幕坐标 cc.p(0, 0)
var pos = this.node.convertToWorldSpace(cc.p(0, 0)); // 左下角为原点的 cc.p(430, 270)
console.log('x:%f,y:%f',pos.x, pos.y);
pos = this.node.convertToWorldSpaceAR(cc.p(0, 0)); // 锚点为原点 cc.p(480, 320)
console.log('x:%f,y:%f', pos.x, pos.y);
// end var pos = cc.p(480, 320); var node_pos = this.node.convertToNodeSpace(pos);
console.log('x:%f,y:%f', node_pos.x, node_pos.y); // cc.p(50, 50) node_pos = this.node.convertToNodeSpaceAR(pos);
console.log('x:%f,y:%f', node_pos.x, node_pos.y);// cc.p(0, 0)
cc.Node—坐标系统的更多相关文章
- cc.Node—场景树
对于cc.Node我分了四个模块学习: 1.场景树,2.事件响应,3.坐标系统,4.Action的使用:在此记录经验分享给大家. 场景树 1: creator是由一个一个的游戏场景组成,通过代码逻辑来 ...
- cc.Node 的坐标空间与ACTION的学习
1.创建二维的向量坐标 //创建向量坐标方法一 let new_pos1 = new cc.Vec2(100, 100); //创建向量坐标方法二 let new_pos2 = cc.v2(200, ...
- Cocos Creator cc.Node.点击事件
触摸事件 1.触摸事件的类型:START触摸启动,MOVED移动,ENDED弹起来,CANCEL取消; ENDED和CANCEL区别是ENDED物体内弹起来,CANCEL是在物体外范围弹起. 2.监听 ...
- <7>Cocos Creator 节点 cc.Node
1.简介 节点(cc.Node)是渲染的必要组成部分.所有需要在游戏场景中显示的内容都必须是节点或者依附于节点之上.节点负责控制显示内容的位置.大小.旋转.缩放.颜色等信息. 2.节点属性 1: na ...
- cc.Node—事件响应
触摸事件1: 触摸事件类型: START, MOVED, ENDED(物体内), CANCEL(物体外);2: 监听触摸事件: node.on(类型, callback, target(回掉函数的th ...
- cc.Node—Action
1: Action类是动作命令,我们创建Action,然后节点运行action就能够执行Action的动作; 2: Action分为两类: (1) 瞬时就完成的ActionInstant, (2) 要 ...
- Cocos2d-JS坐标系统
标准屏幕坐标系 如果接触过iOS,Android,Windows Phone等系统的应用开发,或使用DOM,CSS开发过Web网页,开发者会非常熟悉所谓的标准屏幕坐标系:左上角为原点,向右为X轴正方向 ...
- Cocos2d-x 核心概念 - Node中的重要操作
作为跟类,Node有很多的重要的函数 local childNode = cc.Node:create() --创建节点 node:addChildNode(childNode,0,123) --创建 ...
- cc.Sprite
Classcc.Sprite Defined in: CCSprite.js Extends cc.NodeRGBA Class Summary Constructor Attributes Cons ...
随机推荐
- zoj 3865
Superbot Time Limit: 2 Seconds Memory Limit: 65536 KB Superbot is an interesting game which you ...
- IDEA Terminal
如果IDEA在Terminal中无法使用环境变量,提示没有此命令的话,请查看在cmd中是否可以正常使用,然后,请右击IDEA以管理员方式进行运行,Terminal就可以正常使用了
- Codeforces Round #386 (Div. 2)G. New Roads [构造][树]
题目链接:G. New Roads 题意:给出n个结点,t层深度,每层有a[i]个结点,总共有k个叶子结点,构造一棵树. 分析: 考虑一颗树,如果满足每层深度上有a[i]结点,最多能有多少叶子结点 那 ...
- bzoj 4849: [Neerc2016]Mole Tunnels【模拟费用流】
参考:https://www.cnblogs.com/CQzhangyu/p/6952371.html 费用流很简单,考虑但是会T. 考虑费用流的本质,流一次需要要找一个能够从当前点到达的距离最小的点 ...
- poj 2398 Toy Storage【二分+叉积】
二分点所在区域,叉积判断左右 #include<iostream> #include<cstdio> #include<cstring> #include<a ...
- bzoj 1502 月下柠檬树【Simpson积分】
投影到地面之后,会发现圆形在平行光下面积和形状是不会变的,也就是所要求的图形是若干个圆和把相邻两个圆连起来的公切线所组成的. 公切线和圆间距瞎求一下就行,注意要去掉被完全覆盖的圆 然后simpson即 ...
- 51nod 1119 机器人走方格 V2 【组合数学】
挺水的但是我好久没写组合数了- 用这样一个思想,在1~m列中,考虑每一列上升几格,相当于把n-1个苹果放进m个篮子里,可以为空,问有几种方案. 这个就是一个组合数学经典问题了,考虑n个苹果放进m个篮子 ...
- python面向对象的3个特点
封装 封装是从业务逻辑中抽象对象时,要赋予对象相关数据与操作,将一些数据和操作打包在一起的过程.封装是使用对象的主要魅力之一,它提供了一个简单方法来创建复杂方案,解决了世界是如何工作的这一问题,我们自 ...
- C++中的数学函数汇总
math.h 数学函数库,一些数学计算的公式的具体实现是放在math.h里,具体有: 1 三角函数 double sin (double); double cos (double); double t ...
- VMware Workstation安装CentOS 7和开发环境
VMware Workstation新建虚拟机 此处使用的是VMware Workstation 10,其安装过程即是常规Windos系统下软件安装方式,略过. 安装完成双击图标: 打开虚拟机主界面: ...