https://kotlinlang.org logo
Join Slack
Powered by
so i got compose web working when rendering on a c...
# compose-web
n
so i got compose web working when rendering on a canvas, but for some reason i cannot get my code to render to the dom, trying to follow https://github.com/JetBrains/compose-jb/tree/master/tutorials/Web/Getting_Started loosely but no matter what i do this gets thrown..
Copy code
CompositionLocal LocalDensity not present
my main function is
Copy code
fun main() {
    renderComposable(rootElementId = "root") {
        console.log("rendering root element")

        Text("Test")
    }
}
and the index.html looks like so
Copy code
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Pentagame</title>
<!--    <script src="skiko.js"> </script>-->
</head>
<body>
    <div id="root"></div>
<!--    <canvas id="ComposeTarget" width="1024" height="720"></canvas>-->
    <script src="app.js"></script>
</body>
</html>
plus one 2
o
Maybe just a wild guess, but what happens if you wrap your 
renderComposable
invocation in this snippet?
Copy code
fun main() {
    document.addEventListener("DOMContentLoaded", {
        // renderComposable
    })
}
n
Wow, is canvas rendering already implemented? 😮
n
its not there yet.. some components will just break when rendering
😢 2
d
Out of curiosity (no expectation of support), I provided a 
LocalDensity
and two other 
Local
requirements that arose; like this:
Copy code
fun main() {
    initLogTags()
    renderComposable(rootElementId = ROOT_DIV_ID) {
        CompositionLocalProvider(
            LocalDensity provides Density(1.0f),
            LocalLayoutDirection provides LayoutDirection.Ltr,
            LocalViewConfiguration provides JsViewConfiguration(Density(1.0f))
        ) {
            ...
        }
    }
}
This resulted in the browser logging, what I interpreted as, an end to the fun:
Copy code
Uncaught ReferenceError: org_jetbrains_skia_Paint__1nMake is not defined
    at Paint_init_$Init$_0 (Paint.kt?3f47:25:27)
    at Paint_init_$Create$_0 (kotlin_org_jetbrains_skiko_skiko.js:10592:12)
    at SkiaBackedPaint_init_$Init$ (SkiaBackedPaint.skiko.kt?31e6:33:61)
    at SkiaBackedPaint_init_$Create$ (kotlin_androidx_compose_ui_ui_graphics.js:14627:12)
    at Paint_0 (SkiaBackedPaint.skiko.kt?31e6:25:29)
    at new Companion_22 (Standard.kt?e25e:158:799)
    at Companion_getInstance_42 (kotlin_androidx_compose_ui_ui.js:21756:7)
    at new InnerPlaceable (InnerPlaceable.kt?ef35:32:1)
    at LayoutNode (LayoutNode.kt?c856:570:62)
    at LayoutNode_init_$Init$ (LayoutNode.kt?c856:68:10)
🤷 Oh well, its interesting to try. This is with a more complex scene though, might pare it back and see if individual Text/Button components etc. render...
...no luck with plain 
Text
or a 
Surface
either.
605 Views
Open in Slack
PreviousNext
Powered by