https://kotlinlang.org logo
t

Travis Griggs

09/02/2022, 6:23 PM
Stumbling through various searches, it's unclear to me what the status of using SVG directly in compose is. 1. Do I need an additional library to do it? or is it part of the stock experience? Is it even possible? 2. It's not obvious (at least to me) how to add an svg file as a resource for the project in Studio. I tried just making an SVG directory under
res
and dragging files into there. But that didn't make R.SVG.resourcename automatically a thing The documenation/posts I do find seem to show some sort of evolution towards more and more supported. I'm just not clear on what the current snapshot is.
f

Francesc

09/02/2022, 6:35 PM
SVGs are not natively supported on Android, you have to import them and convert them to vector drawables (use the "New -> Add Vector Asset" option on the contextual menu for drawable folders).. For remote images, you can use a SVG artifact on Coil to load SVGs.
a

andrew

09/02/2022, 6:43 PM
In theory, someone could make an SVG to compose asset parser, wouldn't be too difficult
t

Travis Griggs

09/02/2022, 6:50 PM
Thanks for clarifying. I have a python script that turns our SVGs into VectorDrawables. It's of course limited. I have to make sure I don't do overly complicated things in the SVGs to have them representable as Drawables. I guess I hoped/thought from what I was seeing that Compose had improved that situation so I could cut out that middle process. Thank you for the replies.
Regarding parser... I personally find SVG parsing to be a #$%#%$!. It's really easy at first, but as you get into more and more and more of the various edge case combinations that SVG can support, it just gets nasty
f

Francesc

09/02/2022, 6:52 PM
that's the reason (or a reason) they are not natively supported, the SVG spec is huge and too complex for phones
a

andrew

09/02/2022, 6:52 PM
^
They parse and draw the vector drawable manually in compose afaik
t

Travis Griggs

09/02/2022, 6:56 PM
iOS can do PDF assets, so we just use batch inkscape to pdf-ize all of our SVGs and they just work like magic in iOS
a

andrew

09/02/2022, 6:58 PM
Yeah, iOS has a nice rendering system
Crazy to think a lot of that rendering system was based on postscript originally
l

Landry Norris

09/02/2022, 10:17 PM
There is a parser already. There's an Android Studio plugin called SVG to Compose.
You give it a path to a folder with SVGs and a package name, then it generates a folder with compose icons.
a

andrew

09/02/2022, 10:19 PM
Oh yeah, that too
l

Landry Norris

09/02/2022, 10:20 PM
They have a kts version as well, but I can never figure out how to run kotlin scripts. It keeps changing when I think I understand it.
m

Michael Paus

09/03/2022, 7:21 AM
Compose for desktop has support for SVG rendering but I have never tried whether that works on Android too. Maybe you can give it a try: https://github.com/JetBrains/compose-jb/tree/master/tutorials/Image_And_Icons_Manipulations
SVG transcoding may also be of interest: https://github.com/kirill-grouchnikov/aurora#svg-transcoding
y

yschimke

09/03/2022, 10:12 AM
Coil isn't just for remote images. You can load from resources or even write own fetcher.
f

Francesc

09/03/2022, 8:15 PM
Yes, but if you're embedding the image, you might as well convert it to a vector drawable
c

Colton Idle

09/04/2022, 11:36 PM
Yeah. Came here to say AS has bulk import for svg to vector drawable.
t

Travis Griggs

09/05/2022, 4:46 PM
The problem with this is that it's not very robust. At least not historically, I may need to recalibrate. But historically, many of the simple icons i drew in inkscape would not import correctly
a

andrew

09/05/2022, 4:47 PM
Use Figma
Seriously, it's a lifesaver for anything ui design
c

Colton Idle

09/05/2022, 8:10 PM
Yeah. Never had an issue with anything from sketch or figma or illustrator
7 Views