如何在XML中对向量的strokeColor和fillColor进行淡化/动画处理?

时间:2019-02-15 14:47:17

标签: android colors selector animator

我有一个带有CardViews的RecyclerView。卡片具有TextViews和ImageButtons,按钮使用矢量可绘制对象。我希望卡根据启用状态淡入/淡出。

我设法使用选择器进行动画处理,以使卡片高程和textColor动画化,该选择器的样式设置为卡片的样式,但相同的代码似乎不适用于矢量的strokeColor和fillColor属性。他们是否不尊重主题设置的属性,还是我错过了其他东西?

该应用完全使用Kotlin编写,并使用AndroidX / JetPack。

我玩过动画矢量和动画选择器,但无法使它们工作。我希望在其之间淡入淡出的每种颜色组合都需要单独的矢量可绘制对象吗?

向量是简单类型(播放按钮示例):

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:viewportWidth="24.0"
        android:viewportHeight="24.0">
    <path
        android:strokeWidth="?android:strokeWidth"
        android:pathData="M8,5v14l11,-7z"/>
</vector>

它们被封装在卡片视图布局的ImageButtons中:

<ImageButton
    android:layout_width="40dp"
    android:layout_height="40dp" app:srcCompat="@drawable/ic_session_play"
    android:id="@+id/playButton" app:layout_constraintEnd_toStartOf="@+id/stopButton"
    app:layout_constraintBottom_toBottomOf="parent"
    android:scaleType="fitCenter" android:background="?attr/selectableItemBackgroundBorderless"/>

然后在动画制作选择器中设置颜色和高程:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
          xmlns:app="http://schemas.android.com/apk/res-auto" >
    <item android:state_enabled="true" >
        <objectAnimator android:duration="@integer/enabled_transition_time" >
            <propertyValuesHolder
                    android:propertyName="elevation" android:valueType="floatType"
                    android:valueFrom="@dimen/session_card_disabled_elevation" android:valueTo="@dimen/session_card_enabled_elevation" />
            <propertyValuesHolder
                    android:propertyName="textColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_disabled_dark" android:valueTo="@color/session_card_enabled_dark" />
            <propertyValuesHolder
                    android:propertyName="fillColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_disabled_light" android:valueTo="@color/session_card_enabled_light" />
            <propertyValuesHolder
                    android:propertyName="strokeColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_disabled_dark" android:valueTo="@color/session_card_enabled_dark" />
        </objectAnimator>
    </item>
    <item android:state_enabled="false" >
        <objectAnimator android:duration="@integer/enabled_transition_time" >
            <propertyValuesHolder
                    android:propertyName="elevation" android:valueType="floatType"
                    android:valueFrom="@dimen/session_card_enabled_elevation" android:valueTo="@dimen/session_card_disabled_elevation" />
            <propertyValuesHolder
                    android:propertyName="textColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_enabled_dark" android:valueTo="@color/session_card_disabled_dark" />
            <propertyValuesHolder
                    android:propertyName="fillColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_enabled_light" android:valueTo="@color/session_card_disabled_light" />
            <propertyValuesHolder
                    android:propertyName="strokeColor" android:valueType="colorType"
                    android:valueFrom="@color/session_card_enabled_dark" android:valueTo="@color/session_card_disabled_dark" />
        </objectAnimator>
    </item>
</selector>

最后,这在样式声明中引用:

<style name="SessionCardStyle" parent="AppTheme">
    <item name="android:stateListAnimator">@animator/session_card_enable_disable</item>
    <item name="android:strokeWidth">1</item>
</style>

1 个答案:

答案 0 :(得分:0)

好,所以我想通了... CardView会自行设置某些值的动画。我要做的就是将颜色值移到我的styles.xml中:

    <style name="SessionCardStyle" parent="AppTheme">
        <item name="android:stateListAnimator">@animator/session_card_enable_disable</item>
        <item name="android:textColor">@color/session_card_darks</item>
        <item name="android:fillColor">@color/session_card_lights</item>
        <item name="android:strokeColor">@color/session_card_darks</item>
        <item name="android:strokeWidth">1</item>
    </style>

它们具有基于启用状态的颜色选择器(这是res / color / session_card_darks.xml):

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_enabled="true"  android:color="#FF000000" />
    <item android:state_enabled="false" android:color="#40000000" />
</selector>

最后从动画师那里删除所有这些颜色:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_enabled="true" >
        <objectAnimator android:propertyName="elevation" android:valueType="floatType" android:valueTo="@dimen/session_card_enabled_elevation" />
    </item>
    <item android:state_enabled="false" >
        <objectAnimator android:propertyName="elevation" android:valueType="floatType" android:valueTo="@dimen/session_card_disabled_elevation" />
    </item>
</selector>

不过,如果有人知道如何直接使用尺寸选择器,则尺寸可能会更小。