https://kotlinlang.org logo
#compose-web
Title
# compose-web
d

darkmoon_uk

03/02/2023, 1:39 PM
Anyone know how best to load an SVG in Compose for Web (Canvas)? Looking to add it to this canvas of capabilities
🦜 1
d

Dima Avdeev

03/03/2023, 3:52 PM
For now, it's not possible for experimental "Canvas" mode. But, we plan to support Android-like xml vector graphics.
d

darkmoon_uk

03/04/2023, 5:40 AM
Sorry @Dima Avdeev, never tell a developer it's not possible 😅 lol, I couldn't resist poking around and found we can still do this in Canvas mode:
Copy code
val svgDom = remember(bytes) { SVGDOM(data = Data.makeFromBytes(bytes)) }
Canvas(modifier = modifier) {
    svgDom.setContainerSize(size.width,size.height)
    drawIntoCanvas { canvas ->
        svgDom.render(canvas.nativeCanvas)
    }
}
Outcomes: • SVG loaded 🎉 (The bottom-left Kotlin logo) • Code Actually, I did find it a bit hit-and-miss which SVG's can load and not - some show as black mask only, at a quick glance seems to be where SVG style classes(?) are involved?
d

Dima Avdeev

03/04/2023, 7:37 AM
That's amazing!
66 Views