mod(container/layout): support gap configuration
This commit is contained in:
@@ -23,11 +23,19 @@ pub fn main() !void {
|
||||
defer renderer.deinit();
|
||||
|
||||
var container = try App.Container.init(allocator, .{
|
||||
.border = .{ .color = .green, .corners = .rounded },
|
||||
.border = .{
|
||||
.color = .green,
|
||||
.corners = .rounded,
|
||||
.separator = .{ .enabled = true },
|
||||
},
|
||||
.layout = .{ .gap = 40 },
|
||||
});
|
||||
try container.append(try App.Container.init(allocator, .{
|
||||
.border = .{ .color = .light_green, .corners = .squared },
|
||||
}));
|
||||
try container.append(try App.Container.init(allocator, .{
|
||||
.border = .{ .color = .light_red, .corners = .squared },
|
||||
}));
|
||||
defer container.deinit();
|
||||
|
||||
// NOTE: should the min-size here be required?
|
||||
|
||||
@@ -203,15 +203,27 @@ pub fn Container(comptime Event: type) type {
|
||||
if (this.elements.items.len == 0)
|
||||
break :resize;
|
||||
|
||||
const sides = this.properties.border.sides;
|
||||
const gap = this.properties.layout.gap;
|
||||
const len: u16 = @truncate(this.elements.items.len);
|
||||
const element_cols = @divTrunc(size.cols, len);
|
||||
const element_rows = @divTrunc(size.rows, len);
|
||||
const element_cols = blk: {
|
||||
var cols = size.cols - gap * (len - 1);
|
||||
if (sides.left) cols -= 1;
|
||||
if (sides.right) cols -= 1;
|
||||
break :blk @divTrunc(cols, len);
|
||||
};
|
||||
const element_rows = blk: {
|
||||
var rows = size.rows - gap * (len - 1);
|
||||
if (sides.top) rows -= 1;
|
||||
if (sides.bottom) rows -= 1;
|
||||
break :blk @divTrunc(rows, len);
|
||||
};
|
||||
var offset: u16 = 0;
|
||||
for (this.elements.items) |*element| {
|
||||
var element_size: Size = undefined;
|
||||
switch (this.properties.layout.direction) {
|
||||
.horizontal => {
|
||||
var overflow = size.cols % len;
|
||||
var overflow = size.cols - element_cols * len;
|
||||
// adjust size according to the containing elements
|
||||
var cols = element_cols;
|
||||
if (overflow > 0) {
|
||||
@@ -227,9 +239,10 @@ pub fn Container(comptime Event: type) type {
|
||||
.rows = size.rows,
|
||||
};
|
||||
offset += cols;
|
||||
offset += gap;
|
||||
},
|
||||
.vertical => {
|
||||
var overflow = size.rows % len;
|
||||
var overflow = size.rows - element_rows * len;
|
||||
// adjust size according to the containing elements
|
||||
var rows = element_rows;
|
||||
if (overflow > 0) {
|
||||
@@ -245,11 +258,11 @@ pub fn Container(comptime Event: type) type {
|
||||
.rows = rows,
|
||||
};
|
||||
offset += rows;
|
||||
offset += gap;
|
||||
},
|
||||
}
|
||||
|
||||
// border resizing
|
||||
const sides = this.properties.border.sides;
|
||||
if (sides.top) {
|
||||
element_size.anchor.row += 1;
|
||||
element_size.rows -|= 1;
|
||||
|
||||
Reference in New Issue
Block a user