动画可绘制对象中的渐变颜色可以 XML 吗?
Can gradient color in animated drawable XML?
我在矢量中使用了渐变颜色。它的工作。我想在动画矢量上使用渐变颜色,但它不起作用。我在 XML 代码中看不到问题。我不知道这是否可能或者我应该使用其他方法。如果不可能,我想知道为什么。
动画可绘制文件。
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="path"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FF70C8BB" android:offset="0.0"/>
<item android:color="#FF0964AE" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
你可以伪造它。淡出你的路径,同时用你想要的其他渐变在另一条路径中淡出,就像这样:
- 复制路径:path2
- 设置path2中的另一个渐变
- 将路径 2 的 fillAlpha 设置为 0
- 复制目标路径 2 的路径动画
- 向两个动画集添加一个 fillAlpha objectAnimation,其中 fillAlpha 从 1 变为 0,而路径 2 fillAlpha 从 0 变为 1
例如:
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
您的完整代码如下所示:
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="path"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FF70C8BB" android:offset="0.0"/>
<item android:color="#FF0964AE" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
<path
android:name="path2"
android:fillAlpha="0"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FFFFC8BB" android:offset="0.0"/>
<item android:color="#FF0964FF" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="path2">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>
我在矢量中使用了渐变颜色。它的工作。我想在动画矢量上使用渐变颜色,但它不起作用。我在 XML 代码中看不到问题。我不知道这是否可能或者我应该使用其他方法。如果不可能,我想知道为什么。
动画可绘制文件。
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="path"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FF70C8BB" android:offset="0.0"/>
<item android:color="#FF0964AE" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
你可以伪造它。淡出你的路径,同时用你想要的其他渐变在另一条路径中淡出,就像这样:
- 复制路径:path2
- 设置path2中的另一个渐变
- 将路径 2 的 fillAlpha 设置为 0
- 复制目标路径 2 的路径动画
- 向两个动画集添加一个 fillAlpha objectAnimation,其中 fillAlpha 从 1 变为 0,而路径 2 fillAlpha 从 0 变为 1
例如:
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
您的完整代码如下所示:
<animated-vector
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt">
<aapt:attr name="android:drawable">
<vector
android:name="vector"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:name="path"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FF70C8BB" android:offset="0.0"/>
<item android:color="#FF0964AE" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
<path
android:name="path2"
android:fillAlpha="0"
android:pathData="M 1.218 7.957 L 1.218 15.783 L 22.779 15.783 L 22.779 7.957">
<aapt:attr name="android:fillColor">
<gradient
android:endX="0.0"
android:endY="50.0"
android:startX="24.0"
android:startY="50.0"
android:type="linear">
<item android:color="#FFFFC8BB" android:offset="0.0"/>
<item android:color="#FF0964FF" android:offset="1.0"/>
</gradient>
</aapt:attr>
</path>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
<target android:name="path2">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="500"
android:valueFrom="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueTo="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="500"
android:duration="500"
android:valueFrom="M 7.957 0.783 L 7.957 22.957 L 15.913 22.957 L 15.913 0.783"
android:valueTo="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1000"
android:duration="500"
android:valueFrom="M 7.957 7.957 L 7.957 15.783 L 15.913 15.783 L 15.913 7.957"
android:valueTo="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="1500"
android:duration="500"
android:valueFrom="M 1.043 7.957 L 1.043 15.783 L 22.957 15.783 L 22.957 7.957"
android:valueTo="M 1.043 0.783 L 1.043 22.957 L 22.957 22.957 L 22.957 0.783"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="fillAlpha"
android:duration="2000"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>