11–20 of 95 posts
Just wanted to drop a note - everything following the animation cannot be selected - seems focus is stolen somehow - whenever I try to select text, it immediately deselects it.
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_LAYOUT({ .sizing = { CLAY_SIZING_GROW(), CLAY_SIZING_GROW() }, .childAlignment = {.y = CLAY_ALIGN_Y_CENTER}, .padding = { 32, 32 }, .childGap = 32 }), CLAY_BORDER({ .left = { 2, COLOR_RED }, .right = { 2, COLOR_RED } })) { CLAY(CLAY_ID("LeftText"), CLAY_LAYOUT({ .sizing = { .width = CLAY_SIZING_PERCENT(0.55f) }, .layoutDirection = CLAY_TOP_TO_BOTTOM, .childGap = 8 })) { CLAY_TEXT(CLAY_STRING("Clay is a flex-box style UI auto layout library in C, with declarative syntax and microsecond performance."), CLAY_TEXT_CONFIG({ .fontSize = 56, .fontId = FONT_ID_TITLE_56, .textColor = COLOR_RED })); CLAY(CLAY_ID("LandingPageSpacer"), CLAY_LAYOUT({ .sizing = { .width = CLAY_SIZING_GROW(), .height = CLAY_SIZING_FIXED(32) } })) {} CLAY_TEXT(CLAY_STRING("Clay is laying out this webpage right now!"), CLAY_TEXT_CONFIG({ .fontSize = 36, .fontId = FONT_ID_TITLE_36, .textColor = COLOR_ORANGE })); } CLAY(CLAY_ID("HeroImageOuter"), CLAY_LAYOUT({ .layoutDirection = CLAY_TOP_TO_BOTTOM, .sizing = { .width = CLAY_SIZING_PERCENT(0.45f) }, .childAlignment = { CLAY_ALIGN_X_CENTER }, .childGap = 16 })) { LandingPageBlob(1, 32, COLOR_BLOB_BORDER_5, CLAY_STRING("High performance"), CLAY_STRING("/clay/images/check_5.png")); LandingPageBlob(2, 32, COLOR_BLOB_BORDER_4, CLAY_STRING("Flexbox-style responsive layout"), CLAY_STRING("/clay/images/check_4.png")); LandingPageBlob(3, 32, COLOR_BLOB_BORDER_3, CLAY_STRING("Declarative syntax"), CLAY_STRING("/clay/images/check_3.png")); LandingPageBlob(4, 32, COLOR_BLOB_BORDER_2, CLAY_STRING("Single .h file for C/C++"), CLAY_STRING("/clay/images/check_2.png")); LandingPageBlob(5, 32, COLOR_BLOB_BORDER_1, CLAY_STRING("Compile to 15kb .wasm"), CLAY_STRING("/clay/images/check_1.png")); } } } }
Source: https://github.com/nicbarker/clay/blob/35d72e5fba6872be48d15...
This looks pretty cool, but from the page I can't tell if there's any interactivity supported...there's a button example but it seems to have no click handler? Okay, from the examples there's something like this: if (isMouseDown && !scrollbarData.mouseDown && Clay_PointerOver(Clay_GetElementId(CLAY_STRING("ScrollBar")))) {
Serious 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…
[1] https://docs.oracle.com/javase/7/docs/api/java/awt/GridLayou...
[2] https://github.com/eclipse-platform/eclipse.platform.swt/blo...
[3] https://stackoverflow.com/a/12867862/243613
[4] https://stackoverflow.com/questions/37304684/qwidgetsetlayou...
† Qt actually has a (XML-based, I think) layouting system, but you can also just do stuff in code, which is generally discouraged.
[5] https://gist.github.com/ledongthuc/9686787fe51bbe763fa1e5038...
The d for debugging is so cool. Fantastic library. C is also such a good language. If I wasn't doing Rust, I would have gone back to C.
Wouldn’t you try Zig instead?
Looks very nice, I just watch a great YT video from the developer here https://www.youtube.com/watch?v=DYWTw19_8r4
The developer is rediscovering the concept of a GUI library. The modern variant is the mouse-driven GUI developed by Xerox in the 1970s (and later commercialized by them as Xerox Star) which Jobs famously copied to create Apple’s Lisa, and Gates famously mimicked to create MS Windows. Since they determine the look and feel of a platform and their design determines the ease with which developers can create apps for th…
This library makes use of modern composable components, is declarative driven and not imperative; and doesn't do immediate rendering in all cases.
It can target incredibly different backends, e.g. DOM/canvas/raylib.
All of this in modern C as a `.h` library alone.
These are great features and not just a 'youngster discovers' project.