dergrimm/clay-zig-bindings
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update to clay v0.12

Browse source
This commit is contained in:
johan0A 2024-11-09 16:25:19 +01:00
parent 24124b4245
commit 4667b2771e
4 changed files with 256 additions and 212 deletions
Download patch file Download diff file Expand all files Collapse all files

112
examples/raylib-sidebar-scrolling-container/src/main.zig
View file

@ -6,82 +6,67 @@ const renderer = @import("raylib_render_clay.zig");
const light_grey: cl.Color = .{ 224, 215, 210, 255 };
const red: cl.Color = .{ 168, 66, 28, 255 };
const orange: cl.Color = .{ 225, 138, 50, 255 };
const white: cl.Color = .{ 250, 250, 255, 255 };
const sidebar_item_layout: cl.LayoutConfig = .{
.size = .{
.w = cl.sizingGrow(.{}),
.h = cl.sizingFixed(50),
},
};
const sidebar_item_layout: cl.LayoutConfig = .{ .size = .{ .w = .grow, .h = .fixed(50) } };
fn sidebarItemCompoment(index: usize) void {
cl.rectangle(cl.IDI("SidebarBlob", @intCast(index)), cl.layout(sidebar_item_layout), cl.rectangleConfig(.{ .color = orange }));
defer cl.closeParent();
cl.UI(&.{
.IDI("SidebarBlob", @intCast(index)),
.layout(sidebar_item_layout),
.rectangle(.{ .color = orange }),
});
defer cl.CLOSE();
}
fn createLayout(profile_picture: *const rl.Texture2D) cl.ClayArray(cl.RenderCommand) {
cl.beginLayout();
{
cl.rectangle(
cl.ID("OuterContainer"),
cl.layout(.{
.direction = .LEFT_TO_RIGHT,
.size = .{ .h = cl.sizingGrow(.{}), .w = cl.sizingGrow(.{}) },
.padding = .{ .x = 16, .y = 16 },
cl.UI(&.{
.ID("OuterContainer"),
.layout(.{ .direction = .LEFT_TO_RIGHT, .size = .grow, .padding = .uniform(16), .gap = 16 }),
.rectangle(.{ .color = white }),
});
defer cl.CLOSE();
cl.UI(&.{
.ID("SideBar"),
.layout(.{
.direction = .TOP_TO_BOTTOM,
.size = .{ .h = .grow, .w = .fixed(300) },
.padding = .uniform(16),
.alignment = .{ .x = .CENTER, .y = .TOP },
.gap = 16,
}),
cl.rectangleConfig(.{ .color = .{ 250, 250, 255, 255 } }),
);
defer cl.closeParent();
.rectangle(.{ .color = light_grey }),
});
{
cl.rectangle(
cl.ID("SideBar"),
cl.layout(.{
.direction = .TOP_TO_BOTTOM,
.size = .{ .h = cl.sizingGrow(.{}), .w = cl.sizingFixed(300) },
.padding = .{ .x = 16, .y = 16 },
.alignment = .{ .x = .CENTER, .y = .TOP },
.gap = 16,
}),
cl.rectangleConfig(.{ .color = light_grey }),
);
defer cl.closeParent();
defer cl.CLOSE();
cl.UI(&.{
.ID("ProfilePictureOuter"),
.layout(.{ .size = .{ .w = .grow }, .padding = .uniform(16), .alignment = .{ .y = .CENTER }, .gap = 16 }),
.rectangle(.{ .color = red }),
});
{
cl.rectangle(
cl.ID("ProfilePictureOuter"),
cl.layout(.{
.size = .{ .w = cl.sizingGrow(.{}) },
.padding = .{ .x = 16, .y = 16 },
.alignment = .{ .y = .CENTER },
.gap = 16,
}),
cl.rectangleConfig(.{ .color = red }),
);
defer cl.closeParent();
cl.image(
cl.ID("ProfilePicture"),
cl.layout(.{ .size = .{ .h = cl.sizingFixed(60), .w = cl.sizingFixed(60) } }),
cl.imageConfig(.{ .source_dimensions = .{ .h = 60, .w = 60 }, .image_data = @ptrCast(@constCast(profile_picture)) }),
);
cl.closeParent();
cl.text(cl.ID("profileTitle"), "Clay - UI Library", cl.textConfig(.{ .font_size = 24, .color = light_grey }));
defer cl.CLOSE();
cl.UI(&.{
.ID("ProfilePicture"),
.layout(.{ .size = .{ .h = .fixed(60), .w = .fixed(60) } }),
.image(.{ .source_dimensions = .{ .h = 60, .w = 60 }, .image_data = @ptrCast(profile_picture) }),
});
cl.CLOSE();
cl.text("Clay - UI Library", cl.Config.text(.{ .font_size = 24, .color = light_grey }));
}
for (0..5) |i| {
sidebarItemCompoment(i);
}
}
{
cl.rectangle(
cl.ID("MainContent"),
cl.layout(.{ .size = .{ .h = cl.sizingGrow(.{}), .w = cl.sizingGrow(.{}) } }),
cl.rectangleConfig(.{ .color = light_grey }),
);
defer cl.closeParent();
for (0..5) |i| sidebarItemCompoment(i);
}
cl.UI(&.{
.ID("MainContent"),
.layout(.{ .size = .grow }),
.rectangle(.{ .color = light_grey }),
});
cl.CLOSE();
}
return cl.endLayout();
}
@ -94,14 +79,15 @@ fn loadFont(file_data: ?[]const u8, font_id: u16, font_size: i32) void {
pub fn main() anyerror!void {
const allocator = std.heap.page_allocator;
// init clay
const min_memory_size: u32 = cl.minMemorySize();
const memory = try allocator.alloc(u8, min_memory_size);
defer allocator.free(memory);
const arena: cl.Arena = cl.createArenaWithCapacityAndMemory(min_memory_size, @ptrCast(memory));
cl.initialize(arena, .{ .h = 1000, .w = 1000 });
cl.setMeasureTextFunction(renderer.measureText);
// init raylib
rl.setConfigFlags(.{
.msaa_4x_hint = true,
.vsync_hint = true,
@ -111,11 +97,11 @@ pub fn main() anyerror!void {
rl.initWindow(1000, 1000, "Raylib zig Example");
rl.setTargetFPS(60);
// load assets
loadFont(@embedFile("./resources/Roboto-Regular.ttf"), 0, 100);
const profile_picture = rl.loadTextureFromImage(rl.loadImageFromMemory(".png", @embedFile("./resources/profile-picture.png")));
var debug_mode_enabled = false;
while (!rl.windowShouldClose()) {
if (rl.isKeyPressed(.key_d)) {
debug_mode_enabled = !debug_mode_enabled;