fix scolling for nested divs

This commit is contained in:
Alessandro Mauri 2025-10-28 12:56:51 +01:00
parent da001601e5
commit 8e39eee4af
2 changed files with 22 additions and 13 deletions

View File

@ -132,12 +132,6 @@ fn void update_parent_size(Elem* child, Elem* parent)
}
}
fn void update_children_bounds(Elem* child, Elem* parent)
{
if (child.layout.absolute) return;
parent.children_bounds = containing_rect(child.bounds + parent.layout.scroll_offset, parent.bounds);
}
macro Rect Elem.content_bounds(&elem) => elem.bounds.pad(elem.layout.content_offset);
// Assign the width and height of an element in the directions that it doesn't need to grow
@ -295,6 +289,23 @@ fn void resolve_placement(Elem* c, Elem* p)
pl.origin.y += c.bounds.h;
default: unreachable("unknown layout direction");
}
// update the parent children_bounds
// FIXME: this causes scollbars to flicker in/out during resize because the current frames children_bounds are updated
// with the previous' frame child bounds. It would be better to implement another pass during layout.
// FIXME: this long way around to compute the children bounds works and reduces flickering, but it is very ugly
Rect ncb = c.children_bounds;
ncb.x = c.bounds.x;
ncb.y = c.bounds.y;
Rect cb = containing_rect(c.bounds, ncb);
Point o = p.layout.scroll_offset;
p.children_bounds = containing_rect(cb + o, p.children_bounds);
// reset the children bounds
c.children_bounds = {
.x = c.bounds.x,
.y = c.bounds.y
};
}
fn void? Ctx.layout_element_tree(&ctx)
@ -330,10 +341,8 @@ fn void? Ctx.layout_element_tree(&ctx)
Elem* c = ctx.find_elem(ctx.tree.get(ch))!;
if (ctx.tree.is_root(ch)) {
resolve_placement(p, &&{});
update_children_bounds(p, &&{});
} else {
resolve_placement(c, p);
update_children_bounds(c, p);
}
// FIXME: this stuff would be better elsewhere but we are already iteraring through all

View File

@ -105,8 +105,8 @@ fn void? Ctx.div_begin_id(&ctx,
ctx.push_rect(elem.bounds.pad(style.margin), elem.z_index, style)!;
// update the ctx scissor, it HAS to be after drawing the background
ctx.div_scissor = elem.bounds.pad(elem.layout.content_offset);
ctx.push_scissor(elem.bounds.pad(elem.layout.content_offset), elem.z_index)!;
ctx.div_scissor = elem.bounds.pad(elem.layout.content_offset).max({0,0,0,0});
ctx.push_scissor(ctx.div_scissor, elem.z_index)!;
//elem.events = ctx.get_elem_events(elem);
@ -164,7 +164,7 @@ fn Id? Ctx.div_end(&ctx)
// the active_div returns to the parent of the current one
ctx.active_div = ctx.tree.parentof(ctx.active_div)!;
Elem* parent = ctx.get_parent()!;
ctx.div_scissor = parent.bounds.pad(parent.layout.content_offset);
ctx.div_scissor = parent.bounds.pad(parent.layout.content_offset).max({0,0,0,0});
ctx.reset_scissor(elem.z_index)!;
update_parent_size(elem, parent);
@ -236,8 +236,8 @@ fn bool? Ctx.popup_begin_id(&ctx,
ctx.push_rect(elem.bounds.pad(style.margin), elem.z_index, style)!;
// update the ctx scissor, it HAS to be after drawing the background
ctx.div_scissor = elem.bounds.pad(elem.layout.content_offset);
ctx.push_scissor(elem.bounds.pad(elem.layout.content_offset), elem.z_index)!;
ctx.div_scissor = elem.bounds.pad(elem.layout.content_offset).max({0,0,0,0});
ctx.push_scissor(ctx.div_scissor, elem.z_index)!;
//elem.events = ctx.get_elem_events(elem);