Cocos2d-x源码阅读 UI树2

Cocos2d-x的UI是按照树形结构组织的。

大家学过数据结构的话 就知道 什么是树了。

树只有一个 根节点,根节点没有父节点,其他节点都有父节点和子节点,而叶子节点没有子节点,叶子节点就是指没有子节点的节点。

在这里父和子 都是相对的。

我们知道树结构的遍历有3种方式,说是遍历 就是把每个节点找个遍的意思,前序遍历,中序遍历,后序遍历。

所谓的前,中,后指的是根节点,先遍历根节点就是前,后遍历就是最后查找根节点,中序遍历就是中间遍历。

所以 前序遍历的话 就是 0,-1, -3,3,2,-4, 4

中序遍历的话就是-3,-1,3,0,-4, 2, 4

后序遍历就是-3, 3, -1 -4, 4, 2, 0

而我们cocos2dx采取的是中序遍历。

绘制UI的时候需要UI的坐标,颜色,弯曲等。

绘制UI需要的坐标是世界坐标。但我们提供的是本地坐标系,所以要转换成世界坐标系。要使用变换矩阵。提供给shader。

这里绘制使用的是visit函数。

void Node::visit()

{

auto renderer = Director::getInstance()->getRenderer();
//获得渲染器

Mat4 parentTransform = Director::getInstance()->getMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW); 
//获得世界坐标系的变换矩阵

visit(renderer, parentTransform, true);
//渲染

}

void Node::visit(Renderer* renderer, const Mat4 &parentTransform, uint32_t parentFlags)

{

// quick return if not visible. children won‘t be drawn.

if (!_visible)

{

return;

}

uint32_t flags = processParentFlags(parentTransform, parentFlags);
//这里把processParentFlags当做参数传入了函数,肯定要处理,看到红色参数,在这里处理了。

// IMPORTANT:

// To ease the migration to v3.0, we still support the Mat4 stack,

// but it is deprecated and your code should not rely on it

Director* director = Director::getInstance();

director->pushMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW);
//push

director->loadMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW, _modelViewTransform);

bool visibleByCamera = isVisitableByVisitingCamera();

int i = 0;

if(!_children.empty())

{

sortAllChildren();

// draw children zOrder < 0

for( ; i < _children.size(); i++ )

{

auto node = _children.at(i);

if ( node && node->_localZOrder < 0 )

node->visit(renderer, _modelViewTransform, flags); //递归

else

break;

}

// self draw

if (visibleByCamera)

this->draw(renderer, _modelViewTransform, flags);

for(auto it=_children.cbegin()+i; it != _children.cend(); ++it)

(*it)->visit(renderer, _modelViewTransform, flags);
//递归

}

else if (visibleByCamera)

{

this->draw(renderer, _modelViewTransform, flags);

}

director->popMatrix(MATRIX_STACK_TYPE::MATRIX_STACK_MODELVIEW);
//pop

// FIX ME: Why need to set _orderOfArrival to 0??

// Please refer to https://github.com/cocos2d/cocos2d-x/pull/6920

// reset for next frame

// _orderOfArrival = 0;

}

uint32_t Node::processParentFlags(const Mat4& parentTransform, uint32_t parentFlags)

{

if(_usingNormalizedPosition) {

CCASSERT(_parent, "setNormalizedPosition() doesn‘t work with orphan nodes");

if ((parentFlags & FLAGS_CONTENT_SIZE_DIRTY) || _normalizedPositionDirty) {

auto s = _parent->getContentSize();

_position.x = _normalizedPosition.x * s.width;

_position.y = _normalizedPosition.y * s.height;

_transformUpdated = _transformDirty = _inverseDirty = true;

_normalizedPositionDirty = false;

}

}

uint32_t flags = parentFlags;

flags |= (_transformUpdated ? FLAGS_TRANSFORM_DIRTY : 0);

flags |= (_contentSizeDirty ? FLAGS_CONTENT_SIZE_DIRTY : 0);

if(flags & FLAGS_DIRTY_MASK)

_modelViewTransform = this->transform(parentTransform);
//转换

_transformUpdated = false;

_contentSizeDirty = false;

return flags;

}

Mat4 Node::transform(const Mat4& parentTransform)

{

Mat4 ret = this->getNodeToParentTransform();

ret  = parentTransform * ret;

return ret;

}

这里没有涉及颜色和弯曲效果,只与位置有关。

时间: 02-07

Cocos2d-x源码阅读 UI树2的相关文章

Cocos2d-x源码阅读1 UI树(第一次系统而有成效的阅读源码的感悟)

之前我很少看源码,觉得枯燥又没有头绪.说实话现在看的也少,不过作为程序员要想成长,必须要突破自己的瓶颈吧. 也许我的天赋不在写代码这里,也许这是一个越走越难的路,也许这又是一个有金矿的浅坑,坚持下去就会挖到金矿. 然而没有那么多可以选择叻,试着去强大吧,即使自己不擅长,即使落后很多,即使,即使,即使,即使,.... http://cn.cocos2d-x.org/tutorial/show?id=2157 推荐大家去这里看这个视频,自己看源码可能没有头绪,跟着王老师的视频效果还是很好的. 这里是

淘宝数据库OceanBase SQL编译器部分 源码阅读--生成逻辑计划

body, td { font-family: tahoma; font-size: 10pt; } 淘宝数据库OceanBase SQL编译器部分 源码阅读--生成逻辑计划 SQL编译解析三部曲分为:构建语法树,生成逻辑计划,指定物理执行计划.第一步骤,在我的上一篇博客淘宝数据库OceanBase SQL编译器部分 源码阅读--解析SQL语法树里做了介绍,这篇博客主要研究第二步,生成逻辑计划. 一. 什么是逻辑计划?我们已经知道,语法树就是一个树状的结构组织,每个节点代表一种类型的语法含义.如

JDK部分源码阅读与理解

本文为博主原创,允许转载,但请声明原文地址:http://www.coselding.cn/article/2016/05/31/JDK部分源码阅读与理解/ 不喜欢重复造轮子,不喜欢贴各种东西.JDK代码什么的,让整篇文章很乱...JDK源码谁都有,没什么好贴的...如果你没看过JDK源码,建议打开Eclipse边看源码边看这篇文章,看过的可以把这篇文章当成是知识点备忘录... JDK容器类中有大量的空指针.数组越界.状态异常等异常处理,这些不是重点,我们关注的应该是它的一些底层的具体实现,这篇

淘宝数据库OceanBase SQL编译器部分 源码阅读--生成物理查询计划

SQL编译解析三部曲分为:构建语法树,制定逻辑计划,生成物理执行计划.前两个步骤请参见我的博客<<淘宝数据库OceanBase SQL编译器部分 源码阅读--解析SQL语法树>>和<<淘宝数据库OceanBase SQL编译器部分 源码阅读--生成逻辑计划>>.这篇博客主要研究第三步,生成物理查询计划. 一. 什么是物理查询计划 与之前的阅读方法一致,这篇博客的两个主要问题是what 和how.那么什么是物理查询计划?物理查询计划能够直接执行并返回数据结果数

【原】AFNetworking源码阅读(四)

[原]AFNetworking源码阅读(四) 本文转载请注明出处 —— polobymulberry-博客园 1. 前言 上一篇还遗留了很多问题,包括AFURLSessionManagerTaskDelegate类所实现的NSURLSession相关的代理方法,甚至连dataTask.uploadTask.downloadTask这几个基本概念也没说.这一篇就是为了集中消灭这些遗留问题. 2. AFURLSessionManagerTaskDelegate的代理方法 此处实现的仍然是NSURLS

cocos2d-x 3.1.1源码阅读过程的注释

cocos2d-x 3.1.1源码阅读过程的注释 印象笔记链接:http://app.yinxiang.com/l/AAU8F1mKiN9BIqFopReAU3ZbTcgGOULycQo/ Ref 每个类的基类是Ref   也就是2.0的CCObject 调用继承下来的下面的那个函数 class CC_DLL Ref { public: /** 引用计数+1 */ void retain(); { CCASSERT(_referenceCount > 0, "reference count

【原】SDWebImage源码阅读(一)

[原]SDWebImage源码阅读(一) 本文转载请注明出处 —— polobymulberry-博客园 1. 前言 一直没有系统地读过整套源码,就感觉像一直看零碎的知识点,没有系统读过一本专业经典书籍一样,会有点发虚,感觉知识体系不健全!废话少说,这次我决定好好阅读下SDWebImage的源码,我的阅读方式,是带着问题去阅读源码,然后强迫自己写博客. 2. SDWebImage是做什么的? 既然是要带着问题读,那么第一个问题就来了,SDWebImage是做什么的?SDWebImage是一个开源

spark.mllib源码阅读-分类算法4-DecisionTree

本篇博文主要围绕Spark上的决策树来讲解,我将分为2部分来阐述这一块的知识.第一部分会介绍一些决策树的基本概念.Spark下决策树的表示与存储.结点分类信息的存储.结点的特征选择与分类:第二部分通过一个Spark自带的示例来看看Spark的决策树的训练算法.另外,将本篇与上一篇博文"spark.mllib源码阅读bagging方法"的bagging子样本集抽样方法结合,也就理解了Spark下的决策森林树的实现过程. 第一部分: 决策树模型 分类决策树模型是一种描述对实例进行分类的树形

源码阅读系列:源码阅读方法

一.前提条件 1.纯熟扎实的语言基础 ??如果你学java,却对反射.泛型.注解一直半解,还是不要去读什么框架了,回去把java基础打扎实反而对你自身更有益. 2.UML能力 ??在软件工程中,UML在软件的不同生命周期阶段扮演着非常重要的角色,没有好的UML水平,面对大型的项目源码会束手无策. 3.对业务的理解 ??如果你要阅读的项目业务性比较强,事先对业务有一定的了解是必须的. 4.设计模式.重构的掌握 ??编程语言什么的没什么好说.着重提一个:设计模式由于Android源代码用到各种各样的