Android矢量Drawable区域无法填充颜色的技术问询

1. 定位核心问题 #

你从JPG逆向生成的XML矢量图，大概率是把鞋垫区域的轮廓做成了描边路径，而非闭合的填充路径——这就是setTint只能给边框上色的原因。

2. 修正Path的填充属性 #

打开目标XML文件，找到对应区域的<path>标签，按以下规则修改：

• 把android:fillColor从@android:color/transparent或未设置状态，改成@android:color/white（默认填充色，后续tint会覆盖它）
• 若不需要边框，将android:strokeWidth设为0dp；若保留边框，明确android:strokeColor属性
• 关键检查：pathData末尾必须有z指令（SVG路径闭合命令），确保路径形成封闭区域。如果没有，手动添加。

示例修正后的path标签：

<path
    android:pathData="M15,20 L60,20 L60,70 L15,70 z"
    android:fillColor="@android:color/white"
    android:strokeWidth="0dp" />

3. 调整TintMode确保生效 #

调用setTint时，显式设置tint模式为SRC_IN（默认模式，但明确设置能避免异常）：

DrawableCompat.setTintMode(mInsoleRegion1.getDrawable(), PorterDuff.Mode.SRC_IN);
DrawableCompat.setTint(mInsoleRegion1.getDrawable(), Color.parseColor(color[1]));

4. 修复JPG逆向生成的路径缺陷 #

从JPG转矢量的工具通常会生成大量细碎描边路径，而非单一闭合填充路径，这种情况需手动整理：

• 删除所有细碎的描边path，只保留对应区域的单一闭合路径
• 若路径过于零散，建议用Figma、Sketch等矢量工具重新绘制目标区域，导出SVG后再转成Android矢量Drawable，避免逆向生成的路径问题

5. 验证完整XML结构 #

确保根标签<vector>下，每个区域的path都是独立且正确的填充路径，示例结构：

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="220dp"
    android:height="100dp"
    android:viewportWidth="220"
    android:viewportHeight="100">

    <!-- 鞋垫区域1 -->
    <path
        android:pathData="..."
        android:fillColor="@android:color/white" />

    <!-- 鞋垫区域2 -->
    <path
        android:pathData="..."
        android:fillColor="@android:color/white" />

    <!-- 鞋垫区域3 -->
    <path
        android:pathData="..."
        android:fillColor="@android:color/white" />
</vector>

按以上步骤修改后，再调用setTint即可实现整个区域的颜色填充。

内容的提问来源于stack exchange，提问作者Sifu Duck