cocos2dx 实现gallery （二）

我们先把前面的模型简化，我们最后要看到的是这样:

这个图上，构成这个效果的主要因素有3个。

一、x方向的位置，就是图上绿点标记的地方，锚点0.5。（这里我不需要Y方向的变化，需要的也可以自己类推）

二、大小，有了大小的差别，就有了远近的差别

三、zorder，这个是决定遮挡关系，然后我们就会产生一种立体的错觉

（PS：其实图上，每个item的图片还用了投影。。。但是这是美工的事情）

我们再来看决定上面3个因素的东西（俯视图）：

按标准坐标系，x轴正方向为0度，x轴负方向为180度。

图上的x，决定的是x方向的位置，图上的Y，是距离我们的距离，距离越远，自然就应该越小。而且距离我们越远，也就应该越靠后，zorder越低。

然后就应该补习下透视相关的东西了。请参考这里，只需要知道视椎体就行了。然后我们看侧面图：

为了方便，直接取Y轴所在平面为视平面，所做连线与Y轴的焦点，就是实际显示大小。这里涉及3个变量。物体距视点的距离d，视点到视平面之间的距离d1，视平面到物体的距离dx。设物体高度为L，物体显示高度为L'。通过相似三角形，可以轻易的得出L'的长度，但是我们其实只需要scale就够了，所以：

scale = d1 / (d1+dx)

但是这个d1和dx又怎么去获取，根据视椎体，有如下：

斜着的那个，就是上面侧面图我们要求的那个。根据相似三角形，又可以轻易得出：

scale = d‘ / (d' + dx ')

这个d'和dx'，可以通过俯视图，就是上面一个圆圈圈，那个图算出来。要算这个，涉及3个变量还未知。一是角度，二是圆圈半径，3是上图的d'，也就是视点到视平面的距离。简单的说，这3个值只能自己试。。。。不过是有一定规律的

角度是根据想看多少自己来分布，实际能看到的部分，只有整个园的前半圆，一共180度，加入我想一共放5个，我就按45度分布就行了。

半径可以推测，比如我想看我全部的半圆，那么直径就是窗口的大小。

最后一个，主要是涉及一个缩放比例，通过公式可以看出，如果d'越大，那么最前面的item和最后面的item，大小差距就越大，反之差距就越小。

然后就开始写代码了。。。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!