在XML选择器中更改可绘制对象的色调。

Question

我有一个按钮，其背景是在xml中定义的。我希望根据按钮当前所处的状态——按下、聚焦、正常——对按钮进行着色。

以下是我的xml文件。此外，我的colored_tint_dark和colored_tint都是我尝试画在从资源文件夹调用的可绘制图像上的半透明颜色。问题在于，当UI首次加载时，图像具有适当的色调，但是在按下后，按下状态不显示任何色调，然后正常状态也不显示任何色调。

<?xml version="1.0" encoding="utf-8"?>

<item android:state_pressed="true" android:drawable="@drawable/rounded_grayscale_pinstripe_button">
    <shape>
        <gradient
            android:endColor="@color/colored_tint"
            android:startColor="@color/colored_tint"
            android:angle="270" />
        <stroke
            android:width="0dp"
            android:color="@color/colored_tint" />
        <corners
            android:radius="0dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>

<item android:state_focused="true" android:drawable="@drawable/rounded_grayscale_pinstripe_button">
    <shape>
        <gradient
            android:endColor="@color/colored_tint"
            android:startColor="@color/colored_tint"
            android:angle="270" />
        <stroke
            android:width="0dp"
            android:color="@color/colored_tint" />
        <corners
            android:radius="0dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>

<item android:drawable="@drawable/rounded_grayscale_pinstripe_button">        
    <shape>
        <gradient
            android:endColor="@color/colored_tint_dark"
            android:startColor="@color/colored_tint_dark"
            android:angle="270" />
        <stroke
            android:width="0dp"
            android:color="@color/colored_tint_dark" />
        <corners
            android:radius="0dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>

我知道在Java中有解决方案，但我特别想找一个XML解决方案。谢谢。

- coder

Answer 1

创建一个选择器 tint_menu_item.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/white" android:state_pressed="true" />
    <item android:color="@color/white" android:state_activated="true" />
    <item android:color="@color/green" />
</selector>

在我的例子中，当被选中时，图像是白色的；当未被选中时，图像是绿色的。

然后，在您的xml文件中，您可以向ImageView添加tint属性：

<ImageView
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:tint="@color/tint_menu_item"
    android:src="@drawable/ic_menu_home" />

您还可以使用textColor属性在TextView上使用此选择器：

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textColor="@color/tint_menu_item" />

- Anne-Claire

---

你好，我在API 18及以下版本中使用色彩选择器时遇到了问题 链接 你有什么建议可以解决这个问题吗？ - Alex

android:tint属性在所有API上都无法正常工作。为了解决这个问题，您可以直接创建带有正确颜色的.png文件，然后从您的ImageView中删除android:tint属性。 - Anne-Claire

我应该把tint_menu_item.xml放在哪里？ - rraallvv

在“res”文件夹内（与“values”文件夹、“drawable”文件夹等并列），创建一个名为“color”的新文件夹。然后将您的“tint_menu_item.xml”文件放入其中。 - Anne-Claire

Answer 2

你尝试过使用选择器吗？

你可以在这里找到一些例子。

- Alvarop

Answer 3

假设您有一个appCpmpatImageView，并将此**app**:tint="@drawable/custom_tint"添加到兼容图像视图中，您的自定义色调选择器如下：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/grey" android:state_pressed="true" />
    <item android:color="@color/silver" android:state_focused="true" />
    <!-- default tint -->
    <item android:color="@color/white" />
</selector>

因此，您的appCompat ImageView将在不同情况下使用每种颜色作为着色。

- some user