养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

Unity 如何制作UI动画①

时间:2024-10-09 03:26:10

本经验讲解在Unity游戏引擎中,如何给UI元素Text制作一个变大变小的动画效果。

Unity 如何制作UI动画①

工具/原料

Unity

方法/步骤

1、首先,新建Canvas,在Canvas下新建Image作为背景,新建Text用来制作动画。

Unity 如何制作UI动画①

2、选中Canvas,打开Window->Animation,来到Animation窗口。

Unity 如何制作UI动画①

3、点击Create,选择保存动画片段的地方(通常是项目的Animation文件夹),创建。

Unity 如何制作UI动画①

4、创建过后,Canvas自动多了一个Animator组件,且自动创建了控制器(图中是Can箪滹埘麽vas1)。动画控制器的使用本经验不展开说明。现在可以进行动画编辑了。

Unity 如何制作UI动画①

5、点击AddProp娣定撰钠erty,可以把想要添加动画的属性添加进来。我们看到Text对象的TextScript组件下,可以给颜色等属性制作动画。不过本经验只制作一个放大缩小的动画作为示例。

Unity 如何制作UI动画①

6、展开Text->RectTransf艺皱麾酪orm,点击Scale右边的小加号,把Scale属性添加到动画属性列表里。

Unity 如何制作UI动画①

7、展开Scale,我们看到三个子属性x,y,z。我们就是要对这三个数值打关键帧,制作动画。

Unity 如何制作UI动画①

8、首先,选中起始帧和结束帧,移动到自己觉得合适的地方。

Unity 如何制作UI动画①

9、在想要添加关键帧的地方添加一个关键帧。通过面板上面的两个小按钮,来回切换关键帧。

Unity 如何制作UI动画①

Unity 如何制作UI动画①

10、将起始帧的scale.x/y/z设置为0.同理,分别设置中间帧和结束帧。

Unity 如何制作UI动画①

Unity 如何制作UI动画①

Unity 如何制作UI动画①

11、从面板下面切换到Curve,可以直观地看到三个属性值随时间的变化。最终效果如图。

Unity 如何制作UI动画①

Unity 如何制作UI动画①

© 一点知识