07-渲染流程-3-Sprite渲染-判断是否裁剪分析

原创 2015年11月20日 12:06:00

我们集中精力来看Sprite的draw()

Image

_insideBounds = transformUpdated ? renderer->checkVisibility(transform, _contentSize) : _insideBounds;

正如注释所述,该步骤是判断该Sprite是否在显示的Bounds中,如果transformUpdated没有发生改变,则不需要计算,之前是显示与否,决定了此次的显示与否。

而如果transformUpdated改变了,比如

1.第一次刷新的时候

2.对该Sprite对象setPosition,或者其父对象某一个位置发生了改变,则需要重新计算。

在这里我们假定要计算需要裁减,那么我们看看是如何计算该Sprite是否需要渲染呢?

Sprite渲染裁减计算

renderer->checkVisibility(transform, _contentSize)

transform 是父层调用传入的内容,在HelloWorld中,是由Sprite自己传入的,因为scene传入的是

Mat4::IDENTITY

而layer没有改变其位置 缩放 旋转 错切,所以在此处传入的值依然是

Mat4::IDENTITY

而Sprite如果形态没有发生改变的话,传入的应该也是identity

_contentSize 代表了该Sprite的大小 (width,height)

1.首先我们要搞清楚, _contentSize 是从哪里来的

_contentSize 在Node中声明,并初始化为 Size::ZERO

在Node中定义了赋值的方法:

void Node::setContentSize(const Size & size)
{
if ( ! size.equals(_contentSize))
    {
_contentSize = size;
_anchorPointInPoints = Vec2(_contentSize.width * _anchorPoint.x, _contentSize.height * _anchorPoint.y );
_transformUpdated = _transformDirty = _inverseDirty = true;
    }

}

浏览代码可以看到_contentSize的由来

     A Sprite::create( file name)

     B -> Sprite::initWithFile( file name )

          获取了 Texture2D 对象,从而获取图像的 Rect

     C -> Sprite::initWithTexture(texture,rect,not rotate)

     D -> 最终来到了 Sprite::setTexureRect 中

Image(1)

于是我们知道了

renderer->checkVisibility(transform, _contentSize)

中的_contentSize 是图片的大小(在HelloWorld例子中)

2.对参数了解之后,我们该到checkVisibility 来看看了

Image(2)

这段代码主要是判断一个Sprite只要有部分在屏幕范围内就是true,否则false

判断Sprite矩形和屏幕矩形之间的关系,可以借鉴圆和圆的关系判断

Image(3)

如图所示,黑色边框代表的是屏幕,红色代表的是一个Sprite

在水平上判断过程:

1.屏幕中心点A所在世界坐标为(sw*0.5,sh*0.5)

2.sprite的中心点B所在世界坐标为  sprite的变换矩阵*(w*0.5,h*0.5)

3.计算两个矩形中心点之间的距离 AB

4.Sprite在世界坐标中的宽度和高度。BW BH

5.AB - BW/2 如果 <= SW/2 则说明水平方向上和屏幕的一条侧边有交集

6.但是要保证和屏幕有交集,则需要同时保证垂直方向上Sprite和屏幕的一条侧边有交集

否则如下图所示,也是不在屏幕内的

Image(4)

我们再回头看看代码:

1.获取了两个矩形中心点之间的距离

Image(5)

v4world的x y 的绝对值,代表了水平和垂直方向之间的距离

2.获得sprite在世界坐标系下的长度和宽度

Image(6)

这里猜测可能是为了处于效率的问题,直接将坐标和矩阵中对应的坐标进行了转换。矩阵中的 [0] [4] 和 [1] [5] 代表了在X轴和Y轴上的旋转 缩放 错切后的对应项,所以这里直接进行了转换

3.AB - BW/2 如果 <= SW/2 则说明水平方向上和屏幕的一条侧边有交集

但是要保证和屏幕有交集,则需要同时保证垂直方向上Sprite和屏幕的一条侧边有交集

Image(7)

在计算Sprite在世界矩阵中的长和宽的时候,我修改了如下的代码,可能看起来会更清晰些吧

Image(8)

在这里需要说明的是,如果Sprite本身,以及父对象没有放大、缩小、错切,那么其transform是

{ 1 0 0 0

  0 1 0 0

  0 0 1 0

  0 0 0 1}

则 wshw = hSizeX     wshh = hSizeY

但是如果父对象进行了刚体变换,则需要用Sprite本身图片大小,通过变换矩阵来换算出真实的大小

对于Sprite来说,通过transform变换成了变形后的样子,所以其中心点(hSizeX,hSizeY)的位置,通过transform就可以找到变形后的真实位置

所以修改的代码中可以不通过左下角和右上角的变换来计算大小,直接通过中心点(hSizeX,hSizeY)来计算变形中的坐标大小即可获取content大小的一半,也就是wshw wshh的坐标值 world sprite half width/height

渲染流程

(注:【D3D11游戏编程】学习笔记系列由CSDN作者BonChoix所写,转载请注明出处:http://blog.csdn.net/BonChoix,谢谢~)          3D图形学研究的基本...
  • luyuncsd123
  • luyuncsd123
  • 2013年09月04日 22:29
  • 9530

07-渲染流程-4-Sprite渲染-渲染命令分析

如果在可视范围内,则需要执行render的addCommand命令 首先我们需要搞清楚两个对象   _quadCommand 和 renderer QuadCommand Sprite使用的...
  • studyforgis
  • studyforgis
  • 2015年11月24日 08:05
  • 393

CryEnginev渲染流程

CryEngine 渲染流程 渲染涉及的线程: MainThread、RenderThread、CullingThread和JobThread。 MainThread: 用于控制渲染流程 Rend...
  • kasteluo
  • kasteluo
  • 2017年07月10日 16:58
  • 407

07-渲染流程-5-Sprite渲染-QuadCommand

我们详细看看init中的几个参数: 1. _globalZOrder 在这里是0,我们没有设置需要全局进行渲染。 2. _texture->getName() 这个参数是纹理缓存。从何而来呢?...
  • studyforgis
  • studyforgis
  • 2015年11月28日 09:41
  • 297

07-渲染流程-2-HelloWorld分析

"HelloWorld.png”    —> 到屏幕的显示经历了哪些过程? 抛开系统启动的过程,那么所有的渲染方式在Director::drawScene中 在Director::mainLoop...
  • studyforgis
  • studyforgis
  • 2015年11月18日 09:58
  • 177

unity shader:渲染流程

渲染流水线:是cpu和gpu配合渲染一帧的过程,主要分为应用阶段,几何阶段以及光栅化阶段。应用阶段流程:由cpu进行控制,主要流程如下 1.准备哪些对象被渲染,哪些被剔除,然后将要渲染的对象从硬盘加...
  • zjz520yy
  • zjz520yy
  • 2017年08月25日 21:53
  • 559

虚幻4 D3D渲染过程的笔记

最近心情很难过。身体也不好。周六请假休息了一下,还是觉得写点东西比较好。哎。 这是虚幻的D3D渲染一个方块的一帧的调用过程的记录。 渲染的调用起始于  GuardedRun.  这也是虚幻的...
  • lqpgfz
  • lqpgfz
  • 2015年11月14日 15:44
  • 1257

【图形学】渲染管道 渲染管线 渲染流程 渲染流水线

》渲染管线是指在显示器上为了显示出图像而经过的一系列必要操作; 》GPU的渲染管线就是告诉GPU一堆数据,最后得出来一副二维图像,而这些数据就包括了”视点、三维物体、光源、照明模型、纹理”等元素。 ...
  • chenxuezhi123
  • chenxuezhi123
  • 2015年04月29日 19:38
  • 4295

(一)OpenGL渲染的基本流程

总结自教程:http://www.learnopengl.com/#!Getting-started/Hello-TriangleOpenGL中的坐标是带有深度信息的三维坐标,把这些三维坐标转换成可以...
  • huangcanjun187
  • huangcanjun187
  • 2016年09月06日 18:09
  • 2886

unity 渲染流程

Device的使用者要准备好顶点数据,也就是一个顶点的数组A。传入device的渲染管线  坐标变换 objectvector 本地坐标 模型坐标 x viewmatrix 世界坐标 view...
  • shisnake
  • shisnake
  • 2016年12月10日 19:39
  • 2285
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:07-渲染流程-3-Sprite渲染-判断是否裁剪分析
举报原因:
原因补充:

(最多只允许输入30个字)