diff --git a/clay.h b/clay.h index 81e45edc..4405d34c 100644 --- a/clay.h +++ b/clay.h @@ -40,7 +40,7 @@ #define CLAY_RECTANGLE(...) Clay__AttachElementConfig(CLAY__CONFIG_WRAPPER(Clay_ElementConfigUnion, { .rectangleElementConfig = Clay__StoreRectangleElementConfig(CLAY__INIT(Clay_RectangleElementConfig) __VA_ARGS__) }, CLAY__ELEMENT_CONFIG_TYPE_RECTANGLE)) -#define CLAY_TEXT_CONFIG(...) Clay__StoreTextElementConfig(CLAY__INIT(Clay_TextElementConfig) __VA_ARGS__) +#define CLAY_TEXT_CONFIG(...) Clay__StoreTextElementConfig(CLAY__CONFIG_WRAPPER(Clay_TextElementConfig, __VA_ARGS__)) #define CLAY_IMAGE(...) Clay__AttachElementConfig(CLAY__CONFIG_WRAPPER(Clay_ElementConfigUnion, { .imageElementConfig = Clay__StoreImageElementConfig(CLAY__INIT(Clay_ImageElementConfig) __VA_ARGS__) }, CLAY__ELEMENT_CONFIG_TYPE_IMAGE)) @@ -439,6 +439,7 @@ void Clay_UpdateScrollContainers(bool enableDragScrolling, Clay_Vector2 scrollDe void Clay_SetLayoutDimensions(Clay_Dimensions dimensions); void Clay_BeginLayout(); Clay_RenderCommandArray Clay_EndLayout(); +Clay_ElementId Clay_GetElementId(Clay_String idString); bool Clay_Hovered(); void Clay_OnHover(void (*onHoverFunction)(Clay_ElementId elementId, Clay_PointerInfo pointerInfo, intptr_t userData), intptr_t userData); Clay_ScrollContainerData Clay_GetScrollContainerData(Clay_ElementId id); @@ -446,10 +447,9 @@ void Clay_SetMeasureTextFunction(Clay_Dimensions (*measureTextFunction)(Clay_Str Clay_RenderCommand * Clay_RenderCommandArray_Get(Clay_RenderCommandArray* array, int32_t index); void Clay_SetDebugModeEnabled(bool enabled); +// Internal API functions required by macros void Clay__OpenElement(); void Clay__CloseElement(); - -// Internal API functions required by macros Clay_LayoutConfig * Clay__StoreLayoutConfig(Clay_LayoutConfig config); void Clay__ElementPostConfiguration(); void Clay__AttachId(Clay_ElementId id); @@ -2645,10 +2645,6 @@ void Clay__CalculateFinalLayout() { } } -Clay_ElementId Clay_GetElementId(Clay_String idString) { - return Clay__HashString(idString, 0, 0); -} - void Clay__AttachId(Clay_ElementId elementId) { Clay_LayoutElement *openLayoutElement = Clay__GetOpenLayoutElement(); openLayoutElement->id = elementId.id; @@ -3541,6 +3537,11 @@ Clay_RenderCommandArray Clay_EndLayout() return Clay__renderCommands; } +CLAY_WASM_EXPORT("Clay_EndLayout") +Clay_ElementId Clay_GetElementId(Clay_String idString) { + return Clay__HashString(idString, 0, 0); +} + bool Clay_Hovered() { Clay_LayoutElement *openLayoutElement = Clay__GetOpenLayoutElement(); // If the element has no id attached at this point, we need to generate one diff --git a/examples/raylib-sidebar-scrolling-container/main.c b/examples/raylib-sidebar-scrolling-container/main.c index 2a7b81bc..832eb876 100644 --- a/examples/raylib-sidebar-scrolling-container/main.c +++ b/examples/raylib-sidebar-scrolling-container/main.c @@ -24,7 +24,7 @@ void RenderHeaderButton(Clay_String text) { CLAY(CLAY_LAYOUT({ .padding = {16, 8} }), CLAY_RECTANGLE({ .color = Clay_Hovered() ? COLOR_BLUE : COLOR_ORANGE }), Clay_OnHover(HandleHeaderButtonInteraction, 1)) { - CLAY_TEXT(text, &headerTextConfig); + CLAY_TEXT(text, CLAY_TEXT_CONFIG(headerTextConfig)); } } @@ -101,7 +101,7 @@ Clay_RenderCommandArray CreateLayout() { } } - CLAY(CLAY_ID("Blob4Floating2"), CLAY_FLOATING({ .zIndex = 1, .parentId = Clay__HashString(CLAY_STRING("SidebarBlob4"), 0, 0).id })) { + CLAY(CLAY_ID("Blob4Floating2"), CLAY_FLOATING({ .zIndex = 1, .parentId = Clay_GetElementId(CLAY_STRING("SidebarBlob4")).id })) { CLAY(CLAY_ID("ScrollContainer"), CLAY_LAYOUT({ .sizing = { .height = CLAY_SIZING_FIXED(200) }, .childGap = 2 }), CLAY_SCROLL({ .vertical = true })) { CLAY(CLAY_ID("FloatingContainer2"), CLAY_LAYOUT({ }), CLAY_FLOATING({ .zIndex = 1 })) { CLAY(CLAY_ID("FloatingContainerInner"), CLAY_LAYOUT({ .sizing = { .width = CLAY_SIZING_FIXED(300), .height = CLAY_SIZING_FIXED(300) }, .padding = {16, 16} }), CLAY_RECTANGLE({ .color = {140,80, 200, 200} })) { @@ -115,11 +115,21 @@ Clay_RenderCommandArray CreateLayout() { } } } - Clay_ScrollContainerData scrollData = Clay_GetScrollContainerData(Clay__HashString(CLAY_STRING("MainContent"), 0, 0)); + Clay_ScrollContainerData scrollData = Clay_GetScrollContainerData(Clay_GetElementId(CLAY_STRING("MainContent"))); if (scrollData.found) { - CLAY(CLAY_ID("ScrollBar"),CLAY_FLOATING({ .offset = { .y = -(scrollData.scrollPosition->y / scrollData.contentDimensions.height) * scrollData.scrollContainerDimensions.height }, .zIndex = 1, .parentId = Clay__HashString(CLAY_STRING("MainContent"), 0, 0).id, .attachment = {.element = CLAY_ATTACH_POINT_RIGHT_TOP, .parent = CLAY_ATTACH_POINT_RIGHT_TOP} })) { - CLAY(CLAY_ID("ScrollBarButton"), CLAY_LAYOUT({ .sizing = {CLAY_SIZING_FIXED(12), CLAY_SIZING_FIXED((scrollData.scrollContainerDimensions.height / scrollData.contentDimensions.height) * scrollData.scrollContainerDimensions.height) }}), CLAY_RECTANGLE({ .cornerRadius = {6}, .color = Clay_PointerOver(Clay__HashString(CLAY_STRING("ScrollBar"), 0, 0)) ? (Clay_Color){100, 100, 140, 150} : (Clay_Color){120, 120, 160, 150} })) {} - }; + CLAY(CLAY_ID("ScrollBar"), + CLAY_FLOATING({ + .offset = { .y = -(scrollData.scrollPosition->y / scrollData.contentDimensions.height) * scrollData.scrollContainerDimensions.height }, + .zIndex = 1, + .parentId = Clay_GetElementId(CLAY_STRING("MainContent")).id, + .attachment = {.element = CLAY_ATTACH_POINT_RIGHT_TOP, .parent = CLAY_ATTACH_POINT_RIGHT_TOP} + }) + ) { + CLAY(CLAY_ID("ScrollBarButton"), + CLAY_LAYOUT({ .sizing = {CLAY_SIZING_FIXED(12), CLAY_SIZING_FIXED((scrollData.scrollContainerDimensions.height / scrollData.contentDimensions.height) * scrollData.scrollContainerDimensions.height) }}), + CLAY_RECTANGLE({ .cornerRadius = {6}, .color = Clay_PointerOver(Clay__HashString(CLAY_STRING("ScrollBar"), 0, 0)) ? (Clay_Color){100, 100, 140, 150} : (Clay_Color){120, 120, 160, 150} }) + ) {} + } } }; return Clay_EndLayout();