start of the lib
This commit is contained in:
378
src/main.zig
Normal file
378
src/main.zig
Normal file
@@ -0,0 +1,378 @@
|
||||
const std = @import("std");
|
||||
const rl = @import("rl");
|
||||
const bmb = @import("pandas_ui_lib");
|
||||
|
||||
fn getTextWidth(string: []const u8, font: rl.Font) i32 {
|
||||
var width: c_int = 0;
|
||||
for (string) |char| {
|
||||
width +=
|
||||
@as(c_int, @intFromFloat(font.recs[char - 32].width)) +
|
||||
font.glyphs[char - 32].offsetX;
|
||||
}
|
||||
|
||||
const s = @as([:0]const u8, @ptrCast(string));
|
||||
return @as(bmb.Real, @intCast(rl.measureText(s, @as(i32, @intCast(font.baseSize)))));
|
||||
}
|
||||
|
||||
fn getTextheight(string: []const u8, font: rl.Font) i32 {
|
||||
_ = string;
|
||||
// std.debug.print("font.baseSize : {}\n", .{font.baseSize});
|
||||
return @as(bmb.Real, @intCast(font.baseSize));
|
||||
}
|
||||
|
||||
const TextType = bmb.TextType(rl.Font, getTextWidth, getTextheight);
|
||||
const TextureType = bmb.TextureType(rl.Texture2D);
|
||||
|
||||
const UI = bmb.Bamboo(TextType, TextureType);
|
||||
|
||||
fn sideBar() UI.Node {
|
||||
return UI.Element(.{
|
||||
.name = "sidebar",
|
||||
.rect = .{
|
||||
.h = 20,
|
||||
.w = 40,
|
||||
},
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
.b = 255,
|
||||
},
|
||||
.size_y = .grow,
|
||||
// .size_x = .grow,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
fn button() UI.Node {
|
||||
return UI.Element(.{
|
||||
.name = "button",
|
||||
.rect = .{
|
||||
.h = 20,
|
||||
.w = 60,
|
||||
},
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.g = 255,
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
pub fn main() anyerror!void {
|
||||
// Initialization
|
||||
//--------------------------------------------------------------------------------------
|
||||
const screenWidth = 1920;
|
||||
const screenHeight = 1080;
|
||||
|
||||
rl.initWindow(screenWidth, screenHeight, "raylib-zig [core] example - basic window");
|
||||
defer rl.closeWindow(); // Close window and OpenGL context
|
||||
|
||||
rl.setTargetFPS(60); // Set our game to run at 60 frames-per-second
|
||||
//--------------------------------------------------------------------------------------
|
||||
|
||||
std.debug.print("bmb version :{s}\n", .{bmb.VERSON});
|
||||
|
||||
const child = &[_]UI.Node{
|
||||
sideBar(),
|
||||
button(),
|
||||
UI.Element(.{
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.b = 120,
|
||||
},
|
||||
.padding = .{
|
||||
.bottom = 10,
|
||||
.left = 10,
|
||||
.right = 10,
|
||||
.top = 10,
|
||||
},
|
||||
},
|
||||
.children = &[_]UI.Node{
|
||||
UI.Txt(
|
||||
UI.Text.init(
|
||||
"hello world",
|
||||
try rl.getFontDefault(),
|
||||
.{},
|
||||
),
|
||||
),
|
||||
UI.Txt(
|
||||
UI.Text.init(
|
||||
"hello world again",
|
||||
try rl.getFontDefault(),
|
||||
.{},
|
||||
).setBackground(.{
|
||||
.a = 255,
|
||||
.g = 255,
|
||||
}),
|
||||
),
|
||||
},
|
||||
}),
|
||||
|
||||
UI.Element(.{
|
||||
.name = "child",
|
||||
.style = .{ .background_colour = .{
|
||||
.b = 255,
|
||||
}, .padding = .{ .bottom = 5 } },
|
||||
.children = &[_]UI.Node{
|
||||
UI.Element(.{
|
||||
.name = "branch1",
|
||||
// .rect = .{ .w = 200 },
|
||||
.style = .{
|
||||
.size_x = .grow,
|
||||
.padding = .{
|
||||
.bottom = 5,
|
||||
.left = 5,
|
||||
.top = 5,
|
||||
.right = 5,
|
||||
},
|
||||
// .layout = .right_to_left,
|
||||
.child_gap = 5,
|
||||
},
|
||||
.children = &[_]UI.Node{
|
||||
UI.Element(.{
|
||||
.name = "branch11",
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.g = 128,
|
||||
.b = 128,
|
||||
.r = 128,
|
||||
},
|
||||
.size_x = .grow,
|
||||
},
|
||||
.rect = .{
|
||||
.h = 40,
|
||||
.w = 40,
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch12",
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.g = 128,
|
||||
.r = 128,
|
||||
},
|
||||
.size_x = .grow,
|
||||
},
|
||||
.rect = .{
|
||||
.h = 40,
|
||||
.w = 40,
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch13",
|
||||
.rect = .{
|
||||
.h = 40,
|
||||
.w = 40,
|
||||
},
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.g = 90,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch2",
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
.g = 128,
|
||||
},
|
||||
.layout = .right_to_left,
|
||||
.child_gap = 4,
|
||||
.padding = .{
|
||||
.left = 10,
|
||||
.bottom = 10,
|
||||
.right = 10,
|
||||
.top = 10,
|
||||
},
|
||||
},
|
||||
.children = &[_]UI.Node{
|
||||
UI.Element(.{
|
||||
.name = "branch21",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch22",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 90,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch21",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch22",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 90,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch21",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
UI.Element(.{
|
||||
.name = "branch22",
|
||||
.rect = .{
|
||||
.h = 30,
|
||||
.w = 30,
|
||||
},
|
||||
.style = .{
|
||||
.rounded = 40,
|
||||
.background_colour = .{
|
||||
.r = 90,
|
||||
.b = 150,
|
||||
},
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
},
|
||||
}),
|
||||
button(),
|
||||
};
|
||||
|
||||
const root = UI.Element(.{
|
||||
.name = "root",
|
||||
.pos = .{
|
||||
.x = 0,
|
||||
.y = 0,
|
||||
},
|
||||
.rect = .{
|
||||
.h = screenHeight,
|
||||
.w = screenWidth,
|
||||
},
|
||||
// .on_hover = callback(),
|
||||
// .on_click = callback(),
|
||||
.style = .{
|
||||
.background_colour = .{
|
||||
.r = 255,
|
||||
},
|
||||
.layout = .right_to_left,
|
||||
// .size_x = .fit(),
|
||||
// .size_y = .fixed(),
|
||||
},
|
||||
.children = child,
|
||||
});
|
||||
|
||||
// const arena = [1024]u8{0};
|
||||
|
||||
var al = std.heap.ArenaAllocator.init(std.heap.smp_allocator);
|
||||
|
||||
const sized = try UI.resolveSizing(al.allocator(), root);
|
||||
// UI.printTree(sized);
|
||||
const commands = try UI.getRenderCommands(sized, al.allocator());
|
||||
|
||||
// Main game loop
|
||||
while (!rl.windowShouldClose()) { // Detect window close button or ESC key
|
||||
// Update
|
||||
//----------------------------------------------------------------------------------
|
||||
// TODO: Update your variables here
|
||||
//----------------------------------------------------------------------------------
|
||||
|
||||
// Draw
|
||||
//----------------------------------------------------------------------------------
|
||||
rl.beginDrawing();
|
||||
defer rl.endDrawing();
|
||||
|
||||
for (commands.items) |command| {
|
||||
// std.debug.print("command : {any}\n", .{command});
|
||||
switch (command) {
|
||||
.rect => |r| {
|
||||
if (r.rounding) |rounding| {
|
||||
rl.drawRectangleRounded(
|
||||
rl.Rectangle.init(
|
||||
@as(f32, @floatFromInt(r.pos.x)),
|
||||
@as(f32, @floatFromInt(r.pos.y)),
|
||||
@as(f32, @floatFromInt(r.rect.w)),
|
||||
@as(f32, @floatFromInt(r.rect.h)),
|
||||
),
|
||||
@as(f32, @floatFromInt(rounding)) / 100.0,
|
||||
10,
|
||||
rl.Color.init(
|
||||
r.colour.r,
|
||||
r.colour.g,
|
||||
r.colour.b,
|
||||
r.colour.a,
|
||||
),
|
||||
);
|
||||
} else {
|
||||
rl.drawRectangle(r.pos.x, r.pos.y, r.rect.w, r.rect.h, rl.Color.init(
|
||||
r.colour.r,
|
||||
r.colour.g,
|
||||
r.colour.b,
|
||||
r.colour.a,
|
||||
));
|
||||
}
|
||||
},
|
||||
.text => |t| {
|
||||
const string = @as([:0]const u8, @ptrCast(t.text.string));
|
||||
rl.drawText(string, t.pos.x, t.pos.y, t.text.getTextHeight(), rl.Color.init(
|
||||
t.text.colour.r,
|
||||
t.text.colour.g,
|
||||
t.text.colour.b,
|
||||
t.text.colour.a,
|
||||
));
|
||||
},
|
||||
.texture => continue,
|
||||
}
|
||||
}
|
||||
|
||||
rl.clearBackground(.white);
|
||||
|
||||
// rl.drawRectangle(0, 0, 200, 100, .blue);
|
||||
|
||||
// rl.drawText("Congrats! You created your first window!", 190, 200, 20, .red);
|
||||
|
||||
//----------------------------------------------------------------------------------
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user