UI坐标系与OpenGL坐标系

UI坐标就是Android和IOS等应用开发时候使用的二维坐标系,原点在左上角

OpenGL坐标是三维坐标,由于Cocos2d-x Lua 底层采用OpenGL渲染,因此默认坐标就是OpenGL坐标,只不过采用了两维(XY轴),不考虑Z轴,OpenGL的坐标原点在左下角

获得UI坐标
cc.p touchLocation = touch:getLocationInView()
UI坐标转换为OpenGL坐标
cc.p touchLocation2 = cc.Director:getInstance:convertToGL(touchLocation)

这样就转换为Cocos2d -x Lua的默认坐标了

世界坐标系和模型坐标系

什么是世界坐标系和模型坐标系?

类似于你向别人问路,有的人告诉你向东1000M,然后向北走500M,这就是世界坐标

而有的人告诉你向左走1000M,然后向右走500M 这是模型坐标,以你自己为参照物

有时候我们需要将他们互换,可以通过Node对象函数实现

convertToNodeSpace ( worldPoint )  --将世界坐标转化为模型坐标
convertToNodeSpaceAR ( worldPoint ) --将世界坐标转化为模型坐标。AR表示相对于锚点

convertTouchToNodeSpace ( touch )  --将世界坐标系中的触摸点转化为模型坐标
convertTouchToodeSpace ( touch ) --将世界坐标系中的触摸点转化为模型坐标。AR表示相对于锚点

concertToWorldSpace ( nodePoint ) --将模型坐标转化为世界坐标
convertToWorldSpaceAR ( nodePonit ) --将模型坐标转化为世界坐标。AR表示相对于锚点

世界坐标转换为模型坐标

 --[[
 	--创建层 添加背景颜色为白色
 	local layer = cc.Layer:create()
 	local bg = cc.LayerColor:create(cc.c3b(255,255,255))
 	layer:addChild(bg)
 	--创建一个Item
 	local closeItem = cc.MenuItemImage:create(
 		"CloseNormal.png","CloseSelected.png")
 	closeItem:setPosition(cc.p(size.width - closeItem:getContentSize().width/2,
 								closeItem:getContentSize().height/2))
 	local  menu = cc.Menu:create(closeItem)
 		menu:setPosition(cc.p(0,0))
 		layer:addChild(menu)
 	--创建一个Node
 	local node1 = cc.Sprite:create("node1.png")
 		node1:setPosition(cc.p(400,500))
 		node1:setAnchorPoint(cc.p(1.0,1.0))
 	layer:addChild(node1,0)
 	--创建一个Node2
 	local node2 = cc.Sprite:create("node2.png")
 		node2:setPosition(cc.p(200,300))
 		node2:setAnchorPoint(cc.p(0.5,0.5))
 	layer:addChild(node2,0)
 	--获取Node2 世界坐标系转换为相对于node1的模型坐标
 	local posX,posY = node2:getPosition()
 	local point1 = node1:convertToNodeSpace(cc.p(posX,posY))
 	local point3 = node1:convertToNodeSpaceAR(cc.p(posX,posY))
 	cclog("Node2 x:"..point1.x.." y:"..point1.y)
 	cclog("Node2AR x:"..point3.x.." y:"..point3.y)
 	return layer
 	--
 	--Node 2   x: 100 y:-100  不管node1锚点,则以node1的左下角为原点,相对于node2的锚点
 	--AR        X:-200  y:-200  以node1的锚点(1.0,1.0)为原点,相对于node2的锚点
 	--]]

模型坐标转化为世界坐标

 	local layer = cc.Layer:create()
 	--层背景
 	local bg = cc.LayerColor:create(cc.c3b(255,255,255))
 	layer:addChild(bg)
 	--Item
 	local loseItem = cc.MenuItemImage:create("CloseNormal.png","CloseSelected.png")
 	loseItem:setPosition(cc.p(size.width - loseItem:getContentSize().width/2,
 						loseItem:getContentSize().height/2))
 	local men = cc.Menu:create(loseItem)
 	men:setPosition(cc.p(0,0))
 	layer:addChild(men)

 	--创建node1 添加到layer
 	local node1 = cc.Sprite:create("node1.png")
 	node1:setPosition(cc.p(400,500))
 	layer:addChild(node1,0)

 	--创建node2 添加到node1
 	local node2 = cc.Sprite:create("node2.png")
 	node2:setPosition(cc.p(0,0))
 	node2:setAnchorPoint(cc.p(0,0))
 	node1:addChild(node2,0)  --添加到node1 这样node2:setPosition(cc.p(0.0,0.0))变成了相对于node1					   --的相对坐标了 

 	local posX,posY = node2:getPosition()--A点的位置
 	cclog(""..posX.."--"..posY)
 	local point1 = node1:convertToWorldSpace(cc.p(posX,posY))
 		--将Node2的坐标转化为世界坐标
 	local point3 = node1:convertToWorldSpaceAR(cc.p(posX,posY))
 		--将Node2的坐标转化为世界坐标,相对于锚点的位置
 	cclog("point X:" .. point1.x .. "  Y:" .. point1.y)
 	cclog("pointAR X:" .. point3.x .. "  Y:" .. point3.y)

 	return layer
 	--
 	--得到的结果是 point: x = 250 y = 450	就是node1的原点与坐标轴原点的相对值
 	--得到的结果是 pointAR: x = 400 y = 500   就是node1的锚点与坐标轴原点的相对值
 	--

模型坐标转化为世界坐标有点跟书上介绍的不同,是我自己理解的,有误解的话欢迎指出

Cocos2d-x 核心概念 - 坐标系(UI.OpenGL.世界坐标系.模型坐标系)的更多相关文章

  1. Netty核心概念(8)之Netty线程模型

    1.前言 第7节初步学习了一下Java原本的线程池是如何工作的,以及Future的为什么能够达到其效果,这些知识对于理解本章有很大的帮助,不了解的可以先看上一节. Netty为什么会高效?回答就是良好 ...

  2. OpenGL中各种坐标系的理解[转]

    OPENGL坐标系可分为:世界坐标系和当前绘图坐标系. 世界坐标系:在OpenGL中,世界坐标系是以屏幕中心为原点(0, 0, 0),且是始终不变的.你面对 屏幕,你的右边是x正轴,上面是y正轴,屏幕 ...

  3. cocos2d-x 屏幕坐标系和OPenGL坐标系转换

    转自:http://home.cnblogs.com/group/topic/57609.html cocos2d坐标系(OPenGL坐标系):以左下角为原点,x向右,y向上 屏幕坐标系(androi ...

  4. Redux 核心概念

    http://gaearon.github.io/redux/index.html ,文档在 http://rackt.github.io/redux/index.html .本文不是官方文档的翻译. ...

  5. TensorFlow.js之安装与核心概念

    TensorFlow.js是通过WebGL加速.基于浏览器的机器学习js框架.通过tensorflow.js,我们可以在浏览器中开发机器学习.运行现有的模型或者重新训练现有的模型. 一.安装     ...

  6. (转)Maven学习总结(四)——Maven核心概念

    孤傲苍狼只为成功找方法,不为失败找借口! Maven学习总结(四)——Maven核心概念 一.Maven坐标 1.1.什么是坐标? 在平面几何中坐标(x,y)可以标识平面中唯一的一点. 1.2.Mav ...

  7. OpenGL中各种坐标系的理解

    转载:https://blog.csdn.net/meegomeego/article/details/8686816 OPENGL坐标系可分为:世界坐标系和当前绘图坐标系. 世界坐标系以屏幕中心为原 ...

  8. Ext JS 6学习文档–第2章–核心概念

    核心概念 在下一章我们会构建一个示例项目,而在这之前,你需要学习一些在 Ext JS 中的核心概念,这有助于你更容易理解示例项目.这一章我们将学习以下知识点: 类系统,创建和扩展类 事件 Ext JS ...

  9. Storm 学习之路(二)—— Storm核心概念详解

    一.Storm核心概念 1.1 Topologies(拓扑) 一个完整的Storm流处理程序被称为Storm topology(拓扑).它是一个是由Spouts 和Bolts通过Stream连接起来的 ...

随机推荐

  1. Java网络编程之流——readline()方法的bug

    readline()方法有一个隐含的bug,它不一定会把一个回车看作行的结束.相反,readline()只识别换行或回车/换行对.当在流中检测到回车时,readline()会在继续之前等待,查看下一个 ...

  2. 摘抄的 JAVA JDOM 操作XML文件

    JDOM修炼篇 用过XERCES的程序员都会感到,有时候用一句话就可以说清楚的事,当用XERCES的API来实现时,要三四行程序.   回页首 获得并安装JDOM 在 http://www.jdom. ...

  3. Displaying Data in a Chart with ASP.NET Web Pages (Razor)

    This article explains how to use a chart to display data in an ASP.NET Web Pages (Razor) website by ...

  4. 突袭HTML5之SVG 2D入门1 - SVG综述////////////////zzzzzzzz

    以二次贝塞尔曲线的公式为例: js函数: //p0.p1.p2三个点,其中p0为起点,p2为终点,p1为控制点 //它们的坐标用数组表示[x,y] //t的范围是0-1 function qBerzi ...

  5. android 案例二 登录界面

    效果图: 运行图:   总结: 编写这个简单的用户登录界面,主要用到了以下的知识:   java基础中的IO流的操作 用以读取.显示用户的信息 Android布局 线性布局和相对布局 数据的存储选在包 ...

  6. .net post的参数如果出现乱码如何解决!

    可以在webConfig里面添加 <system.web> <globalization requestEncoding="gb2312" responseEnc ...

  7. MAC下彻底解决mysql无法插入和显示中文

    一.场景呈现 Mac 下Eclipse+mysql开发j2ee的时候,在页面像数据库中插入中文数据的时候,数据库会报错.而且即使插入成功,在控制台或者其他可视化数据库操作软件看数据发现都是??,错误的 ...

  8. Evolution项目(1)

    Evolution项目是基于NFine修改的项目 主要改动为: 支持了.net core 1.0 支持了 EF core 1.0 支持数据库自动创建及Demo数据自动灌入 修改了授权方式 新增加了一个 ...

  9. Ubuntu+Apache2+Mono+MVC3

    1.安装ssh(上传文件用,也可以用FTP) sudo apt-get install openssh-server 2.安装Apache2 apahe2:sudo apt-get install a ...

  10. [SQL入门级] 第一天 SQL初步

    SQL语句分为以下三种类型: DML:Data Manipulation Language 数据操纵语言 INSERT UPDATE DELETE SELECT DDL:Data Definition ...