Android动画绘制字母表

Rit*_*itu 6 java xml graphics animation android

我被困在对我来说有点困难的动画部分,我需要像这样绘制这个绿色标志。我尝试过这个Github 指南实现了我的要求,但是使用Path我只能在坐标的帮助下移动视图,而且我离我需要的结果还很远。我不确定从哪里开始从动画中获得所需的结果。我避免嵌入GIF和任何繁重的库来获得我的结果。请帮助制作这种动画,我知道通过代码获得这种动画非常困难。

任何帮助将不胜感激。谢谢

如果上面的视频链接不起作用,请检查这个:视频链接

小智 3

有一个很棒的工具可以创建这样的动画矢量。 https://shapeshifter.design/我在那里创建了您的示例,我将尝试在接下来的几个步骤中解释如何操作。

在文件、导入和导出旁边的左下角,单击添加窗口以添加新路径。添加路径后,选择它并导航到 pathData 字段。首先我们将从动画部分开始,将其添加到pathData

M 4 6 L 22 2 L 2 22 L 19.5 3.5 L 4 6
Run Code Online (Sandbox Code Playgroud)

您可以在此处查看有关 M、L、Z 命令的更多信息/sf/answers/2949695941/

还将填充颜色设置为您需要的任何颜色。

在最近创建的路径的左下角或路径名称旁边的右上角,选择秒表并添加路径数据动画。

对于第一个动画集

startTime = 0
endTime = 100 //CHANGE THIS BASE ON YOUR NEEDS
interpolator = Linear
fromValue = M 4 6 L 4 6 L 4 6 Z
toValue = M 4 6 L 22 2 L 19 3.5 Z
Run Code Online (Sandbox Code Playgroud)

然后添加另一个动画(左下角添加的pathData动画上有+号)并设置下一个值

startTime = 100 //CHANGE THIS BASE ON YOUR NEEDS
endTime = 200 //CHANGE THIS BASE ON YOUR NEEDS
interpolator = Linear
fromValue = M 4 6 L 22 2 L 19 3.5 Z M 22 2 L 22 2 L 19 3.5 Z
toValue = M 4 6 L 22 2 L 19 3.5 Z M 22 2 L 2 22 L 19 3.5 Z
Run Code Online (Sandbox Code Playgroud)

然后为白色部分添加两条新路径。在顶部将 pathData 设置为:

M 9 7.5 L 11.5 11 L 12.5 10 L 10.5 7.5 Z
Run Code Online (Sandbox Code Playgroud)

在底部将 pathData 设置为:

M 13 12.5 L 15.5 15.5 L 17 15.5 L 14 11.5 Z
Run Code Online (Sandbox Code Playgroud)

要更改背景颜色,请在左下角选择矢量,然后在画布颜色字段中设置背景颜色。

完成后,您可以将其导出为动画矢量可绘制对象并将其添加到您的项目中。当您将生成的 .xml 文件添加到项目时,打开它并更改宽度和高度。

这是如何启动动画的示例:

Drawable drawable = imageView.getDrawable();
if( drawable instanceof AnimatedVectorDrawable ) {
    AnimatedVectorDrawable animation = (AnimatedVectorDrawable) drawable;
    animation.start();
}
Run Code Online (Sandbox Code Playgroud)