星火编辑器中，在UI界面使用”序列帧“Sprites实现特殊动效的按钮

修改于2023/05/13350 浏览主题教程

有时候我们需要在界面制作一些具备特殊动效的按钮时，例如视频中的旋转的金币按钮（我随便找的帧动画，不太好看，大家忽略就好，重要的是学技术）。当然除了制作按钮以外，其他任何帧动画都可以使用同样的方式来实现

可以使用编辑器中的“序列帧”Sprites实现，实现步骤如下

第一步

打开界面编辑器，然后在右边的组件库中找到“序列帧"，并把它拖到到你要的界面中你想要的位置，例如我这里是放到了右上角。

准备好你的动画帧序列，你可以使用PS或者其它任意第三方工具制作好的帧序列，拼接成N×M宫格的png图片，例如我这里是3×4宫格，总共是12帧，下面是我的序列帧演示（实际图片没有红线和蓝线，是为了方便教学我自己加上去的）

点击左边的Sprites控件，然后在右边属性面板中下滑，然后设置好相应的参数，下面是几个重要参数详解

（1）文件来源：图集。#图集：就是把所有帧合成一张N×M宫格的图，文件夹：不需要合成一张图。图集相对于文件夹来说，具备更高的性能和更小的文件大小，所以推荐使用图集。

（2）总帧数：12。#这个就是你的实际有效宫格数，像我上面的图片有12个有效宫格，那么就是12

（3）行帧数：4。#就是横着数，每行有几帧，例如上图，每行有4帧，就是4

（4）首帧：1。#你要从第几帧开始，起始帧为1，这个很容易理解，例如你设置为2，那么动画每次播放时不会显示第一帧

（5）尾帧：12。#播放到第几帧，这个也很容易理解，不多解释

（6）尺寸：宽=141，高=151。#这个是每帧的宽高，就是我上面演示图中蓝色框的尺寸，很容易理解

（7）每帧时间间隔：40，#意思是每帧显示40毫秒就会切换到下一帧，

剩下的循环播放和播放就不多解释了，一个是是否循环播放，一个是是否默认播放

然后就大功告成了，其他的点击触发什么的就不多说了，都是很基础的功能了。是不是很简单，快试试吧。