18

I wish to simply a vector drawable created from a svg in inkscape. According to Android Studio my vector path is too long.

I don't know how to fix it so that it'll work. The code is below, along with what the drawable is suppose to look like.

   <?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="43.844998dp"
    android:height="43.591998dp"
    android:viewportWidth="43.844998"
    android:viewportHeight="43.591998">

    <path
        android:fillColor="@color/green_8"
        android:fillAlpha="0.78039216"
        android:strokeWidth="2.64575863"
        android:strokeLineJoin="round"
        android:pathData="M15.2489,209.971 C12.7531,209.916,10.5865,211.751,10.2745,214.283 L9.66091,219.266 L4.38994,219.255 C1.66777,219.249,-0.52854,221.436,-0.53455,224.158 C-0.540523,226.88,1.64606,229.076,4.36823,229.082 L8.45091,229.092 L7.75302,234.76 L4.38993,234.753 C1.66776,234.747,-0.52854,236.933,-0.53456,239.656 C-0.540533,242.378,1.64606,244.574,4.36823,244.58 L6.54302,244.586 L6.11669,248.048 C5.78398,250.75,7.69139,253.192,10.3932,253.525 C13.095,253.858,15.5379,251.951,15.8706,249.249 L16.4421,244.607 L22.0361,244.619 L21.6139,248.047 C21.2812,250.749,23.1883,253.191,25.8901,253.524 C28.5919,253.857,31.0348,251.95,31.3675,249.248 L31.9349,244.641 L38.3859,244.655 C41.1081,244.661,43.3044,242.474,43.3104,239.752 C43.3164,237.03,41.1298,234.834,38.4076,234.828 L33.1446,234.817 L33.8427,229.149 L38.3858,229.159 C41.108,229.165,43.3043,226.978,43.3103,224.256 C43.3163,221.534,41.1297,219.338,38.4075,219.332 L35.0524,219.325 L35.525,215.487 C35.8577,212.785,33.9506,210.343,31.2488,210.01 C28.547,209.677,26.1041,211.584,25.7714,214.286 L25.1536,219.303 L19.5596,219.291 L20.028,215.488 C20.3607,212.786,18.4536,210.344,15.7518,210.011 C15.5829,209.99,15.4151,209.978,15.2487,209.975 Z M18.35,229.112 L23.944,229.124 L23.2459,234.792 L17.6522,234.78 Z" />
</vector>

enter image description here

1

2 Answers 2

26

Use avocado to reduce the complexity and long paths.

This will optimize your vector drawable and fix the issue.

Installation:

npm install -g avocado

Usage Example:

avocado vector.xml

Here is before and after optimization of vector drawables using avocado.

Check usage link for more command options.

4
  • Can it ruin how the SVG is shown? Is there an online tool for batch operations on VectorDrawable? Or a plugin for Android Studio? Mar 11, 2020 at 9:24
  • Avocado can compress all files in a given path using /path/to/svgs/*. I've never seen it ruin an SVG. Yet... May 13, 2020 at 13:51
  • Just in case anyone gets here, this tool seem to do the oposite you need when you get the "vector path is too long" error, because it joins paths instead of separating them into shorter ones. I had two "too long" paths and now I have one even more "too long" path Jul 18 at 16:37
  • Another option is combining the online tool SVGOMG for optimizing SVG and then processing it with Avocado - results in even smaller files. jakearchibald.github.io/svgomg Nov 14 at 16:44
2

You can also minify the SVG, and then recreate the XML drawable. For example with svgo: https://github.com/svg/svgo

Install with: npm -g install svgo

And then: svgo original_icon.svg -o minified_icon.svg

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.