3d拼图我不会,老板:用Cocos做个会动的拼图总可以了吧!

引言

哈喽大家好,我是亿元程序员,上次老板让做3d拼图的那个小伙伴又双叒叕来了:

亿哥,我又双叒叕来了,3d拼图太难了,我这没有经验实在做不出来(捂脸)。

幸好老板没有一意孤行,但是无论如何都让我做个变种的拼图出来:做个会动的spine拼图总可以了吧!

大佬给我支支招,spine可以动态分割吗?

spine骨骼动画?,果然人的思维能力是无穷无尽的,一个拼图游戏都玩出花了。

spine动态分割的方法应该有很多,笔者想到了通过RTT的方法。

言归正传,本期带大家一起来看看,在Cocos游戏开发中,如何通过RTT动态分割spine骨骼动画

本文源工程可在文末获取,小伙伴们自行前往。

什么是RTT?

RenderToTexture是将场景 / 节点的渲染结果输出到一张纹理(Texture) 而非直接显示在屏幕上。

你可以把它理解成“给指定的游戏内容拍一张‘数字照片’,并把这张照片保存成可复用的纹理资源”。

我们可以通过RTT动态将spine动画渲染到纹理上,然后通过Sprite显示出来。

那么问题来了,我们如何在游戏开发中使用RTT?

RTT的使用

1.资源准备

既然是动态分割spine动画,我们需要准备一个spine动画,大家熟悉的:

直接运行就能看到效果:

2.创建渲染纹理

我们可以通过资源管理器assets目录右键创建一个渲染纹理(RenderTexture):

调整合适的大小。

image

3.创建相机

我们需要借助相机,把相机的画面渲染到渲染纹理,于是我们在spine节点下创建一个:

image

修改相机的Visibility属性去掉DEFAULT,否者会有警告。

image

然后在属性面板调整位置、正交大小等参数,让相机完全拍到spine动画,把背景颜色设置成白色便于观看区分。

设置Target Texture为我们刚创建的RenderTexture

为了避免spine动画被原相机拍到,我们可以调整位置,将它移出到画面外:

4.创建Sprite

我们可以直接把RenderTexture拖到场景中,会自动创建一个Sprite组件,并且自动将RenderTexture作为图片资源。

属性如下:

5.查看效果

直接运行就能看到效果:

动态分割

有了SpriteFrame之后,我们就可以按照之前动态分割图片的逻辑进行分割了。

首先创建一个脚本,拿到Sprite引用,定义行列数和间隙:

然后按照之前动态分割拼图的原理分割即可:

效果演示

最终效果如下,可以看到spine已经被成功分割,剩下游戏逻辑因为和之前一样,我们就不重复了:

结语

网友: “整天拼图拼图的,是不是还能拼视频?”

本文完整源码可以通过私信puzzlespine获取。

更多实用源码可以通过亿元Cocos小游戏实战合集获取,感谢支持。

5赞

技术分享贴顶一下

太棒了,拿 下