前言
好久没写教程笔记了。 不知道大家有没有错过教程呢？
温馨提示：所有内容纯属个人研究。 如果你要上线项目2d游戏ui教程，请自行评估~哦
最近逛论坛音乐，看到一个朋友想要实现如下的透视效果。
预期结果
然后我就搜（捡）到了这个游戏的资料，都是2D的图片。
图片素材
我可以想到两种方法来实现这一点：
纯2D实现：对图片的每个顶点进行投影变换，计算每个顶点在2D屏幕中的坐标。
在3D中实现：调整相机参数，将图片放置在Quad（正方形）上，并布置3D场景。
综合考虑，用3D来实现还是比较方便的，所以我们就行动起来吧！
完成
这次我们主要实现两点：
透视场景效果
金币动画
设置场景
创建新场景后游戏动态，在场景中添加4个四边形（Quad），并通过旋转、平移和缩放围绕长方体的四个边。
四个边围成四个正方形
然后创建材质（墙/地板/天花板），使用builtin-unlit.effect（无光），选择对应的纹理，然后将材质添加到对应的方块中。
创建素材
一切创建完成后，看起来像这样。
洞穴效应
洞深处应该有一个渐变的黑色阴影。 将资源类型更改为 sprite-frame 并将其添加到场景的 UI 层。
修改资源类型
然后调整相机的参数，使渐变黑色阴影位于中间，并运行预览。 结果如下。
洞穴效果+阴影蒙版帧动画
金币素材是2D帧动画。 为了实现3D透视效果，这里也使用了正方形。
原始素材有点拥挤，所以我们稍微处理一下，让每一帧的图像位置均匀。
这里我使用shoebox将图像分割，然后放入PS中调整位置。 导出图片的长和宽需要为2的n次方。
对于程序员来说更好的方法是编写一个脚本来分割图像，然后重新生成图像（或者请美术爸爸来生成图像）
金币图像处理
同样，创建金币材质，选择builtin-unlit.effect，选择透明通道（因为这个图像需要透明度），修改tillingOffset（纹理缩放偏移）参数。
创建金币材质
创建一个正方形，选择金币材质，添加动画，修改tillingOffset中的偏移参数。
创建金币动画1
然后将动画流程调整为Const，就可以看到初步的效果了。
创造金币动画2
最后在场景中多放几个金币2d游戏ui教程，在墙上加一些壁纸~
