Stumbling through various searches, it's unclear t...

# compose

[Travis Griggs]

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.

[Francesc]

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.

[andrew]

In theory, someone could make an SVG to compose asset parser, wouldn't be too difficult

[Travis Griggs]

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.

[Travis Griggs]

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

[Francesc]

that's the reason (or a reason) they are not natively supported, the SVG spec is huge and too complex for phones

[andrew]

^

[andrew]

In theory though, if anyone wanted to implement a parser, start here and follow it down: https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:compose/[…]in/kotlin/androidx/compose/ui/res/PainterResources.android.kt

[andrew]

They parse and draw the vector drawable manually in compose afaik

[Travis Griggs]

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

[andrew]

Yeah, iOS has a nice rendering system

[andrew]

Crazy to think a lot of that rendering system was based on postscript originally

[Landry Norris]

There is a parser already. There's an Android Studio plugin called SVG to Compose.

[Landry Norris]

You give it a path to a folder with SVGs and a package name, then it generates a folder with compose icons.

[andrew]

Oh yeah, that too

[Landry Norris]

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.

[Albert Chang]

https://plugins.jetbrains.com/plugin/18619-svg-to-compose

[Michael Paus]

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

[Michael Paus]

SVG transcoding may also be of interest: https://github.com/kirill-grouchnikov/aurora#svg-transcoding

[yschimke]

Coil isn't just for remote images. You can load from resources or even write own fetcher.

[Francesc]

Yes, but if you're embedding the image, you might as well convert it to a vector drawable

[Colton Idle]

Yeah. Came here to say AS has bulk import for svg to vector drawable.

[Travis Griggs]

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

[andrew]

Use Figma

[andrew]

Seriously, it's a lifesaver for anything ui design

[Colton Idle]

Yeah. Never had an issue with anything from sketch or figma or illustrator