我真的很喜欢 Android 中添加的 AnimatedVectorDrawable 功能。有什么好工具可以创建这样的动画吗？
例如，创建动画的任何工具，如下所述：
编辑：
到目前为止，我已经找到了这些工具（有点帮助）：
问问题
14171 次
3 回答
28
发现了两个很棒的网站。AndroidIconAnimator，这是一个基于 Web 的工具，用于创建 AnimatedVectorDrawables。还有Shapeshifter，可以很好地控制如何变形路径。
更新 07-09-2017
这两种工具现在合并为一个非常好的解决方案。我花了一些时间来了解如何使用它，但是一旦你看到它，它是一个非常强大的工具
感谢 2 Roman Nurik 和 Alex Lockwood。
于 2016-12-11T17:10:40.083 回答
1
这个问题很老了。我的回答可能会对未来的读者有所帮助。
像提问者展示的那样创建动画非常简单。我们自己可以创建如图所示的动画。首先，创建一个 VectorDrawable。例如下面：
my_vector_drawable.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="800dp"
android:height="800dp"
android:viewportWidth="800.0"
android:viewportHeight="800.0">
<path
android:name="a_circle"
android:pathData="M 250 200
q -86 02 -140 57.5
t -57 135.5
q -03 93 67 156
q 59 52 135 50
q 71 -02 132 -54
q 66 -56 66 -146
q 00 -80 -45 -129
q -68 -72 -158 -70 "
android:strokeLineCap="round"
android:strokeColor="#f00f"
android:fillColor="#00000000"
android:trimPathEnd="0"
android:strokeWidth="32"/>
</vector>
my_animated_vector_drawable.xml
<?xml version="1.0" encoding="utf-8"?>
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:drawable="@drawable/my_vector_drawable">
<target
android:name="a_circle"
android:animation="@animator/my_animation"/>
</animated-vector>
my_animation.xml
<?xml version="1.0" encoding="utf-8"?>
<set
xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:repeatCount="0"
android:repeatMode="restart"/>
</set>
第一个文件包含图片数据。第三个文件包含动画数据。第二个文件链接第一个和第二个。
您可以创建三个空白文件。将上面给出的内容复制并粘贴到您的文件中。
您将前两个文件放在可绘制文件夹中。第三个放在“animator”文件夹中。这两个文件夹都在 res 文件夹中找到了位置。
您可以创建一个包含 ImageView 的布局文件。您可以将 AnimatedVectorDrawable 文件作为可绘制文件 (android:src="my_animated_vector_drawable")。
在您的活动中将内容视图设置为布局。此外，膨胀 ImageView。
(myImage=((ImageView)findViewById(R.id.yourimageview name);
myImage.getDrawable.start():
然后看热闹。AnimatedVectorDrawable 文件中可以有多个目标。您可以在 set 下的动画文件中拥有多个 ObjectAnimator...
您问题中显示的动画是路径变形。文档中也有路径变形示例，这也很简单。我把它留给你做实验。
于 2018-04-04T17:47:40.953 回答
1
你可以使用 Airbnb 的 lottie 图书馆。它将 After Effects 中的动画设计路径传送到适用于 android 的 Animated Vector Drawables。我认为，如果您在 After Effects 中为矢量路径设置动画，因为它具有良好的灵活性，那将是最好的解决方案。
这是一个描述转换和渲染的完整过程的视频 https://www.youtube.com/watch?v=vs6GOlgUSc8
一些使用 Lottie 设计的动画图标。
布局中使用的动画图标
于 2020-05-07T02:59:22.777 回答