动画控件

什么是动画？动画可以用来做什么？
动画可以使静止不动的控件动起来，使界面更生动！

接下来我来教你写一个简单的动画。

创建动画控件

动画控件与其他控件不同的是，动画控件是使用anim_type来定义控件的类型，而不是type (动画控件作为单独的一个控件)

例如：

"test_anim": { "anim_type": "wait" } anim_type可能的值（字符串/列举）：

* 加粗文字是常用动画类型

alpha – 不透明度
clip – 剪辑
size – 大小
color – 颜色
offset – 锚点
uv – 图片显示锚点
flip_book – 序列帧
aseprite_flip_book – 序列帧
wait – 等待（无动画）

定义动画属性

动画控件还需要完善其它属性才能生效
简单示例： "test_offset_anim": { "anim_type": "offset", "duration": 5, "from": [ 10, 0 ], "to": [ 0, 0 ], "easing": "spring" }

属性	属性名	值	默认值	描述
duration	持续时间	数字		动画播放的持续时间，单位为秒。
from	初始状态	数字或数组		动画播放时的初始状态。值的类型由动画类型而异。^[1]
to	结束状态	数字或数组		动画播放后的状态。值的类型由动画类型而异。^[1]
next	下一个动画	字符串：引用		动画播放结束后播放的另一个动画。字符串格式为"@namespace.anim_control" namespace 动画控件所在的文件的命名空间 anim_control 动画控件例如："@hud.title_anim"
destroy_at_end	结束时销毁	字符串：控件名		在动画结束后要销毁的控件。要销毁的控件尽量保持在同一个文件内。
ignored	忽略动画	布尔值	false	是否忽略该动画控件。
reversible	可逆的 [需要验证]	布尔值	false
resettable	可复位的 [需要验证]	布尔值	false
scale_from_starting_alpha	从Alpha开始时保持比例 [需要验证]	布尔值	false
activated	已激活 [需要验证]	布尔值	false

动画类型为 wait 时，无需 from, to 属性。

定义动画属性 / 播放动画条件

在没有定义播放动画的条件的情况下，只要控件显示即可播放。

属性	属性名	值	描述
play_event	播放事件	字符串：事件名	触发该事件，动画进入播放状态。
end_event	结束事件	字符串：事件名	触发该事件，动画进入结束播放状态。
start_event	开始事件	字符串：事件名	触发该事件，动画进入开始播放状态。
reset_event	重置事件	字符串：事件名	触发该事件，动画进入重置状态。

事件名称：预设事件/按钮映射名称
为按钮映射名称时：可以直接填写from_button_id或to_button_id的值
为预设事件时：可以填写以下列举的事件，也可以使用该文件其它的事件

screen.entrance_push    -   进入（推入）屏幕
screen.entrance_pop    -   进入（弹入）屏幕
screen.exit_push    -   退出（推入）屏幕
screen.exit_pop    -   退出（弹入）屏幕
screen.entrance_end    -   结束进入屏幕
screen.exit_end    -   结束退出屏幕

定义动画属性 / 播放动画样式

属性	属性名	值	默认值	描述
easing	动画样式	字符串：列举	linear	列举的值可以是： linear spring in_bounce out_bounce in_out_bounce in_expo out_expo in_out_expo in_sine out_sine in_out_sine in_cubic out_cubic in_out_cubic in_back out_back in_out_back in_elastic out_elastic in_out_elastic in_quad out_quad in_out_quad in_circ out_circ in_out_circ in_quart out_quart in_out_quart in_quint out_quint in_out_quint

提示
1. in类型表示从起点开始播放的动画样式
2. out类型表示到达终点后播放的动画样式
3. in_out类型表示进行in动画样式后播放out动画样式

为控件添加动画

写好动画控件还不能直接被控件使用，那么要如何让一个控件使用并播放动画呢？
很简单，例如： "test": { "type": "panel", "offset": "@hud.test_anim"//值 = @命名空间.控件名 }, "test_anim": { "anim_type": "offset" } "test": { "type": "panel", "anims": [ "@hud.test_anim"//值 = @命名空间.控件名 ] }, "test_anim": { "anim_type": "offset" } 为单个属性添加（适用于单个动画控件）
将属性的值改为@命名空间.动画控件名称提示

1. 并不是所有的属性都可以引用动画控件
如果引用的动画控件anim_type为offset
那么需要引用这个动画控件的控件，只能在这个控件的offset属性中引用

2. 命名空间为引用的动画控件所在的文件的命名空间（namespace），如果动画控件与需要引用这个动画控件的控件在同一个文件，就不用写上命名空间，但建议还是写上命名空间

3. 命名空间与动画控件名称之间需要逗号分隔"."（英文标点）

4. 没有写上命名空间，而且动画控件与需要引用这个动画控件的控件不在同一个文件，这个动画不会播放

为多个属性添加（适用于多个动画控件）

这时需要一个新的属性 — anims

属性	属性名	值	描述
anims	动画	数组	该控件播放的动画。示例："anims": ["@test_anims"] 子元素的格式为"@namespace.anim_control" namespace 动画控件所在文件的命名空间 anim_control 动画控件名

添加的动画虽然能播放，但是只能播放一次，需要再播放一次还需重进Minecraft。
面对这样的情况要如何解决呢？

我们还需要一个重置动画的属性 -- animation_reset_name

"test": { "type": "panel", "animation_reset_name": "screen_animation_reset", "anims": [ "@hud.test_anim"//值 = @命名空间.控件名 ] }

属性	属性名	值	描述
animation_reset_name	重置动画事件	字符串：事件名	当事件触发时，重置动画状态。类似于上文所提到的 reset_event。如果只想离开屏幕重置动画，值为 screen_animation_name。

动画的运用

以上就是动画控件的全部内容了。理论存在，实践开始！
那么动画可以做到什么呢？

1. 进度条
利用剪辑面板剪辑出界部分的特性，再配合offset平移动画即可实现

比如上面的绿色进度，首先用["100%","100%"]保持父控件的大小
然后使用offset平移动画（将from设为["-100%",0]，to设为[0,0]）
只要触发这个动画就可以看到进度条的效果了
（提示：把from与to的值调换位置，能看到进度从100%到0%的效果哦！）

2. 计时器
还是利用剪辑面板剪辑出界部分的特性，再配合offset平移动画即可实现
这个以后会详细讲解，这里只说原理

其实这个显示文字不会随着时间变化而变化，实际上是使用动画改变stack_panel的offset位置
所以，显示的内容是由多个文字组成堆叠面板并由剪辑面板剪辑而成的

3. 欢迎
利用动画默认不会重置的特性，我们可以只给这个控件播放动画，结束后立即"销毁"控件（不给动画重置）
至于进入屏幕显示"欢迎"控件，可以用start_event或play_event属性

注意事项

代码没有错误，为何不能播放动画？
答：请确保"屏幕动画"开启，没有前往打开Minecraft -> 设置 -> 视频 -> 屏幕动画 -> 开启

你如果有什么问题都可以在视频评论区提出哦，我会尽量回答你的问题的─=≡Σ(((つ•̀ω•́)つ