路径数据简化与压缩

52 阅读1分钟

✅ 1. 路径数据简化与压缩

如果你希望图标更轻量或用于性能敏感场景,可以使用工具对 pathData 进行简化或压缩。

推荐工具:

  • SVGOMG(在线 SVG 优化器)
  • Scour(命令行 SVG 优化工具)

这些工具可以自动去除冗余点、保留必要精度,并压缩路径长度。


✅ 2. 适配深色/浅色主题的增强方案

目前我们已将 fillColor 设置为 ?attr/text_color,但为了确保图标在不同背景上都清晰可见,可以考虑以下增强方式:

方法一:使用 <selector> 实现颜色切换

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:autoMirrored="true"
    android:height="24dp"
    android:tint="?attr/text_color"
    android:viewportHeight="24"
    android:viewportWidth="24"
    android:width="24dp">

    <path
        android:fillColor="?attr/colorOnPrimary" <!-- 更稳定的主题适配 -->
        ... />
</vector>

colorOnPrimary 是 Material Design 中推荐的颜色属性,适用于图标等前景元素。


✅ 3. 添加无障碍描述(Accessibility)

为了让应用更符合无障碍规范,你可以为矢量图添加内容描述:

修改后的完整 XML 示例:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:autoMirrored="true"
    android:contentDescription="@string/icon_description_360"
    android:height="24dp"
    android:tint="?attr/text_color"
    android:viewportHeight="24"
    android:viewportWidth="24"
    android:width="24dp">

    <path
        android:fillColor="?attr/colorOnPrimary"
        android:pathData="
            M12,7
            C6.48,7 2,9.24 2,12
            c0,2.24 2.94,4.13 7,4.77
            V20
            l4,-4
            -4,-4
            v2.73
            c-3.15,-0.56 -5,-1.9 -5,-2.73
            0,-1.06 3.04,-3 8,-3
            s8,1.94 8,3
            c0,0.73 -1.46,1.89 -4,2.53
            v2.05
            c3.53,-0.77 6,-2.53 6,-4.58
            0,-2.76 -4.48,-5 -10,-5
            z" />
</vector>

并在 res/values/strings.xml 中添加描述:

<string name="icon_description_360">360 Degree Rotation Icon</string>

✅ 4. 构建兼容性验证

确保项目中启用了 VectorDrawable 支持,检查 build.gradle 文件中的配置是否包含:

android {
    defaultConfig {
        vectorDrawables.useSupportLibrary = true
    }
}

并确认在布局中使用了 app:srcCompat 而不是 android:src

<ImageView
    app:srcCompat="@drawable/baseline_360_24"
    ... />

=