Android 动画矢量绘图无法正常工作
Android Animated Vector Drawable not working properly
我已经使用 ShapeShifter 创建了一个动画矢量可绘制对象,它执行一些 trim 路径和一些路径数据更改。
结果如下:
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="omino"
android:pathData="M 9 10 C 7 10 7 10 7 8 C 7 6 7 6 9 6 C 11 6 11 6 11 8 C 11 10 11 10 9 10 L 9 16"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="bilancia"
android:pathData="M 3 16 L 20 16 M 12 16 L 12 14 L 22 14"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="abox"
android:pathData="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="braccia"
android:pathData="M 14 14 L 9 11 L 13 12.5"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
</vector>
</aapt:attr>
<target android:name="omino">
<aapt:attr name="android:animation">
<objectAnimator
xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
<target android:name="bilancia">
<aapt:attr name="android:animation">
<objectAnimator
xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="trimPathStart"
android:duration="1000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
<target android:name="abox">
<aapt:attr name="android:animation">
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="2000"
android:duration="1000"
android:valueFrom="M 13 12 L 13 10 L 19 10 L 19 12 L 13 12"
android:valueTo="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="1000"
android:valueFrom="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:valueTo="M 13 12 L 13 10 L 19 10 L 19 12 L 13 12"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="braccia">
<aapt:attr name="android:animation">
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="trimPathStart"
android:duration="1000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="1000"
android:valueFrom="M 14 14 L 9 11 L 13 12.5"
android:valueTo="M 14 12 L 9 11 L 13 10.5"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="2000"
android:duration="1000"
android:valueFrom="M 14 12 L 9 11 L 13 10.5"
android:valueTo="M 14 14 L 9 11 L 13 12.5"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
Android 工作室不断将 animated-vector 和 target 视为错误。但在编译中一切正常。
我将此文件作为可绘制对象导入到我的项目中。然后在布局中我添加了一个没有任何 src 的 ImageView。
使用这段代码,我将动画矢量可绘制对象设置为图像视图,然后开始动画:
AnimazioneVettore = (ImageView)view.findViewById(R.id.ImgVectorAnim);
animatedVector = AnimatedVectorDrawableCompat.create(getContext(), R.drawable.no_abox_animated);
AnimazioneVettore.setImageDrawable(animatedVector);
animatedVector.start();
no_abox_animated为矢量文件
当我启动应用程序时,未触发任何错误,矢量加载到 imageview 中并开始播放动画。
第一个动画"Trim path end/start"。除了 "bilancia",它工作正常。这里的动画执行了一个可怕的 "jump" insted 动画最后 2 行。
路径动画应该在 500 毫秒时开始。但什么也没发生。
最后一个路径动画应该在 200 开始,但它也不起作用。
我正在使用 'com.android.support:appcompat-v7:25.3.1'
首先是简单的部分。 AnimatedVectorDrawables 的路径变形仅在版本 25.4.0 (release notes) 中添加到支持库中。因此,对于没有发生任何事情的 pathData 动画,您只需要更新您正在使用的支持库版本。
至于您的 "bilancia" 问题,这是一个与当存在多个 moveTo 命令 (M
) 时 AnimatedVectorDrawables 处理 trimPath 的方式有关的问题。你可以找到 an issue filed here。基本上你的路径是画两条线,当它与 trimPath 结合时它不能很好地工作。我建议将 "bilancia" 中的两条线分成两个单独的路径,然后将它们设置为动画。
我已经使用 ShapeShifter 创建了一个动画矢量可绘制对象,它执行一些 trim 路径和一些路径数据更改。
结果如下:
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="omino"
android:pathData="M 9 10 C 7 10 7 10 7 8 C 7 6 7 6 9 6 C 11 6 11 6 11 8 C 11 10 11 10 9 10 L 9 16"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="bilancia"
android:pathData="M 3 16 L 20 16 M 12 16 L 12 14 L 22 14"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="abox"
android:pathData="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
<path
android:name="braccia"
android:pathData="M 14 14 L 9 11 L 13 12.5"
android:strokeColor="#000000"
android:strokeAlpha="0.7"
android:strokeWidth="0.3"
android:strokeLineCap="round"
android:strokeLineJoin="round"/>
</vector>
</aapt:attr>
<target android:name="omino">
<aapt:attr name="android:animation">
<objectAnimator
xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
<target android:name="bilancia">
<aapt:attr name="android:animation">
<objectAnimator
xmlns:android="http://schemas.android.com/apk/res/android"
android:propertyName="trimPathStart"
android:duration="1000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
<target android:name="abox">
<aapt:attr name="android:animation">
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="trimPathEnd"
android:duration="1000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="2000"
android:duration="1000"
android:valueFrom="M 13 12 L 13 10 L 19 10 L 19 12 L 13 12"
android:valueTo="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="1000"
android:valueFrom="M 13 14 L 13 12 L 19 12 L 19 14 L 13 14"
android:valueTo="M 13 12 L 13 10 L 19 10 L 19 12 L 13 12"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="braccia">
<aapt:attr name="android:animation">
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:propertyName="trimPathStart"
android:duration="1000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="1000"
android:valueFrom="M 14 14 L 9 11 L 13 12.5"
android:valueTo="M 14 12 L 9 11 L 13 10.5"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="2000"
android:duration="1000"
android:valueFrom="M 14 12 L 9 11 L 13 10.5"
android:valueTo="M 14 14 L 9 11 L 13 12.5"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
Android 工作室不断将 animated-vector 和 target 视为错误。但在编译中一切正常。
我将此文件作为可绘制对象导入到我的项目中。然后在布局中我添加了一个没有任何 src 的 ImageView。
使用这段代码,我将动画矢量可绘制对象设置为图像视图,然后开始动画:
AnimazioneVettore = (ImageView)view.findViewById(R.id.ImgVectorAnim);
animatedVector = AnimatedVectorDrawableCompat.create(getContext(), R.drawable.no_abox_animated);
AnimazioneVettore.setImageDrawable(animatedVector);
animatedVector.start();
no_abox_animated为矢量文件
当我启动应用程序时,未触发任何错误,矢量加载到 imageview 中并开始播放动画。
第一个动画"Trim path end/start"。除了 "bilancia",它工作正常。这里的动画执行了一个可怕的 "jump" insted 动画最后 2 行。
路径动画应该在 500 毫秒时开始。但什么也没发生。
最后一个路径动画应该在 200 开始,但它也不起作用。
我正在使用 'com.android.support:appcompat-v7:25.3.1'
首先是简单的部分。 AnimatedVectorDrawables 的路径变形仅在版本 25.4.0 (release notes) 中添加到支持库中。因此,对于没有发生任何事情的 pathData 动画,您只需要更新您正在使用的支持库版本。
至于您的 "bilancia" 问题,这是一个与当存在多个 moveTo 命令 (M
) 时 AnimatedVectorDrawables 处理 trimPath 的方式有关的问题。你可以找到 an issue filed here。基本上你的路径是画两条线,当它与 trimPath 结合时它不能很好地工作。我建议将 "bilancia" 中的两条线分成两个单独的路径,然后将它们设置为动画。