This is basically what Flutter web is doing - its own canvas, rendering UI, and leveraging Wasm
Clay – UI Layout Library
61–70 of 95 posts
Re: Clay – UI Layout Library
#62Serious question: am I the only one who finds writing a webpage like this to be a little too much (even if the concept is cool): void LandingPageDesktop() { CLAY(CLAY_ID("LandingPage1Desktop"), CLAY_LAYOUT({ .sizing = { .width = CLAY_SIZING_GROW(), .height = CLAY_SIZING_FIT({ .min = windowHeight - 70 }) }, .childAlignment = {.y = CLAY_ALIGN_Y_CENTER}, .padding = { .x = 50 } })) { CLAY(CLAY_ID("LandingPage1"), CLAY_LA…
It's not all that much different than html or even React. You can assign each part to named functions and turn it into something more like this:
LandingPageDesktop(landingPageDesktopId, landingPageDesktopProperties) {
LandingPage(landingPageId, landingPageProperties) {
LeftText() {
etc...
}
}
}
Re: Clay – UI Layout Library
#63Earlier quoted context omitted.
It's not difficult or disorganized to layout GUIs in a programming language. HTML exists as an alternative to having nothing. If you have a programming language you can give the data to the GUI library directly without having to learn a new markup language, have the bloat of a new markup language or learn the quirks a new markup language. You can also put format it and put newlines in there.
The thing is, most GUIs by necessity involve fairly deep hierarchies of graphical objects so you're either going to have deeply nested calls like this, or you're going to scatter the fragments across a number of files in a way that they need to be reassembled in the reader's head in order to understand what's going on.
most GUIs by necessity involve fairly deep hierarchies of graphical objects
First, this isn't really true. You might typically have a window, a container, a layout object and then your gui components.
Second you don't need nested calls, you just add one component to another.
or you're going to scatter the fragments across a number of files
Why would that be true?
they need to be reassembled in the reader's head in order to understand what's going on.
This is a bizarre way to make a GUI let alone thinking it's necessary. Where is this idea coming from?
FLTK, JUCE, Tk, ImGUI, Swing and Qt are not like this at all.
Re: Clay – UI Layout Library
#64Right and middle click on links behaves like a left click on the website.
Re: Clay – UI Layout Library
#65why it's not written in rust?! now every cool kid writes in rust)) Jokes aside this is nice!
Re: Clay – UI Layout Library
#66I'm not a frontend person. Can anyone explain why this is better than using CSS directly or a CSS framework/library? Seems like added complexity when there are already hundreds of CSS frameworks available that seem like they do the same thing.
Re: Clay – UI Layout Library
#67It's a good first draft. I do find it a shame that the HTML output is only div elements. I think a little accessibility would go a long way. I also can't select text in many places before some re-render de-selects before I can hit control-c.
Re: Clay – UI Layout Library
#68I'm not a frontend person. Can anyone explain why this is better than using CSS directly or a CSS framework/library? Seems like added complexity when there are already hundreds of CSS frameworks available that seem like they do the same thing.
Maybe you want the compile some C to wasm and render to canvas.
Then it's pretty neat.
Re: Clay – UI Layout Library
#69Just a funny note—there’s a button at the end to switch between HTML and Canvas. I think it is neat how little difference it makes… normally. But with iOS Safari + Dark Reader, at least on my side, the HTML page is turned into dark mode with Dark Reader, while the canvas page is not. So, it basically ruins the wow factor, haha. But it still looks nice.
It says:
> There's even an HTML renderer - you're looking at it right now!
Jokes on them, I already switched to Canvas renderer when I read it.
Re: Clay – UI Layout Library
#70Right and middle click on links behaves like a left click on the website.
Instant recycle bin.