mirror of
https://github.com/nicbarker/clay.git
synced 2025-05-12 13:28:07 +00:00
Compare commits
5 Commits
f6ddb261c7
...
d9ad451d3e
| Author | SHA1 | Date | |
|---|---|---|---|
|
d9ad451d3e | ||
|
|
577946a3be | ||
|
|
b58bdd1a1d | ||
|
|
85acb86dbc | ||
|
40ae6d8894 |
@ -23,6 +23,7 @@ if(CLAY_INCLUDE_ALL_EXAMPLES OR CLAY_INCLUDE_DEMOS)
|
||||
if(NOT MSVC)
|
||||
add_subdirectory("examples/clay-official-website")
|
||||
endif()
|
||||
add_subdirectory("examples/cairo-pdf-rendering")
|
||||
add_subdirectory("examples/introducing-clay-video-demo")
|
||||
endif ()
|
||||
|
||||
|
||||
186
clay.h
186
clay.h
@ -16,7 +16,10 @@
|
||||
#include <stdlib.h>
|
||||
#include <string.h>
|
||||
|
||||
#ifdef __aarch64__
|
||||
// SIMD includes on supported platforms
|
||||
#ifdef __x86_64__
|
||||
#include <emmintrin.h>
|
||||
#elif __aarch64__
|
||||
#include <arm_neon.h>
|
||||
#endif
|
||||
|
||||
@ -52,14 +55,10 @@
|
||||
|
||||
#define CLAY_TEXT_CONFIG(...) Clay__StoreTextElementConfig(CLAY__CONFIG_WRAPPER(Clay_TextElementConfig, __VA_ARGS__))
|
||||
|
||||
#define CLAY_BORDER_OUTSIDE(...) { .left = __VA_ARGS__, .right = __VA_ARGS__, .top = __VA_ARGS__, .bottom = __VA_ARGS__ }
|
||||
|
||||
#define CLAY_BORDER_OUTSIDE_RADIUS(width, color, radius) CLAY__INIT(Clay_BorderElementConfig) { .left = { width, color }, .right = { width, color }, .top = { width, color }, .bottom = { width, color }, .cornerRadius = CLAY_CORNER_RADIUS(radius) }
|
||||
#define CLAY_BORDER_OUTSIDE(...) CLAY__CONFIG_WRAPPER(Clay_BorderElementConfig, { .left = __VA_ARGS__, .right = __VA_ARGS__, .top = __VA_ARGS__, .bottom = __VA_ARGS__ })
|
||||
|
||||
#define CLAY_BORDER_ALL(...) Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .borderElementConfig = Clay__StoreBorderElementConfig(CLAY__INIT(Clay_BorderElementConfig) { .left = __VA_ARGS__, .right = __VA_ARGS__, .top = __VA_ARGS__, .bottom = __VA_ARGS__, .betweenChildren = __VA_ARGS__ } ) }, CLAY__ELEMENT_CONFIG_TYPE_BORDER_CONTAINER)
|
||||
|
||||
#define CLAY_BORDER_ALL_RADIUS(width, color, radius) Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .borderElementConfig = Clay__StoreBorderElementConfig(CLAY__INIT(Clay_BorderElementConfig) { .left = { width, color }, .right = { width, color }, .top = { width, color }, .bottom = { width, color }, .betweenChildren = { width, color }, .cornerRadius = CLAY_CORNER_RADIUS(radius)}) }, CLAY__ELEMENT_CONFIG_TYPE_BORDER_CONTAINER)
|
||||
|
||||
#define CLAY_CORNER_RADIUS(radius) (CLAY__INIT(Clay_CornerRadius) { radius, radius, radius, radius })
|
||||
|
||||
#define CLAY_PADDING_ALL(padding) CLAY__CONFIG_WRAPPER(Clay_Padding, { padding, padding, padding, padding })
|
||||
@ -118,7 +117,7 @@ static uint8_t CLAY__ELEMENT_DEFINITION_LATCH;
|
||||
*/
|
||||
#define CLAY(...) \
|
||||
for (\
|
||||
CLAY__ELEMENT_DEFINITION_LATCH = (Clay__OpenElement(), Clay__ConfigureOpenElement(CLAY__INIT(Clay_ElementDeclaration) __VA_ARGS__), 0); \
|
||||
CLAY__ELEMENT_DEFINITION_LATCH = (Clay__OpenElement(), Clay__ConfigureOpenElement(CLAY__CONFIG_WRAPPER(Clay_ElementDeclaration, __VA_ARGS__)), 0); \
|
||||
CLAY__ELEMENT_DEFINITION_LATCH < 1; \
|
||||
++CLAY__ELEMENT_DEFINITION_LATCH, Clay__CloseElement() \
|
||||
)
|
||||
@ -218,6 +217,7 @@ typedef CLAY_PACKED_ENUM {
|
||||
CLAY__ELEMENT_CONFIG_TYPE_IMAGE = 16,
|
||||
CLAY__ELEMENT_CONFIG_TYPE_TEXT = 32,
|
||||
CLAY__ELEMENT_CONFIG_TYPE_CUSTOM = 64,
|
||||
CLAY__ELEMENT_CONFIG_TYPE_SHARED = 128,
|
||||
} Clay__ElementConfigType;
|
||||
|
||||
// Element Configs ---------------------------
|
||||
@ -294,7 +294,6 @@ extern Clay_LayoutConfig CLAY_LAYOUT_DEFAULT;
|
||||
// NOTE: Not declared in the typedef asan ifdef inside macro arguments is UB
|
||||
typedef struct {
|
||||
Clay_Color color;
|
||||
Clay_CornerRadius cornerRadius;
|
||||
#ifdef CLAY_EXTEND_CONFIG_RECTANGLE
|
||||
CLAY_EXTEND_CONFIG_RECTANGLE
|
||||
#endif
|
||||
@ -389,6 +388,13 @@ typedef struct {
|
||||
|
||||
CLAY__WRAPPER_STRUCT(Clay_ScrollElementConfig);
|
||||
|
||||
// Scroll
|
||||
typedef struct {
|
||||
Clay_CornerRadius cornerRadius;
|
||||
} Clay_SharedElementConfig;
|
||||
|
||||
CLAY__WRAPPER_STRUCT(Clay_SharedElementConfig);
|
||||
|
||||
// Border
|
||||
typedef struct {
|
||||
uint32_t width;
|
||||
@ -401,7 +407,6 @@ typedef struct {
|
||||
Clay_Border top;
|
||||
Clay_Border bottom;
|
||||
Clay_Border betweenChildren;
|
||||
Clay_CornerRadius cornerRadius;
|
||||
#ifdef CLAY_EXTEND_CONFIG_BORDER
|
||||
CLAY_EXTEND_CONFIG_BORDER
|
||||
#endif
|
||||
@ -417,6 +422,7 @@ typedef union {
|
||||
Clay_CustomElementConfig *customElementConfig;
|
||||
Clay_ScrollElementConfig *scrollElementConfig;
|
||||
Clay_BorderElementConfig *borderElementConfig;
|
||||
Clay_SharedElementConfig *sharedElementConfig;
|
||||
} Clay_ElementConfigUnion;
|
||||
|
||||
typedef struct {
|
||||
@ -457,7 +463,10 @@ typedef CLAY_PACKED_ENUM {
|
||||
typedef struct {
|
||||
Clay_BoundingBox boundingBox;
|
||||
Clay_ElementConfigUnion config;
|
||||
Clay_StringSlice text; // TODO I wish there was a way to avoid having to have this on every render command
|
||||
union {
|
||||
Clay_StringSlice text; // TODO I wish there was a way to avoid having to have this on every render command
|
||||
Clay_SharedElementConfig *sharedConfig;
|
||||
} textOrSharedConfig;
|
||||
int32_t zIndex;
|
||||
uint32_t id;
|
||||
Clay_RenderCommandType commandType;
|
||||
@ -490,8 +499,11 @@ typedef struct {
|
||||
Clay_CustomElementConfig custom;
|
||||
Clay_ScrollElementConfig scroll;
|
||||
Clay_BorderElementConfig border;
|
||||
Clay_SharedElementConfig shared;
|
||||
} Clay_ElementDeclaration;
|
||||
|
||||
CLAY__WRAPPER_STRUCT(Clay_ElementDeclaration);
|
||||
|
||||
typedef CLAY_PACKED_ENUM {
|
||||
CLAY_ERROR_TYPE_TEXT_MEASUREMENT_FUNCTION_NOT_PROVIDED,
|
||||
CLAY_ERROR_TYPE_ARENA_CAPACITY_EXCEEDED,
|
||||
@ -692,6 +704,7 @@ CLAY__ARRAY_DEFINE(Clay_CustomElementConfig, Clay__CustomElementConfigArray)
|
||||
CLAY__ARRAY_DEFINE(Clay_ScrollElementConfig, Clay__ScrollElementConfigArray)
|
||||
CLAY__ARRAY_DEFINE(Clay_BorderElementConfig, Clay__BorderElementConfigArray)
|
||||
CLAY__ARRAY_DEFINE(Clay_String, Clay__StringArray)
|
||||
CLAY__ARRAY_DEFINE(Clay_SharedElementConfig, Clay__SharedElementConfigArray)
|
||||
CLAY__ARRAY_DEFINE_FUNCTIONS(Clay_RenderCommand, Clay_RenderCommandArray)
|
||||
|
||||
typedef struct {
|
||||
@ -847,6 +860,7 @@ struct Clay_Context {
|
||||
Clay__ScrollElementConfigArray scrollElementConfigs;
|
||||
Clay__CustomElementConfigArray customElementConfigs;
|
||||
Clay__BorderElementConfigArray borderElementConfigs;
|
||||
Clay__SharedElementConfigArray sharedElementConfigs;
|
||||
// Misc Data Structures
|
||||
Clay__StringArray layoutElementIdStrings;
|
||||
Clay__WrappedTextLineArray wrappedTextLines;
|
||||
@ -918,6 +932,7 @@ Clay_FloatingElementConfig * Clay__StoreFloatingElementConfig(Clay_FloatingEleme
|
||||
Clay_CustomElementConfig * Clay__StoreCustomElementConfig(Clay_CustomElementConfig config) { return Clay_GetCurrentContext()->booleanWarnings.maxElementsExceeded ? &Clay_CustomElementConfig_DEFAULT : Clay__CustomElementConfigArray_Add(&Clay_GetCurrentContext()->customElementConfigs, config); }
|
||||
Clay_ScrollElementConfig * Clay__StoreScrollElementConfig(Clay_ScrollElementConfig config) { return Clay_GetCurrentContext()->booleanWarnings.maxElementsExceeded ? &Clay_ScrollElementConfig_DEFAULT : Clay__ScrollElementConfigArray_Add(&Clay_GetCurrentContext()->scrollElementConfigs, config); }
|
||||
Clay_BorderElementConfig * Clay__StoreBorderElementConfig(Clay_BorderElementConfig config) { return Clay_GetCurrentContext()->booleanWarnings.maxElementsExceeded ? &Clay_BorderElementConfig_DEFAULT : Clay__BorderElementConfigArray_Add(&Clay_GetCurrentContext()->borderElementConfigs, config); }
|
||||
Clay_SharedElementConfig * Clay__StoreSharedElementConfig(Clay_SharedElementConfig config) { return Clay_GetCurrentContext()->booleanWarnings.maxElementsExceeded ? &Clay_SharedElementConfig_DEFAULT : Clay__SharedElementConfigArray_Add(&Clay_GetCurrentContext()->sharedElementConfigs, config); }
|
||||
|
||||
Clay_ElementConfig Clay__AttachElementConfig(Clay_ElementConfigUnion config, Clay__ElementConfigType type) {
|
||||
Clay_Context* context = Clay_GetCurrentContext();
|
||||
@ -944,7 +959,7 @@ Clay_ElementConfig Clay__CurrentConfigUnion(Clay__ElementConfigType type) {
|
||||
Clay_Context *context = Clay_GetCurrentContext();
|
||||
Clay_LayoutElement *openElement = Clay__GetOpenLayoutElement();
|
||||
if (Clay__ElementHasConfig(openElement, type)) {
|
||||
return CLAY__INIT(Clay_ElementConfig) { .config = Clay__FindElementConfigWithType(openElement, type), .type = type };
|
||||
return CLAY__INIT(Clay_ElementConfig) { .type = type, .config = Clay__FindElementConfigWithType(openElement, type) };
|
||||
}
|
||||
// Unhandled: structural changes to element
|
||||
switch (type) {
|
||||
@ -952,19 +967,21 @@ Clay_ElementConfig Clay__CurrentConfigUnion(Clay__ElementConfigType type) {
|
||||
return CLAY__INIT(Clay_ElementConfig) CLAY__DEFAULT_STRUCT;
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_RECTANGLE:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .rectangleElementConfig = Clay__RectangleElementConfigArray_Add(&Clay_GetCurrentContext()->rectangleElementConfigs, CLAY__INIT(Clay_RectangleElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_BORDER:
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_TEXT:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .textElementConfig = Clay__TextElementConfigArray_Add(&Clay_GetCurrentContext()->textElementConfigs, CLAY__INIT(Clay_TextElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_FLOATING:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .imageElementConfig = Clay__ImageElementConfigArray_Add(&Clay_GetCurrentContext()->imageElementConfigs, CLAY__INIT(Clay_ImageElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_SCROLL:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .floatingElementConfig = Clay__FloatingElementConfigArray_Add(&Clay_GetCurrentContext()->floatingElementConfigs, CLAY__INIT(Clay_FloatingElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_IMAGE:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .imageElementConfig = Clay__ImageElementConfigArray_Add(&Clay_GetCurrentContext()->imageElementConfigs, CLAY__INIT(Clay_ImageElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_FLOATING:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .floatingElementConfig = Clay__FloatingElementConfigArray_Add(&Clay_GetCurrentContext()->floatingElementConfigs, CLAY__INIT(Clay_FloatingElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_CUSTOM:
|
||||
Clay__int32_tArray_Add(&context->imageElementPointers, context->layoutElements.length - 1);
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .customElementConfig = Clay__CustomElementConfigArray_Add(&Clay_GetCurrentContext()->customElementConfigs, CLAY__INIT(Clay_CustomElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_TEXT:
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_SCROLL:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .scrollElementConfig = Clay__ScrollElementConfigArray_Add(&Clay_GetCurrentContext()->scrollElementConfigs, CLAY__INIT(Clay_ScrollElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_CUSTOM:
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_BORDER:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .borderElementConfig = Clay__BorderElementConfigArray_Add(&Clay_GetCurrentContext()->borderElementConfigs, CLAY__INIT(Clay_BorderElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_SHARED:
|
||||
return Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .sharedElementConfig = Clay__SharedElementConfigArray_Add(&Clay_GetCurrentContext()->sharedElementConfigs, CLAY__INIT(Clay_SharedElementConfig) CLAY__DEFAULT_STRUCT) }, type);
|
||||
}
|
||||
}
|
||||
|
||||
@ -975,6 +992,7 @@ Clay_FloatingElementConfig * Clay_CurrentConfigFloating() { return Clay__Current
|
||||
Clay_CustomElementConfig * Clay_CurrentConfigCustom() { return Clay__CurrentConfigUnion(CLAY__ELEMENT_CONFIG_TYPE_CUSTOM).config.customElementConfig; }
|
||||
Clay_ScrollElementConfig * Clay_CurrentConfigScroll() { return Clay__CurrentConfigUnion(CLAY__ELEMENT_CONFIG_TYPE_SCROLL).config.scrollElementConfig; }
|
||||
Clay_BorderElementConfig * Clay_CurrentConfigBorder() { return Clay__CurrentConfigUnion(CLAY__ELEMENT_CONFIG_TYPE_BORDER).config.borderElementConfig; }
|
||||
Clay_SharedElementConfig * Clay_CurrentConfigShared() { return Clay__CurrentConfigUnion(CLAY__ELEMENT_CONFIG_TYPE_SHARED).config.sharedElementConfig; }
|
||||
|
||||
Clay_ElementId Clay__HashNumber(const uint32_t offset, const uint32_t seed) {
|
||||
uint32_t hash = seed;
|
||||
@ -1040,7 +1058,7 @@ uint32_t Clay__HashTextWithConfig(Clay_String *text, Clay_TextElementConfig *con
|
||||
|
||||
if (config->hashStringContents) {
|
||||
uint32_t maxLengthToHash = CLAY__MIN(text->length, 256);
|
||||
for (int i = 0; i < maxLengthToHash; i++) {
|
||||
for (uint32_t i = 0; i < maxLengthToHash; i++) {
|
||||
hash += text->chars[i];
|
||||
hash += (hash << 10);
|
||||
hash ^= (hash >> 6);
|
||||
@ -1396,33 +1414,14 @@ void Clay__CloseElement(void) {
|
||||
}
|
||||
|
||||
bool Clay__MemCmp(const char *s1, const char *s2, int32_t length);
|
||||
|
||||
#ifdef __x86_64__
|
||||
bool Clay__MemCmp(const char *s1, const char *s2, int32_t length) {
|
||||
for (int32_t i = 0; i < length; i++) {
|
||||
if (s1[i] != s2[i]) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
#elif defined(__aarch64__)
|
||||
bool Clay__MemCmp(const char *s1, const char *s2, int32_t length) {
|
||||
while (length >= 16) {
|
||||
uint8x16_t v1 = vld1q_u8((const uint8_t *)s1);
|
||||
uint8x16_t v2 = vld1q_u8((const uint8_t *)s2);
|
||||
__m128i v1 = _mm_loadu_si128((const __m128i *)s1);
|
||||
__m128i v2 = _mm_loadu_si128((const __m128i *)s2);
|
||||
|
||||
// Compare vectors
|
||||
uint8x16_t cmp = vceqq_u8(v1, v2);
|
||||
uint64_t mask = vgetq_lane_u64(vreinterpretq_u64_u8(cmp), 0) &
|
||||
vgetq_lane_u64(vreinterpretq_u64_u8(cmp), 1);
|
||||
|
||||
if (mask != UINT64_MAX) { // If there's a difference
|
||||
for (int32_t i = 0; i < 16; i++) {
|
||||
if (s1[i] != s2[i]) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (_mm_movemask_epi8(_mm_cmpeq_epi8(v1, v2)) != 0xFFFF) { // If any byte differs
|
||||
return false;
|
||||
}
|
||||
|
||||
s1 += 16;
|
||||
@ -1439,6 +1438,42 @@ bool Clay__MemCmp(const char *s1, const char *s2, int32_t length);
|
||||
s2++;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
#elif defined(__aarch64__)
|
||||
bool Clay__MemCmp(const char *s1, const char *s2, int32_t length) {
|
||||
while (length >= 16) {
|
||||
uint8x16_t v1 = vld1q_u8((const uint8_t *)s1);
|
||||
uint8x16_t v2 = vld1q_u8((const uint8_t *)s2);
|
||||
|
||||
// Compare vectors
|
||||
if (vminvq_u32(vceqq_u8(v1, v2)) != 0xFFFFFFFF) { // If there's a difference
|
||||
return false;
|
||||
}
|
||||
|
||||
s1 += 16;
|
||||
s2 += 16;
|
||||
length -= 16;
|
||||
}
|
||||
|
||||
// Handle remaining bytes
|
||||
while (length--) {
|
||||
if (*s1 != *s2) {
|
||||
return false;
|
||||
}
|
||||
s1++;
|
||||
s2++;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
#else
|
||||
bool Clay__MemCmp(const char *s1, const char *s2, int32_t length) {
|
||||
for (int32_t i = 0; i < length; i++) {
|
||||
if (s1[i] != s2[i]) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
#endif
|
||||
@ -1547,6 +1582,9 @@ void Clay__ConfigureOpenElement(const Clay_ElementDeclaration declaration) {
|
||||
if (!Clay__MemCmp((char *)(&declaration.custom), (char *)(&Clay_CustomElementConfig_DEFAULT), sizeof(Clay_CustomElementConfig))) {
|
||||
Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .customElementConfig = Clay__StoreCustomElementConfig(declaration.custom) }, CLAY__ELEMENT_CONFIG_TYPE_CUSTOM);
|
||||
}
|
||||
if (!Clay__MemCmp((char *)(&declaration.shared), (char *)(&Clay_SharedElementConfig_DEFAULT), sizeof(Clay_SharedElementConfig))) {
|
||||
Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .sharedElementConfig = Clay__StoreSharedElementConfig(declaration.shared) }, CLAY__ELEMENT_CONFIG_TYPE_SHARED);
|
||||
}
|
||||
if (!Clay__MemCmp((char *)(&declaration.scroll), (char *)(&Clay_ScrollElementConfig_DEFAULT), sizeof(Clay_ScrollElementConfig))) {
|
||||
Clay__AttachElementConfig(CLAY__INIT(Clay_ElementConfigUnion) { .scrollElementConfig = Clay__StoreScrollElementConfig(declaration.scroll) }, CLAY__ELEMENT_CONFIG_TYPE_SCROLL);
|
||||
Clay__int32_tArray_Add(&context->openClipElementStack, (int)openLayoutElement->id);
|
||||
@ -1591,6 +1629,7 @@ void Clay__InitializeEphemeralMemory(Clay_Context* context) {
|
||||
context->scrollElementConfigs = Clay__ScrollElementConfigArray_Allocate_Arena(maxElementCount, arena);
|
||||
context->customElementConfigs = Clay__CustomElementConfigArray_Allocate_Arena(maxElementCount, arena);
|
||||
context->borderElementConfigs = Clay__BorderElementConfigArray_Allocate_Arena(maxElementCount, arena);
|
||||
context->sharedElementConfigs = Clay__SharedElementConfigArray_Allocate_Arena(maxElementCount, arena);
|
||||
|
||||
context->layoutElementIdStrings = Clay__StringArray_Allocate_Arena(maxElementCount, arena);
|
||||
context->wrappedTextLines = Clay__WrappedTextLineArray_Allocate_Arena(maxElementCount, arena);
|
||||
@ -2188,6 +2227,7 @@ void Clay__CalculateFinalLayout(void) {
|
||||
Clay_RenderCommand renderCommand = {
|
||||
.boundingBox = currentElementBoundingBox,
|
||||
.config = elementConfig->config,
|
||||
.textOrSharedConfig = { .sharedConfig = Clay__ElementHasConfig(currentElement, CLAY__ELEMENT_CONFIG_TYPE_SHARED) ? Clay__FindElementConfigWithType(currentElement, CLAY__ELEMENT_CONFIG_TYPE_SHARED).sharedElementConfig : &Clay_SharedElementConfig_DEFAULT },
|
||||
.id = currentElement->id,
|
||||
};
|
||||
|
||||
@ -2199,6 +2239,7 @@ void Clay__CalculateFinalLayout(void) {
|
||||
renderCommand.commandType = CLAY_RENDER_COMMAND_TYPE_RECTANGLE;
|
||||
break;
|
||||
}
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_SHARED:
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_BORDER: {
|
||||
shouldRender = false;
|
||||
break;
|
||||
@ -2237,7 +2278,7 @@ void Clay__CalculateFinalLayout(void) {
|
||||
Clay__AddRenderCommand(CLAY__INIT(Clay_RenderCommand) {
|
||||
.boundingBox = { currentElementBoundingBox.x, currentElementBoundingBox.y + yPosition, wrappedLine.dimensions.width, wrappedLine.dimensions.height }, // TODO width
|
||||
.config = configUnion,
|
||||
.text = CLAY__INIT(Clay_StringSlice) { .length = wrappedLine.line.length, .chars = wrappedLine.line.chars, .baseChars = currentElement->childrenOrTextContent.textElementData->text.chars },
|
||||
.textOrSharedConfig = { .text = CLAY__INIT(Clay_StringSlice) { .length = wrappedLine.line.length, .chars = wrappedLine.line.chars, .baseChars = currentElement->childrenOrTextContent.textElementData->text.chars } },
|
||||
.zIndex = root->zIndex,
|
||||
.id = Clay__HashNumber(lineIndex, currentElement->id).id,
|
||||
.commandType = CLAY_RENDER_COMMAND_TYPE_TEXT,
|
||||
@ -2329,10 +2370,12 @@ void Clay__CalculateFinalLayout(void) {
|
||||
|
||||
// Culling - Don't bother to generate render commands for rectangles entirely outside the screen - this won't stop their children from being rendered if they overflow
|
||||
if (!Clay__ElementIsOffscreen(¤tElementBoundingBox)) {
|
||||
Clay_SharedElementConfig *sharedConfig = Clay__ElementHasConfig(currentElement, CLAY__ELEMENT_CONFIG_TYPE_SHARED) ? Clay__FindElementConfigWithType(currentElement, CLAY__ELEMENT_CONFIG_TYPE_SHARED).sharedElementConfig : &Clay_SharedElementConfig_DEFAULT;
|
||||
Clay_BorderElementConfig *borderConfig = Clay__FindElementConfigWithType(currentElement, CLAY__ELEMENT_CONFIG_TYPE_BORDER).borderElementConfig;
|
||||
Clay_RenderCommand renderCommand = {
|
||||
.boundingBox = currentElementBoundingBox,
|
||||
.config = { .borderElementConfig = borderConfig },
|
||||
.textOrSharedConfig = { .sharedConfig = sharedConfig },
|
||||
.id = Clay__RehashWithNumber(currentElement->id, 4),
|
||||
.commandType = CLAY_RENDER_COMMAND_TYPE_BORDER,
|
||||
};
|
||||
@ -2348,6 +2391,7 @@ void Clay__CalculateFinalLayout(void) {
|
||||
Clay__AddRenderCommand(CLAY__INIT(Clay_RenderCommand) {
|
||||
.boundingBox = { currentElementBoundingBox.x + borderOffset.x + scrollOffset.x, currentElementBoundingBox.y + scrollOffset.y, (float)borderConfig->betweenChildren.width, currentElement->dimensions.height },
|
||||
.config = { rectangleConfig },
|
||||
.textOrSharedConfig = { .sharedConfig = sharedConfig },
|
||||
.id = Clay__RehashWithNumber(currentElement->id, 5 + i),
|
||||
.commandType = CLAY_RENDER_COMMAND_TYPE_RECTANGLE,
|
||||
});
|
||||
@ -2361,6 +2405,7 @@ void Clay__CalculateFinalLayout(void) {
|
||||
Clay__AddRenderCommand(CLAY__INIT(Clay_RenderCommand) {
|
||||
.boundingBox = { currentElementBoundingBox.x + scrollOffset.x, currentElementBoundingBox.y + borderOffset.y + scrollOffset.y, currentElement->dimensions.width, (float)borderConfig->betweenChildren.width },
|
||||
.config = { rectangleConfig },
|
||||
.textOrSharedConfig = { .sharedConfig = sharedConfig },
|
||||
.id = Clay__RehashWithNumber(currentElement->id, 5 + i),
|
||||
.commandType = CLAY_RENDER_COMMAND_TYPE_RECTANGLE,
|
||||
});
|
||||
@ -2537,24 +2582,24 @@ Clay__RenderDebugLayoutData Clay__RenderDebugLayoutElementsList(int32_t initialR
|
||||
CLAY({
|
||||
.id = CLAY_IDI("Clay__DebugView_CollapseElement", currentElement->id),
|
||||
.layout = { .sizing = {CLAY_SIZING_FIXED(16), CLAY_SIZING_FIXED(16)}, .childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER} },
|
||||
.border = CLAY_BORDER_OUTSIDE_RADIUS(1, CLAY__DEBUGVIEW_COLOR_3, 4)
|
||||
.border = CLAY_BORDER_OUTSIDE({ 1, CLAY__DEBUGVIEW_COLOR_3 })
|
||||
}) {
|
||||
CLAY_TEXT((currentElementData && currentElementData->debugData->collapsed) ? CLAY_STRING("+") : CLAY_STRING("-"), CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_4, .fontSize = 16 }));
|
||||
}
|
||||
} else { // Square dot for empty containers
|
||||
CLAY({ .layout = { .sizing = {CLAY_SIZING_FIXED(16), CLAY_SIZING_FIXED(16)}, .childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER } } }) {
|
||||
CLAY({ .layout = { .sizing = {CLAY_SIZING_FIXED(8), CLAY_SIZING_FIXED(8)} }, .rectangle = { .color = CLAY__DEBUGVIEW_COLOR_3, .cornerRadius = CLAY_CORNER_RADIUS(2) } }) {}
|
||||
CLAY({ .layout = { .sizing = {CLAY_SIZING_FIXED(8), CLAY_SIZING_FIXED(8)} }, .rectangle = { .color = CLAY__DEBUGVIEW_COLOR_3 }, .shared = { .cornerRadius = CLAY_CORNER_RADIUS(2) } }) {}
|
||||
}
|
||||
}
|
||||
// Collisions and offscreen info
|
||||
if (currentElementData) {
|
||||
if (currentElementData->debugData->collision) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .border = CLAY_BORDER_OUTSIDE_RADIUS(1, (CLAY__INIT(Clay_Color){177, 147, 8, 255}), 4) }) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .border = CLAY_BORDER_OUTSIDE({ 1, (CLAY__INIT(Clay_Color){177, 147, 8, 255}) }) }) {
|
||||
CLAY_TEXT(CLAY_STRING("Duplicate ID"), CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_3, .fontSize = 16 }));
|
||||
}
|
||||
}
|
||||
if (offscreen) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .border = CLAY_BORDER_OUTSIDE_RADIUS(1, CLAY__DEBUGVIEW_COLOR_3, 4) }) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .border = CLAY_BORDER_OUTSIDE({ 1, CLAY__DEBUGVIEW_COLOR_3 }) }) {
|
||||
CLAY_TEXT(CLAY_STRING("Offscreen"), CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_3, .fontSize = 16 }));
|
||||
}
|
||||
}
|
||||
@ -2568,7 +2613,7 @@ Clay__RenderDebugLayoutData Clay__RenderDebugLayoutElementsList(int32_t initialR
|
||||
Clay__DebugElementConfigTypeLabelConfig config = Clay__DebugGetElementConfigTypeLabel(elementConfig->type);
|
||||
Clay_Color backgroundColor = config.color;
|
||||
backgroundColor.a = 90;
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .rectangle = { .color = backgroundColor, .cornerRadius = CLAY_CORNER_RADIUS(4) }, .border = CLAY_BORDER_OUTSIDE_RADIUS(1, config.color, 4) }) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .rectangle = { .color = backgroundColor }, .border = CLAY_BORDER_OUTSIDE({ 1, config.color }), .shared = { .cornerRadius = CLAY_CORNER_RADIUS(4) } }) {
|
||||
CLAY_TEXT(config.label, CLAY_TEXT_CONFIG({ .textColor = offscreen ? CLAY__DEBUGVIEW_COLOR_3 : CLAY__DEBUGVIEW_COLOR_4, .fontSize = 16 }));
|
||||
}
|
||||
}
|
||||
@ -2657,7 +2702,7 @@ void Clay__RenderDebugViewElementConfigHeader(Clay_String elementId, Clay__Eleme
|
||||
Clay_Color backgroundColor = config.color;
|
||||
backgroundColor.a = 90;
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0)}, .padding = CLAY_PADDING_ALL(CLAY__DEBUGVIEW_OUTER_PADDING), .childAlignment = { .y = CLAY_ALIGN_Y_CENTER } } }) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .rectangle = { .color = backgroundColor, .cornerRadius = CLAY_CORNER_RADIUS(4) }, .border = CLAY_BORDER_OUTSIDE_RADIUS(1, config.color, 4) }) {
|
||||
CLAY({ .layout = { .padding = { 8, 8, 2, 2 } }, .rectangle = { .color = backgroundColor }, .border = CLAY_BORDER_OUTSIDE({ 1, config.color }), .shared = { .cornerRadius = CLAY_CORNER_RADIUS(4) }}) {
|
||||
CLAY_TEXT(config.label, CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_4, .fontSize = 16 }));
|
||||
}
|
||||
CLAY({ .layout = { .sizing = { .width = CLAY_SIZING_GROW(0) } } }) {}
|
||||
@ -2677,8 +2722,8 @@ void Clay__RenderDebugViewColor(Clay_Color color, Clay_TextElementConfig *textCo
|
||||
CLAY_TEXT(Clay__IntToString(color.a), textConfig);
|
||||
CLAY_TEXT(CLAY_STRING(" }"), textConfig);
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(10), CLAY__DEFAULT_STRUCT } } }) {}
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8)} }, .border = CLAY_BORDER_OUTSIDE_RADIUS(1, CLAY__DEBUGVIEW_COLOR_4, 4) }) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8)} }, .rectangle = { .color = color, .cornerRadius = CLAY_CORNER_RADIUS(4) } }) {}
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8)} }, .border = CLAY_BORDER_OUTSIDE({ 1, CLAY__DEBUGVIEW_COLOR_4 }) }) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 8)} }, .rectangle = { .color = color }, .shared = { .cornerRadius = CLAY_CORNER_RADIUS(4) } }) {}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -2755,8 +2800,8 @@ void Clay__RenderDebugView(void) {
|
||||
}
|
||||
Clay__RenderDebugLayoutData layoutData = CLAY__DEFAULT_STRUCT;
|
||||
CLAY({ .id = CLAY_ID("Clay__DebugView"),
|
||||
.layout = { .sizing = { CLAY_SIZING_FIXED((float)Clay__debugViewWidth) , CLAY_SIZING_FIXED(context->layoutDimensions.height) }, .layoutDirection = CLAY_TOP_TO_BOTTOM },
|
||||
.floating = { .zIndex = 65000, .parentId = Clay__HashString(CLAY_STRING("Clay__RootContainer"), 0, 0).id, .attachment = { .element = CLAY_ATTACH_POINT_LEFT_CENTER, .parent = CLAY_ATTACH_POINT_RIGHT_CENTER }},
|
||||
.layout = { .sizing = { CLAY_SIZING_FIXED((float)Clay__debugViewWidth) , CLAY_SIZING_FIXED(context->layoutDimensions.height) }, .layoutDirection = CLAY_TOP_TO_BOTTOM },
|
||||
.border = { .bottom = { .width = 1, .color = CLAY__DEBUGVIEW_COLOR_3 }}
|
||||
}) {
|
||||
CLAY({ .layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT)}, .padding = {CLAY__DEBUGVIEW_OUTER_PADDING, CLAY__DEBUGVIEW_OUTER_PADDING }, .childAlignment = {.y = CLAY_ALIGN_Y_CENTER} }, .rectangle = { .color = CLAY__DEBUGVIEW_COLOR_2 } }) {
|
||||
@ -2764,9 +2809,9 @@ void Clay__RenderDebugView(void) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0) } } }) {}
|
||||
// Close button
|
||||
CLAY({
|
||||
.border = CLAY_BORDER_OUTSIDE_RADIUS(1, (CLAY__INIT(Clay_Color){217,91,67,255}), 4),
|
||||
.layout = { .sizing = {CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 10), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 10)}, .childAlignment = {CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER} },
|
||||
.rectangle = { .color = {217,91,67,80} }
|
||||
.layout = { .sizing = {CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 10), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT - 10)}, .childAlignment = {CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER} },
|
||||
.rectangle = { .color = {217,91,67,80} },
|
||||
.border = CLAY_BORDER_OUTSIDE({ 1, (CLAY__INIT(Clay_Color){217,91,67,255}) }),
|
||||
}) {
|
||||
Clay_OnHover(HandleDebugViewCloseButtonInteraction, 0);
|
||||
CLAY_TEXT(CLAY_STRING("x"), CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_4, .fontSize = 16 }));
|
||||
@ -2802,9 +2847,9 @@ void Clay__RenderDebugView(void) {
|
||||
if (context->debugSelectedElementId != 0) {
|
||||
Clay_LayoutElementHashMapItem *selectedItem = Clay__GetHashMapItem(context->debugSelectedElementId);
|
||||
CLAY({
|
||||
.layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(300)}, .layoutDirection = CLAY_TOP_TO_BOTTOM },
|
||||
.rectangle = { .color = CLAY__DEBUGVIEW_COLOR_2 },
|
||||
.scroll = { .vertical = true },
|
||||
.layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(300)}, .layoutDirection = CLAY_TOP_TO_BOTTOM },
|
||||
.rectangle = { .color = CLAY__DEBUGVIEW_COLOR_2 },
|
||||
.border = { .betweenChildren = { .width = 1, .color = CLAY__DEBUGVIEW_COLOR_3 }}
|
||||
}) {
|
||||
CLAY({ .layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT + 8)}, .padding = {CLAY__DEBUGVIEW_OUTER_PADDING, CLAY__DEBUGVIEW_OUTER_PADDING}, .childAlignment = {.y = CLAY_ALIGN_Y_CENTER} } }) {
|
||||
@ -2891,15 +2936,22 @@ void Clay__RenderDebugView(void) {
|
||||
Clay_ElementConfig *elementConfig = Clay__ElementConfigArraySlice_Get(&selectedItem->layoutElement->elementConfigs, elementConfigIndex);
|
||||
Clay__RenderDebugViewElementConfigHeader(selectedItem->elementId.stringId, elementConfig->type);
|
||||
switch (elementConfig->type) {
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_SHARED: {
|
||||
Clay_SharedElementConfig *sharedConfig = elementConfig->config.sharedElementConfig;
|
||||
CLAY({ .layout = { .padding = attributeConfigPadding, .childGap = 8, .layoutDirection = CLAY_TOP_TO_BOTTOM }}) {
|
||||
// .cornerRadius
|
||||
CLAY_TEXT(CLAY_STRING("Color"), infoTitleConfig);
|
||||
Clay__RenderDebugViewCornerRadius(sharedConfig->cornerRadius, infoTextConfig);
|
||||
}
|
||||
break;
|
||||
break;
|
||||
}
|
||||
case CLAY__ELEMENT_CONFIG_TYPE_RECTANGLE: {
|
||||
Clay_RectangleElementConfig *rectangleConfig = elementConfig->config.rectangleElementConfig;
|
||||
CLAY({ .layout = { .padding = attributeConfigPadding, .childGap = 8, .layoutDirection = CLAY_TOP_TO_BOTTOM }}) {
|
||||
// .color
|
||||
CLAY_TEXT(CLAY_STRING("Color"), infoTitleConfig);
|
||||
Clay__RenderDebugViewColor(rectangleConfig->color, infoTextConfig);
|
||||
// .cornerRadius
|
||||
CLAY_TEXT(CLAY_STRING("Corner Radius"), infoTitleConfig);
|
||||
Clay__RenderDebugViewCornerRadius(rectangleConfig->cornerRadius, infoTextConfig);
|
||||
}
|
||||
break;
|
||||
}
|
||||
@ -2947,7 +2999,7 @@ void Clay__RenderDebugView(void) {
|
||||
}
|
||||
// Image Preview
|
||||
CLAY_TEXT(CLAY_STRING("Preview"), infoTitleConfig);
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0, imageConfig->sourceDimensions.width) }}, .image = imageConfig }) {}
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0, imageConfig->sourceDimensions.width) }}, .image = { imageConfig } }) {}
|
||||
}
|
||||
break;
|
||||
}
|
||||
@ -3012,9 +3064,6 @@ void Clay__RenderDebugView(void) {
|
||||
// .betweenChildren
|
||||
CLAY_TEXT(CLAY_STRING("Border Between Children"), infoTitleConfig);
|
||||
Clay__RenderDebugViewBorder(5, borderConfig->betweenChildren, infoTextConfig);
|
||||
// .cornerRadius
|
||||
CLAY_TEXT(CLAY_STRING("Corner Radius"), infoTitleConfig);
|
||||
Clay__RenderDebugViewCornerRadius(borderConfig->cornerRadius, infoTextConfig);
|
||||
}
|
||||
break;
|
||||
}
|
||||
@ -3024,7 +3073,7 @@ void Clay__RenderDebugView(void) {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
CLAY({ .id = CLAY_ID("Clay__DebugViewWarningsScrollPane"), .layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(300)}, .childGap = 6, .layoutDirection = CLAY_TOP_TO_BOTTOM }, .scroll = { .horizontal = true, .vertical = true }, .rectangle = { .color = CLAY__DEBUGVIEW_COLOR_2 } }) {
|
||||
CLAY({ .id = CLAY_ID("Clay__DebugViewWarningsScrollPane"), .layout = { .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(300)}, .childGap = 6, .layoutDirection = CLAY_TOP_TO_BOTTOM }, .rectangle = { .color = CLAY__DEBUGVIEW_COLOR_2 }, .scroll = { .horizontal = true, .vertical = true } }) {
|
||||
Clay_TextElementConfig *warningConfig = CLAY_TEXT_CONFIG({ .textColor = CLAY__DEBUGVIEW_COLOR_4, .fontSize = 16, .wrapMode = CLAY_TEXT_WRAP_NONE });
|
||||
CLAY({ .id = CLAY_ID("Clay__DebugViewWarningItemHeader"), .layout = { .sizing = {.height = CLAY_SIZING_FIXED(CLAY__DEBUGVIEW_ROW_HEIGHT)}, .padding = {CLAY__DEBUGVIEW_OUTER_PADDING, CLAY__DEBUGVIEW_OUTER_PADDING}, .childGap = 8, .childAlignment = {.y = CLAY_ALIGN_Y_CENTER} } }) {
|
||||
CLAY_TEXT(CLAY_STRING("Warnings"), warningConfig);
|
||||
@ -3423,7 +3472,12 @@ Clay_RenderCommandArray Clay_EndLayout(void) {
|
||||
}
|
||||
if (context->booleanWarnings.maxElementsExceeded) {
|
||||
Clay_String message = CLAY_STRING("Clay Error: Layout elements exceeded Clay__maxElementCount");
|
||||
Clay__AddRenderCommand(CLAY__INIT(Clay_RenderCommand ) { .boundingBox = { context->layoutDimensions.width / 2 - 59 * 4, context->layoutDimensions.height / 2, 0, 0 }, .config = { .textElementConfig = &Clay__DebugView_ErrorTextConfig }, .text = CLAY__INIT(Clay_StringSlice) { .length = message.length, .chars = message.chars, .baseChars = message.chars }, .commandType = CLAY_RENDER_COMMAND_TYPE_TEXT });
|
||||
Clay__AddRenderCommand(CLAY__INIT(Clay_RenderCommand ) {
|
||||
.boundingBox = { context->layoutDimensions.width / 2 - 59 * 4, context->layoutDimensions.height / 2, 0, 0 },
|
||||
.config = { .textElementConfig = &Clay__DebugView_ErrorTextConfig },
|
||||
.textOrSharedConfig = { .text = CLAY__INIT(Clay_StringSlice) { .length = message.length, .chars = message.chars, .baseChars = message.chars } },
|
||||
.commandType = CLAY_RENDER_COMMAND_TYPE_TEXT
|
||||
});
|
||||
} else {
|
||||
Clay__CalculateFinalLayout();
|
||||
}
|
||||
|
||||
@ -45,10 +45,10 @@ target_link_libraries(SDL2_video_demo PUBLIC
|
||||
)
|
||||
|
||||
if(MSVC)
|
||||
set(CMAKE_C_FLAGS_DEBUG "/D CLAY_DEBUG")
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
else()
|
||||
set(CMAKE_C_FLAGS_DEBUG "-Wall -Werror -Wno-error=missing-braces -DCLAY_DEBUG")
|
||||
set(CMAKE_C_FLAGS_RELEASE "-O3")
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
endif()
|
||||
|
||||
add_custom_command(
|
||||
|
||||
@ -4,8 +4,8 @@ cmake_minimum_required(VERSION 3.27)
|
||||
project(clay_examples_sdl3_simple_demo C)
|
||||
set(CMAKE_C_STANDARD 99)
|
||||
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG} -g")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE} -O3")
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
|
||||
include(FetchContent)
|
||||
set(FETCHCONTENT_QUIET FALSE)
|
||||
|
||||
@ -4,7 +4,6 @@ set(CMAKE_C_STANDARD 99)
|
||||
|
||||
list(APPEND CMAKE_MODULE_PATH "${CMAKE_CURRENT_SOURCE_DIR}/../../cmake")
|
||||
|
||||
|
||||
add_executable(clay_examples_cairo_pdf_rendering main.c)
|
||||
|
||||
find_package(Cairo REQUIRED)
|
||||
@ -13,8 +12,8 @@ target_compile_options(clay_examples_cairo_pdf_rendering PUBLIC)
|
||||
target_include_directories(clay_examples_cairo_pdf_rendering PUBLIC . ${CAIRO_INCLUDE_DIRS})
|
||||
|
||||
target_link_libraries(clay_examples_cairo_pdf_rendering PUBLIC Cairo::Cairo)
|
||||
set(CMAKE_C_FLAGS_DEBUG "-Wall -Werror -Wno-error=missing-braces")
|
||||
set(CMAKE_C_FLAGS_RELEASE "-O3")
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
|
||||
add_custom_command(
|
||||
TARGET clay_examples_cairo_pdf_rendering POST_BUILD
|
||||
|
||||
@ -37,32 +37,21 @@ void Layout() {
|
||||
static Clay_Color BACKGROUND = { 0xF4, 0xEB, 0xE6, 255 };
|
||||
static Clay_Color ACCENT = { 0xFA, 0xE0, 0xD4, 255 };
|
||||
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) },
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM }),
|
||||
CLAY_RECTANGLE({ .color = BACKGROUND })) {
|
||||
CLAY(CLAY_ID("PageMargins"),
|
||||
CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) },
|
||||
.padding = { 70, 70, 50, 50 }, // Some nice looking page margins
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM,
|
||||
.childGap = 10})) {
|
||||
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) },
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM },
|
||||
.rectangle = { .color = BACKGROUND } }) {
|
||||
CLAY({ .id = CLAY_ID("PageMargins"), .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) },
|
||||
.padding = { 70, 70, 50, 50 }, // Some nice looking page margins
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM,
|
||||
.childGap = 10}
|
||||
}) {
|
||||
// Section Title
|
||||
CLAY(CLAY_TEXT(
|
||||
CLAY_STRING("Features Overview"),
|
||||
CLAY_TEXT_CONFIG({
|
||||
.fontFamily = CLAY_STRING("Calistoga"),
|
||||
.textColor = PRIMARY,
|
||||
.fontSize = 24
|
||||
})
|
||||
));
|
||||
CLAY_TEXT(CLAY_STRING("Features Overview"), CLAY_TEXT_CONFIG({.fontFamily = CLAY_STRING("Calistoga"), .textColor = PRIMARY, .fontSize = 24}));
|
||||
|
||||
// Feature Box
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIT(0) }, .childGap = 10 })) {
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIT(0) }}), CLAY_RECTANGLE({
|
||||
.color = ACCENT,
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(12),
|
||||
})) {
|
||||
CLAY(CLAY_LAYOUT({.padding = CLAY_PADDING_ALL(20), .childGap = 4, .layoutDirection = CLAY_TOP_TO_BOTTOM })) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIT(0) }, .childGap = 10 }}) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIT(0) }}, .rectangle = { .color = ACCENT }, .shared = { .cornerRadius = CLAY_CORNER_RADIUS(12) } }) {
|
||||
CLAY({ .layout = {.padding = CLAY_PADDING_ALL(20), .childGap = 4, .layoutDirection = CLAY_TOP_TO_BOTTOM }}) {
|
||||
CLAY_TEXT(CLAY_STRING("- High performance"),
|
||||
CLAY_TEXT_CONFIG({ .textColor = PRIMARY, .fontSize = 14, .fontFamily = CLAY_STRING("Quicksand SemiBold") }));
|
||||
CLAY_TEXT(CLAY_STRING("- Declarative syntax"),
|
||||
@ -75,29 +64,29 @@ void Layout() {
|
||||
CLAY_TEXT_CONFIG({ .textColor = PRIMARY, .fontSize = 14, .fontFamily = CLAY_STRING("Quicksand SemiBold") }));
|
||||
}
|
||||
}
|
||||
CLAY(CLAY_LAYOUT({
|
||||
CLAY({ .layout = {
|
||||
.sizing = {CLAY_SIZING_FIT(0), CLAY_SIZING_GROW(0)},
|
||||
.padding = CLAY_PADDING_ALL(10),
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM,
|
||||
.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER },
|
||||
.childGap = 4
|
||||
}), CLAY_RECTANGLE({ .color = ACCENT, .cornerRadius = CLAY_CORNER_RADIUS(8) })) {
|
||||
}, .rectangle = { .color = ACCENT }, .shared = {.cornerRadius = CLAY_CORNER_RADIUS(8)}}) {
|
||||
// Profile picture
|
||||
CLAY(CLAY_LAYOUT({
|
||||
CLAY({ .layout = {
|
||||
.sizing = {CLAY_SIZING_FIT(0), CLAY_SIZING_GROW(0)},
|
||||
.padding = { 30, 30, 0, 0 },
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM,
|
||||
.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER }}), CLAY_BORDER_OUTSIDE_RADIUS(2, PRIMARY, 10)) {
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_FIXED(32), CLAY_SIZING_FIXED(32) } }), CLAY_IMAGE({ .sourceDimensions = { 32, 32 }, .path = CLAY_STRING("resources/check.png") }));
|
||||
.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER }}, .border = CLAY_BORDER_OUTSIDE(2, PRIMARY), .shared = { .cornerRadius = 10 }}) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_FIXED(32), CLAY_SIZING_FIXED(32) } }, .image = { .sourceDimensions = { 32, 32 }, .path = CLAY_STRING("resources/check.png") }});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(16) } }));
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_FIXED(16) } }});
|
||||
|
||||
CLAY(CLAY_LAYOUT({ .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) }, .childGap = 10, .layoutDirection = CLAY_TOP_TO_BOTTOM })) {
|
||||
CLAY({ .layout = { .sizing = { CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0) }, .childGap = 10, .layoutDirection = CLAY_TOP_TO_BOTTOM }}) {
|
||||
CLAY_TEXT(CLAY_STRING("Cairo"), CLAY_TEXT_CONFIG({ .fontFamily = CLAY_STRING("Calistoga"), .fontSize = 24, .textColor = PRIMARY }));
|
||||
CLAY(CLAY_LAYOUT({ .padding = CLAY_PADDING_ALL(10) }), CLAY_RECTANGLE({ .color = ACCENT, .cornerRadius = CLAY_CORNER_RADIUS(10) })) {
|
||||
CLAY({ .layout = { .padding = CLAY_PADDING_ALL(10) }, .rectangle = { .color = ACCENT }, .shared = { .cornerRadius = 10 } }) {
|
||||
CLAY_TEXT(CLAY_STRING("Officiis quia quia qui inventore ratione voluptas et. Quidem sunt unde similique. Qui est et exercitationem cumque harum illum. Numquam placeat aliquid quo voluptatem. "
|
||||
"Deleniti saepe nihil exercitationem nemo illo. Consequatur beatae repellat provident similique. Provident qui exercitationem deserunt sapiente. Quam qui dolor corporis odit. "
|
||||
"Assumenda corrupti sunt culpa pariatur. Vero sit ut minima. In est consequatur minus et cum sint illum aperiam. Qui ipsa quas nisi omnis aut quia nobis. "
|
||||
@ -136,11 +125,12 @@ int main(void) {
|
||||
|
||||
uint64_t totalMemorySize = Clay_MinMemorySize();
|
||||
Clay_Arena clayMemory = Clay_CreateArenaWithCapacityAndMemory(totalMemorySize, malloc(totalMemorySize));
|
||||
Clay_SetMeasureTextFunction(Clay_Cairo_MeasureText);
|
||||
|
||||
// We initialize Clay with the same size
|
||||
Clay_Initialize(clayMemory, (Clay_Dimensions) { width, height }, (Clay_ErrorHandler) { HandleClayErrors });
|
||||
|
||||
Clay_SetMeasureTextFunction(Clay_Cairo_MeasureText, 0);
|
||||
|
||||
Clay_BeginLayout();
|
||||
|
||||
// Here you can now create the declarative clay layout.
|
||||
|
||||
@ -7,5 +7,3 @@ add_executable(clay_official_website main.c)
|
||||
|
||||
target_compile_options(clay_official_website PUBLIC -Wall -Werror -Wno-unknown-pragmas -Wno-error=missing-braces)
|
||||
target_include_directories(clay_official_website PUBLIC .)
|
||||
|
||||
set(CMAKE_C_FLAGS_RELEASE "-O3")
|
||||
@ -11,6 +11,6 @@ add_executable(clay_examples_cpp_project_example main.cpp)
|
||||
target_include_directories(clay_examples_cpp_project_example PUBLIC .)
|
||||
|
||||
if(NOT MSVC)
|
||||
set(CMAKE_CXX_FLAGS_DEBUG "-Werror -Wall")
|
||||
set(CMAKE_CXX_FLAGS_RELEASE "-O3")
|
||||
set(CMAKE_CXX_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_CXX_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
endif()
|
||||
|
||||
@ -13,7 +13,7 @@ int main(void) {
|
||||
Clay_Arena clayMemory = Clay_CreateArenaWithCapacityAndMemory(totalMemorySize, (char *)malloc(totalMemorySize));
|
||||
Clay_Initialize(clayMemory, Clay_Dimensions {1024,768}, Clay_ErrorHandler { HandleClayErrors });
|
||||
Clay_BeginLayout();
|
||||
CLAY(CLAY_RECTANGLE({ .color = {255,255,255,0} }), CLAY_LAYOUT(layoutElement)) {
|
||||
CLAY({ .layout = layoutElement, .rectangle = { .color = {255,255,255,0} } }) {
|
||||
CLAY_TEXT(CLAY_STRING(""), CLAY_TEXT_CONFIG({ .fontId = 0 }));
|
||||
}
|
||||
Clay_EndLayout();
|
||||
|
||||
@ -29,7 +29,7 @@ if(MSVC)
|
||||
set(CMAKE_C_FLAGS_DEBUG "/D CLAY_DEBUG")
|
||||
else()
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "-O3")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
endif()
|
||||
|
||||
add_custom_command(
|
||||
|
||||
@ -24,7 +24,7 @@ int main(void) {
|
||||
};
|
||||
SetTextureFilter(Raylib_fonts[FONT_ID_BODY_16].font.texture, TEXTURE_FILTER_BILINEAR);
|
||||
|
||||
ClayVideoDemo_Initialize();
|
||||
ClayVideoDemo_Data data = ClayVideoDemo_Initialize();
|
||||
|
||||
while (!WindowShouldClose()) {
|
||||
// Run once per frame
|
||||
@ -45,11 +45,7 @@ int main(void) {
|
||||
GetFrameTime()
|
||||
);
|
||||
|
||||
Clay_BeginLayout();
|
||||
|
||||
ClayVideoDemo_CreateLayout();
|
||||
|
||||
Clay_RenderCommandArray renderCommands = Clay_EndLayout();
|
||||
Clay_RenderCommandArray renderCommands = ClayVideoDemo_CreateLayout(&data);
|
||||
|
||||
BeginDrawing();
|
||||
ClearBackground(BLACK);
|
||||
|
||||
@ -26,7 +26,7 @@ target_include_directories(clay_examples_raylib_multi_context PUBLIC .)
|
||||
target_link_libraries(clay_examples_raylib_multi_context PUBLIC raylib)
|
||||
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE} -O3")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
|
||||
add_custom_command(
|
||||
TARGET clay_examples_raylib_multi_context POST_BUILD
|
||||
|
||||
@ -25,10 +25,10 @@ target_include_directories(clay_examples_raylib_sidebar_scrolling_container PUBL
|
||||
|
||||
target_link_libraries(clay_examples_raylib_sidebar_scrolling_container PUBLIC raylib)
|
||||
if(MSVC)
|
||||
set(CMAKE_C_FLAGS_DEBUG "/D CLAY_DEBUG")
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
else()
|
||||
set(CMAKE_C_FLAGS_DEBUG "${CMAKE_C_FLAGS_DEBUG}")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE} -O3")
|
||||
set(CMAKE_C_FLAGS_RELEASE "${CMAKE_C_FLAGS_RELEASE}")
|
||||
endif()
|
||||
|
||||
add_custom_command(
|
||||
|
||||
@ -134,7 +134,8 @@ Clay_RenderCommandArray CreateLayout() {
|
||||
}) {
|
||||
CLAY({ .id = CLAY_ID("ScrollBarButton"),
|
||||
.layout = { .sizing = {CLAY_SIZING_FIXED(12), CLAY_SIZING_FIXED((scrollData.scrollContainerDimensions.height / scrollData.contentDimensions.height) * scrollData.scrollContainerDimensions.height) }},
|
||||
.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} }
|
||||
.rectangle = { .color = Clay_PointerOver(Clay__HashString(CLAY_STRING("ScrollBar"), 0, 0)) ? (Clay_Color){100, 100, 140, 150} : (Clay_Color){120, 120, 160, 150} },
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(6) }
|
||||
}) {}
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,8 +9,8 @@ void RenderHeaderButton(Clay_String text) {
|
||||
.layout = { .padding = { 16, 16, 8, 8 }},
|
||||
.rectangle = {
|
||||
.color = { 140, 140, 140, 255 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(5)
|
||||
}
|
||||
},
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(5) }
|
||||
}) {
|
||||
CLAY_TEXT(text, CLAY_TEXT_CONFIG({
|
||||
.fontId = FONT_ID_BODY_16,
|
||||
@ -103,7 +103,6 @@ Clay_RenderCommandArray ClayVideoDemo_CreateLayout(ClayVideoDemo_Data *data) {
|
||||
|
||||
Clay_RectangleElementConfig contentBackgroundConfig = {
|
||||
.color = { 90, 90, 90, 255 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(8)
|
||||
};
|
||||
|
||||
// Build UI here
|
||||
@ -129,15 +128,16 @@ Clay_RenderCommandArray ClayVideoDemo_CreateLayout(ClayVideoDemo_Data *data) {
|
||||
.childAlignment = {
|
||||
.y = CLAY_ALIGN_Y_CENTER
|
||||
}
|
||||
}
|
||||
},
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(8) }
|
||||
}) {
|
||||
// Header buttons go here
|
||||
CLAY({ .id = CLAY_ID("FileButton"),
|
||||
.layout = { .padding = { 16, 16, 8, 8 }},
|
||||
.rectangle ={
|
||||
.color = { 140, 140, 140, 255 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(5)
|
||||
}
|
||||
},
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(5) }
|
||||
}) {
|
||||
CLAY_TEXT(CLAY_STRING("File"), CLAY_TEXT_CONFIG({
|
||||
.fontId = FONT_ID_BODY_16,
|
||||
@ -170,8 +170,8 @@ Clay_RenderCommandArray ClayVideoDemo_CreateLayout(ClayVideoDemo_Data *data) {
|
||||
},
|
||||
.rectangle ={
|
||||
.color = { 40, 40, 40, 255 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(8)
|
||||
}
|
||||
},
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(8) }
|
||||
}) {
|
||||
// Render dropdown items here
|
||||
RenderDropdownMenuItem(CLAY_STRING("New"));
|
||||
@ -217,8 +217,8 @@ Clay_RenderCommandArray ClayVideoDemo_CreateLayout(ClayVideoDemo_Data *data) {
|
||||
.layout = sidebarButtonLayout,
|
||||
.rectangle = {
|
||||
.color = { 120, 120, 120, 255 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(8),
|
||||
}
|
||||
},
|
||||
.shared = { .cornerRadius = CLAY_CORNER_RADIUS(8) }
|
||||
}) {
|
||||
CLAY_TEXT(document.title, CLAY_TEXT_CONFIG({
|
||||
.fontId = FONT_ID_BODY_16,
|
||||
@ -233,11 +233,8 @@ Clay_RenderCommandArray ClayVideoDemo_CreateLayout(ClayVideoDemo_Data *data) {
|
||||
CLAY({ .layout = sidebarButtonLayout }) {
|
||||
Clay_OnHover(HandleSidebarInteraction, (intptr_t)clickData);
|
||||
if (Clay_Hovered()) {
|
||||
Clay_RectangleElementConfig *rectangle = Clay_CurrentConfigRectangle();
|
||||
*rectangle = (Clay_RectangleElementConfig) {
|
||||
.color = { 120, 120, 120, 120 },
|
||||
.cornerRadius = CLAY_CORNER_RADIUS(8)
|
||||
};
|
||||
Clay_CurrentConfigRectangle()->color = (Clay_Color) { 120, 120, 120, 120 };
|
||||
Clay_CurrentConfigShared()->cornerRadius = CLAY_CORNER_RADIUS(8);
|
||||
}
|
||||
CLAY_TEXT(document.title, CLAY_TEXT_CONFIG({
|
||||
.fontId = FONT_ID_BODY_16,
|
||||
|
||||
@ -83,12 +83,12 @@ static inline char *Clay_Cairo__NullTerminate(Clay_String *str) {
|
||||
}
|
||||
|
||||
// Measure text using cairo's *toy* text API.
|
||||
static inline Clay_Dimensions Clay_Cairo_MeasureText(Clay_String *str, Clay_TextElementConfig *config, uintptr_t userData) {
|
||||
static inline Clay_Dimensions Clay_Cairo_MeasureText(Clay_StringSlice str, Clay_TextElementConfig *config, uintptr_t userData) {
|
||||
// Edge case: Clay computes the width of a whitespace character
|
||||
// once. Cairo does not factor in whitespaces when computing text
|
||||
// extents, this edge-case serves as a short-circuit to introduce
|
||||
// (somewhat) sensible values into Clay.
|
||||
if(str->length == 1 && str->chars[0] == ' ') {
|
||||
if(str.length == 1 && str.chars[0] == ' ') {
|
||||
cairo_text_extents_t te;
|
||||
cairo_text_extents(Clay__Cairo, " ", &te);
|
||||
return (Clay_Dimensions) {
|
||||
@ -102,7 +102,8 @@ static inline Clay_Dimensions Clay_Cairo_MeasureText(Clay_String *str, Clay_Text
|
||||
}
|
||||
|
||||
// Ensure string is null-terminated for Cairo
|
||||
char *text = Clay_Cairo__NullTerminate(str);
|
||||
Clay_String toTerminate = (Clay_String){ str.length, str.chars };
|
||||
char *text = Clay_Cairo__NullTerminate(&toTerminate);
|
||||
char *font_family = Clay_Cairo__NullTerminate(&config->fontFamily);
|
||||
|
||||
// Save and reset the Cairo context to avoid unwanted transformations
|
||||
@ -195,6 +196,7 @@ void Clay_Cairo_Render(Clay_RenderCommandArray commands) {
|
||||
cairo_t *cr = Clay__Cairo;
|
||||
for(size_t i = 0; i < commands.length; i++) {
|
||||
Clay_RenderCommand *command = Clay_RenderCommandArray_Get(&commands, i);
|
||||
Clay_CornerRadius cornerRadius = command->textOrSharedConfig.sharedConfig->cornerRadius;
|
||||
|
||||
switch(command->commandType) {
|
||||
case CLAY_RENDER_COMMAND_TYPE_RECTANGLE: {
|
||||
@ -205,21 +207,21 @@ void Clay_Cairo_Render(Clay_RenderCommandArray commands) {
|
||||
cairo_set_source_rgba(cr, CLAY_TO_CAIRO(color));
|
||||
|
||||
cairo_new_sub_path(cr);
|
||||
cairo_arc(cr, bb.x + config->cornerRadius.topLeft,
|
||||
bb.y + config->cornerRadius.topLeft,
|
||||
config->cornerRadius.topLeft,
|
||||
cairo_arc(cr, bb.x + cornerRadius.topLeft,
|
||||
bb.y + cornerRadius.topLeft,
|
||||
cornerRadius.topLeft,
|
||||
M_PI, 3 * M_PI / 2); // 180° to 270°
|
||||
cairo_arc(cr, bb.x + bb.width - config->cornerRadius.topRight,
|
||||
bb.y + config->cornerRadius.topRight,
|
||||
config->cornerRadius.topRight,
|
||||
cairo_arc(cr, bb.x + bb.width - cornerRadius.topRight,
|
||||
bb.y + cornerRadius.topRight,
|
||||
cornerRadius.topRight,
|
||||
3 * M_PI / 2, 2 * M_PI); // 270° to 360°
|
||||
cairo_arc(cr, bb.x + bb.width - config->cornerRadius.bottomRight,
|
||||
bb.y + bb.height - config->cornerRadius.bottomRight,
|
||||
config->cornerRadius.bottomRight,
|
||||
cairo_arc(cr, bb.x + bb.width - cornerRadius.bottomRight,
|
||||
bb.y + bb.height - cornerRadius.bottomRight,
|
||||
cornerRadius.bottomRight,
|
||||
0, M_PI / 2); // 0° to 90°
|
||||
cairo_arc(cr, bb.x + config->cornerRadius.bottomLeft,
|
||||
bb.y + bb.height - config->cornerRadius.bottomLeft,
|
||||
config->cornerRadius.bottomLeft,
|
||||
cairo_arc(cr, bb.x + cornerRadius.bottomLeft,
|
||||
bb.y + bb.height - cornerRadius.bottomLeft,
|
||||
cornerRadius.bottomLeft,
|
||||
M_PI / 2, M_PI); // 90° to 180°
|
||||
cairo_close_path(cr);
|
||||
|
||||
@ -229,7 +231,8 @@ void Clay_Cairo_Render(Clay_RenderCommandArray commands) {
|
||||
case CLAY_RENDER_COMMAND_TYPE_TEXT: {
|
||||
// Cairo expects null terminated strings, we need to clone
|
||||
// to temporarily introduce one.
|
||||
char *text = Clay_Cairo__NullTerminate(&command->text);
|
||||
Clay_String toTerminate = (Clay_String){ command->textOrSharedConfig.text.length, command->textOrSharedConfig.text.chars };
|
||||
char *text = Clay_Cairo__NullTerminate(&toTerminate);
|
||||
char *font_family = Clay_Cairo__NullTerminate(&command->config.textElementConfig->fontFamily);
|
||||
|
||||
Clay_BoundingBox bb = command->boundingBox;
|
||||
@ -252,10 +255,10 @@ void Clay_Cairo_Render(Clay_RenderCommandArray commands) {
|
||||
Clay_BorderElementConfig *config = command->config.borderElementConfig;
|
||||
Clay_BoundingBox bb = command->boundingBox;
|
||||
|
||||
double top_left_radius = config->cornerRadius.topLeft / 2.0;
|
||||
double top_right_radius = config->cornerRadius.topRight / 2.0;
|
||||
double bottom_right_radius = config->cornerRadius.bottomRight / 2.0;
|
||||
double bottom_left_radius = config->cornerRadius.bottomLeft / 2.0;
|
||||
double top_left_radius = cornerRadius.topLeft / 2.0;
|
||||
double top_right_radius = cornerRadius.topRight / 2.0;
|
||||
double bottom_right_radius = cornerRadius.bottomRight / 2.0;
|
||||
double bottom_left_radius = cornerRadius.bottomLeft / 2.0;
|
||||
|
||||
// Draw the top border
|
||||
if (config->top.width > 0) {
|
||||
|
||||
@ -138,7 +138,7 @@ void Clay_Raylib_Render(Clay_RenderCommandArray renderCommands)
|
||||
{
|
||||
case CLAY_RENDER_COMMAND_TYPE_TEXT: {
|
||||
// Raylib uses standard C strings so isn't compatible with cheap slices, we need to clone the string to append null terminator
|
||||
Clay_StringSlice text = renderCommand->text;
|
||||
Clay_StringSlice text = renderCommand->textOrSharedConfig.text;
|
||||
char *cloned = (char *)malloc(text.length + 1);
|
||||
memcpy(cloned, text.chars, text.length);
|
||||
cloned[text.length] = '\0';
|
||||
@ -167,8 +167,9 @@ void Clay_Raylib_Render(Clay_RenderCommandArray renderCommands)
|
||||
}
|
||||
case CLAY_RENDER_COMMAND_TYPE_RECTANGLE: {
|
||||
Clay_RectangleElementConfig *config = renderCommand->config.rectangleElementConfig;
|
||||
if (config->cornerRadius.topLeft > 0) {
|
||||
float radius = (config->cornerRadius.topLeft * 2) / (float)((boundingBox.width > boundingBox.height) ? boundingBox.height : boundingBox.width);
|
||||
Clay_CornerRadius cornerRadius = renderCommand->textOrSharedConfig.sharedConfig->cornerRadius;
|
||||
if (cornerRadius.topLeft > 0) {
|
||||
float radius = (cornerRadius.topLeft * 2) / (float)((boundingBox.width > boundingBox.height) ? boundingBox.height : boundingBox.width);
|
||||
DrawRectangleRounded((Rectangle) { boundingBox.x, boundingBox.y, boundingBox.width, boundingBox.height }, radius, 8, CLAY_COLOR_TO_RAYLIB_COLOR(config->color));
|
||||
} else {
|
||||
DrawRectangle(boundingBox.x, boundingBox.y, boundingBox.width, boundingBox.height, CLAY_COLOR_TO_RAYLIB_COLOR(config->color));
|
||||
@ -177,33 +178,34 @@ void Clay_Raylib_Render(Clay_RenderCommandArray renderCommands)
|
||||
}
|
||||
case CLAY_RENDER_COMMAND_TYPE_BORDER: {
|
||||
Clay_BorderElementConfig *config = renderCommand->config.borderElementConfig;
|
||||
Clay_CornerRadius cornerRadius = renderCommand->textOrSharedConfig.sharedConfig->cornerRadius;
|
||||
// Left border
|
||||
if (config->left.width > 0) {
|
||||
DrawRectangle((int)roundf(boundingBox.x), (int)roundf(boundingBox.y + config->cornerRadius.topLeft), (int)config->left.width, (int)roundf(boundingBox.height - config->cornerRadius.topLeft - config->cornerRadius.bottomLeft), CLAY_COLOR_TO_RAYLIB_COLOR(config->left.color));
|
||||
DrawRectangle((int)roundf(boundingBox.x), (int)roundf(boundingBox.y + cornerRadius.topLeft), (int)config->left.width, (int)roundf(boundingBox.height - cornerRadius.topLeft - cornerRadius.bottomLeft), CLAY_COLOR_TO_RAYLIB_COLOR(config->left.color));
|
||||
}
|
||||
// Right border
|
||||
if (config->right.width > 0) {
|
||||
DrawRectangle((int)roundf(boundingBox.x + boundingBox.width - config->right.width), (int)roundf(boundingBox.y + config->cornerRadius.topRight), (int)config->right.width, (int)roundf(boundingBox.height - config->cornerRadius.topRight - config->cornerRadius.bottomRight), CLAY_COLOR_TO_RAYLIB_COLOR(config->right.color));
|
||||
DrawRectangle((int)roundf(boundingBox.x + boundingBox.width - config->right.width), (int)roundf(boundingBox.y + cornerRadius.topRight), (int)config->right.width, (int)roundf(boundingBox.height - cornerRadius.topRight - cornerRadius.bottomRight), CLAY_COLOR_TO_RAYLIB_COLOR(config->right.color));
|
||||
}
|
||||
// Top border
|
||||
if (config->top.width > 0) {
|
||||
DrawRectangle((int)roundf(boundingBox.x + config->cornerRadius.topLeft), (int)roundf(boundingBox.y), (int)roundf(boundingBox.width - config->cornerRadius.topLeft - config->cornerRadius.topRight), (int)config->top.width, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
DrawRectangle((int)roundf(boundingBox.x + cornerRadius.topLeft), (int)roundf(boundingBox.y), (int)roundf(boundingBox.width - cornerRadius.topLeft - cornerRadius.topRight), (int)config->top.width, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
}
|
||||
// Bottom border
|
||||
if (config->bottom.width > 0) {
|
||||
DrawRectangle((int)roundf(boundingBox.x + config->cornerRadius.bottomLeft), (int)roundf(boundingBox.y + boundingBox.height - config->bottom.width), (int)roundf(boundingBox.width - config->cornerRadius.bottomLeft - config->cornerRadius.bottomRight), (int)config->bottom.width, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
DrawRectangle((int)roundf(boundingBox.x + cornerRadius.bottomLeft), (int)roundf(boundingBox.y + boundingBox.height - config->bottom.width), (int)roundf(boundingBox.width - cornerRadius.bottomLeft - cornerRadius.bottomRight), (int)config->bottom.width, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
}
|
||||
if (config->cornerRadius.topLeft > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + config->cornerRadius.topLeft), roundf(boundingBox.y + config->cornerRadius.topLeft) }, roundf(config->cornerRadius.topLeft - config->top.width), config->cornerRadius.topLeft, 180, 270, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
if (cornerRadius.topLeft > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + cornerRadius.topLeft), roundf(boundingBox.y + cornerRadius.topLeft) }, roundf(cornerRadius.topLeft - config->top.width), cornerRadius.topLeft, 180, 270, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
}
|
||||
if (config->cornerRadius.topRight > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + boundingBox.width - config->cornerRadius.topRight), roundf(boundingBox.y + config->cornerRadius.topRight) }, roundf(config->cornerRadius.topRight - config->top.width), config->cornerRadius.topRight, 270, 360, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
if (cornerRadius.topRight > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + boundingBox.width - cornerRadius.topRight), roundf(boundingBox.y + cornerRadius.topRight) }, roundf(cornerRadius.topRight - config->top.width), cornerRadius.topRight, 270, 360, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->top.color));
|
||||
}
|
||||
if (config->cornerRadius.bottomLeft > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + config->cornerRadius.bottomLeft), roundf(boundingBox.y + boundingBox.height - config->cornerRadius.bottomLeft) }, roundf(config->cornerRadius.bottomLeft - config->top.width), config->cornerRadius.bottomLeft, 90, 180, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
if (cornerRadius.bottomLeft > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + cornerRadius.bottomLeft), roundf(boundingBox.y + boundingBox.height - cornerRadius.bottomLeft) }, roundf(cornerRadius.bottomLeft - config->top.width), cornerRadius.bottomLeft, 90, 180, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
}
|
||||
if (config->cornerRadius.bottomRight > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + boundingBox.width - config->cornerRadius.bottomRight), roundf(boundingBox.y + boundingBox.height - config->cornerRadius.bottomRight) }, roundf(config->cornerRadius.bottomRight - config->bottom.width), config->cornerRadius.bottomRight, 0.1, 90, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
if (cornerRadius.bottomRight > 0) {
|
||||
DrawRing((Vector2) { roundf(boundingBox.x + boundingBox.width - cornerRadius.bottomRight), roundf(boundingBox.y + boundingBox.height - cornerRadius.bottomRight) }, roundf(cornerRadius.bottomRight - config->bottom.width), cornerRadius.bottomRight, 0.1, 90, 10, CLAY_COLOR_TO_RAYLIB_COLOR(config->bottom.color));
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user