Thorsten Dittmar
Thorsten Dittmar

Reputation: 56697

Converting SVG to Android Vector Drawable

I'm trying to convert SVG files that come as output from a command line tool (abcm2ps) into Android vector drawables, but I'm running into problems.

My process is as follows:

  1. Create the original SVG file using the tool mentioned above
  2. Run the SVG file through Inkscape to fix the page size
  3. Run the result through Inkscape again to save as Plain SVG (read somewhere that this might fix problems, doesn't help though)
  4. Try to import the SVG file into Android Studio to no avail

I'm getting errors saying that some referenced IDs can not be found. I looked into the XML file and noticed that this error occurs only for references that again contain references. Example:

<defs
   id="defs6633">
  <path
     id="usharp"
     class="fill"
     d="m 136,-702 v 890 h 32 v -890 m 128,840 h 32 V -750 H 296 M 64,-464 v 116 l 338,-96 V -560 M 64,-118 V -2 l 338,-98 v -114"
     inkscape:connector-curvature="0"
     style="fill:currentColor" />
  <use
     id="sh0"
     transform="matrix(0.018,0,0,0.018,-4,5)"
     xlink:href="#usharp"
     x="0"
     y="0"
     width="100%"
     height="100%" />
</defs>
<use
   x="44.5"
   y="20"
   xlink:href="#sh0"
   id="use6635"
   width="100%"
   height="100%" />

As you can see, object use6635 references sh0, which again references usharp.

Other places where the referenced object does not reference another object work, though.

This this a known limitation of the converter? Is there a way (preferrably a command line tool) to flatten the reference hierarchy so that only objects are referenced that don't reference other objects?


EDIT: OK, converting to EPS and then to SVG creates SVGs that are processed without the warning above - I now get warnings saying that scaled stroke widths are not supported...

Upvotes: 3

Views: 10155

Answers (5)

Bernard Ladenthin
Bernard Ladenthin

Reputation: 686

You can find my solution here, which includes an example implementation for the conversion: https://stackoverflow.com/a/78898372/1467477

Upvotes: 0

David Fraser
David Fraser

Reputation: 7439

There's a command-line build of the builtin Android converter available from Alex Lockwood here, with downloads of the tool on Google Drive

It requires a Java JRE to run; you can simply set JAVA_HOME to your Android Studio JRE before running it; on Windows:

set JAVA_HOME=C:\Program Files\Android\Android Studio\jre
call "%USERPROFILE%\Applications\vd-tool\bin\vd-tool.bat" %*

Usage:

./vd-tool -c -in svgs/ -out vectors/

Help:

Converts SVG files to VectorDrawable XML files.
Displays VectorDrawables.
Usage: [-c] [-d] [-in <file or directory>] [-out <directory>] [-widthDp <size>] [-heightDp <size>] [-addHeader]
Options:
  -in <file or directory>:  If -c is specified, Converts the given .svg file
                            to VectorDrawable XML, or if a directory is specified,
                            all .svg files in the given directory. Otherwise, if -d
                            is specified, displays the given VectorDrawable XML file
                            or all VectorDrawables in the given directory.
  -out <directory>          If specified, write converted files out to the given
                            directory, which must exist. If not specified the
                            converted files will be written to the directory
                            containing the input files.
  -c                        If present, SVG files are converted to VectorDrawable XML
                            and written out.
  -d                        Displays the given VectorDrawable(s), or if -c is
                            specified the results of the conversion.
  -widthDp <size>           Force the width to be <size> dp, <size> must be integer
  -heightDp <size>          Force the height to be <size> dp, <size> must be integer
  -addHeader                Add AOSP header to the top of the generated XML file
Examples:
  1) Convert SVG files from <directory> into XML files at the same directory and visualize the XML file results:
  vd-tool -c -d -in <directory>
  2) Convert SVG file and visualize the XML file results:
  vd-tool -c -d -in file.svg
  3) Display VectorDrawable's XML files from <directory>:
  vd-tool -d -in <directory>

Note: this version had issues for me handling some Inkscape-generated SVG files with gradients that referenced other gradient definitions; see this question for more info; this is simply a command-line version of the builtin Android tool.

Upvotes: 2

Manuelvalles
Manuelvalles

Reputation: 380

The last days I was using this site with great results, drop your file svg and get your drawable xml code [https://svg2vector.com/][1]

Upvotes: 1

Seb83
Seb83

Reputation: 236

I use this easy tool for converting SVG files to xml, I have never had any issue with it so far :-) It's not a command-line tool but I think you can convert many files at once.

http://a-student.github.io/SvgToVectorDrawableConverter.Web/

Upvotes: 0

Tako Dev
Tako Dev

Reputation: 31

you should try Shape Builder, i had a related issue it solved mine, hope it'll be helpful for you too!

Upvotes: 3

Related Questions