Search code examples
androidsvgvectorandroid-vectordrawable

Broken vector drawable with android fillType = evenOdd


android:fillType="evenOdd" 

make the vectror drawable broken on Android 21 is there anyway we can fix this vector?

I also decompile the release.apk and found that they remove android:fillType="evenOdd" and even on debug.apk it has
android:fillType="evenOdd" but still show the broken image on app


Solution

  • update 2021 Solution0 from Zach Sperske

    In your defaultConfig in build.gradle vectorDrawables { useSupportLibrary = true } implementation("androidx.appcompat:appcompat:1.2.0")

    Solution 1

    Flattern image in Sketch and use this site to convert SVG to xml for Android

    Solution 2

    I use nonZero instead of evenOdd and open it in Sketch to reverse Order after reverse it will change pathData and remove android:fillType and everything work fine on Android 21+.

    Solution 3

    PNG

    TLDR

    After some research I found that there are two fill-rule property methods for Vector graphics, SVGs, the “evenodd” vs “nonzero”

    I opened the SVG icon in Sketch and inspected the hole at the top of the icon. As expected it uses fill-rule:evenodd property. Now I have to change the fill-rule to use “nonzero” property. How? Select the path. In the right side, there is a settings icon at the “Fills” property. Click it and choose “non-zero”.

    From the main menu, choose Layer → Paths → Reverse Order. I got the hole back at the top of the icon and got the hole in the app, too.

    For more detail