CODEWITHSUNDEEP
androidxmlandroid-studiosvg
monty.py
monty.py

Reputation: 2799

Translate normal SVG file into android convenient SVG

I´ve created a SVG file using Inkscape. However it seems like Vector Asset Studio doesn´t work with "random" local SVG files, containing unsupported features. (as described here)

There´s no problem choosing Material Icons directly, which I´ve done before. If you choose downloaded local versions of them, you also get an empty preview image. So the Material icons which are internally used have an entirely new shortened layout.

The question is, how to translate "normal" SVGs into "android" SVGs (with vector tag). I´ve found no docs on it (maybe cause it´s a new feature). Especially the android:pathData String seems to be calculated out of the two path d-attributes.

Can someone help me translating this already shortened normal SVG file into an android convenient one and explain how the pathData attribute is calculated?

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
   xmlns="http://www.w3.org/2000/svg"
   viewBox="0 0 48 48"
   height="48"
   width="48">
  <path
     fill="none"
     d="M0 0h48v48H0z" />
    <path
       d="M 24.320312 3.9550781 C 21.710313 3.9550781 19.509453 5.6350781 18.689453 7.9550781 L 10.320312 7.9550781 C 8.1103138 7.9550781 6.3203125 9.745079 6.3203125 11.955078 L 6.3203125 39.955078 C 6.3203125 42.165078 8.1103138 43.955078 10.320312 43.955078 L 38.320312 43.955078 C 40.530313 43.955078 42.320312 42.165078 42.320312 39.955078 L 42.320312 11.955078 C 42.320312 9.745079 40.530313 7.9550781 38.320312 7.9550781 L 29.949219 7.9550781 C 29.129219 5.6350781 26.930312 3.9550781 24.320312 3.9550781 z M 24.320312 7.9550781 C 25.420313 7.9550781 26.320312 8.8450781 26.320312 9.9550781 C 26.320312 11.065078 25.420313 11.955078 24.320312 11.955078 C 23.220312 11.955078 22.320312 11.065078 22.320312 9.9550781 C 22.320312 8.8450781 23.220313 7.9550781 24.320312 7.9550781 z M 25.53125 13.337891 L 27.794922 15.603516 L 14.994141 28.402344 L 8.59375 22.001953 L 10.857422 19.738281 L 14.994141 23.875 L 25.53125 13.337891 z M 23.130859 24.044922 L 39.130859 24.044922 L 39.130859 27.246094 L 23.130859 27.246094 L 23.130859 24.044922 z M 23.130859 30.445312 L 39.130859 30.445312 L 39.130859 33.646484 L 23.130859 33.646484 L 23.130859 30.445312 z M 23.130859 36.845703 L 34.332031 36.845703 L 34.332031 40.044922 L 23.130859 40.044922 L 23.130859 36.845703 z " />
</svg>

Upvotes: 0

Views: 1259

Answers (1)

Tatarize
Tatarize

Reputation: 10786

Vector asset studio takes that file without complaint. There is no issue.

----- Old Answer -----

The Android SVG -> Vector xml converter is very fragile. I wrote a program (David Android Vector Icon Draw) for android (free on google play) to design android icons directly on the phone just to be sure all my svgs could be made right.

It should have been totally able to load that file and output it to a very gentle android compliant file and even it balked, I'll trouble shoot it after I cook dinner in a bit and get back with a real answer. Generally you're way better off making things the size it wants them and not varying from that form.

I'll make sure to get the converter bit to totally work for whatever the issue is there. But here's your icon either way.

<vector android:height="24dp" android:viewportHeight="48.0"
android:viewportWidth="48.0" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#000000" android:pathData="M24.32,3.95c-2.61,0 -4.81,1.68 -5.63,4h-8.37c-2.21,0 -4,1.79 -4,4v28c0,2.21 1.79,4 4,4h28c2.21,0 4,-1.79 4,-4v-28c0,-2.21 -1.79,-4 -4,-4h-8.37c-0.82,-2.32 -3.02,-4 -5.63,-4zM24.32,7.95c1.1,0 2,0.89 2,2c0,1.11 -0.9,2 -2,2c-1.1,0 -2,-0.89 -2,-2c0,-1.11 0.9,-2 2,-2zM25.53,13.34l2.26,2.27l-12.8,12.8l-6.4,-6.4l2.26,-2.26l4.14,4.14l10.54,-10.54zM23.13,24.05h16v3.2h-16v-3.2zM23.13,30.44h16v3.2h-16v-3.2zM23.13,36.85h11.2v3.2h-11.2v-3.2z"/>

A very general rule to coaxing it to work is to make your SVG sized 24x24 then just getting the path data from the SVG and pasting it into an already working vector file. Then it won't balk at randomish stuff as you never gave it the option to.

Update: I totally checked the original. It looked like it would be fine and tried it and it parsed. My best guess now is that your file name you tried to use had a space in it. Worked perfectly fine.

<vector android:height="24dp" android:viewportHeight="48.0"
android:viewportWidth="48.0" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="#FF000000" android:pathData="M24.32,3.96C21.71,3.96 19.51,5.64 18.69,7.96L10.32,7.96C8.11,7.96 6.32,9.75 6.32,11.96L6.32,39.96C6.32,42.17 8.11,43.96 10.32,43.96L38.32,43.96C40.53,43.96 42.32,42.17 42.32,39.96L42.32,11.96C42.32,9.75 40.53,7.96 38.32,7.96L29.95,7.96C29.13,5.64 26.93,3.96 24.32,3.96zM24.32,7.96C25.42,7.96 26.32,8.85 26.32,9.96C26.32,11.07 25.42,11.96 24.32,11.96C23.22,11.96 22.32,11.07 22.32,9.96C22.32,8.85 23.22,7.96 24.32,7.96zM25.53,13.34L27.79,15.6L14.99,28.4L8.59,22L10.86,19.74L14.99,23.88L25.53,13.34zM23.13,24.04L39.13,24.04L39.13,27.25L23.13,27.25L23.13,24.04zM23.13,30.45L39.13,30.45L39.13,33.65L23.13,33.65L23.13,30.45zM23.13,36.85L34.33,36.85L34.33,40.04L23.13,40.04L23.13,36.85z"/>

Upvotes: 1

Related Questions