alema/ugui.c3l
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

minor changes

Browse source
This commit is contained in:
Alessandro Mauri 2025-09-06 12:50:36 +02:00
parent 3d7be2a2df
commit 869c7871f9
4 changed files with 80 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

54
lib/ugui.c3l/LAYOUT
View file

@ -85,17 +85,17 @@ layout: the layout direction of the children
COLUMN ROW
+--------------------+ +----------------------------------------------------+
| +----------------+ | |+----------------+ +------------------+|
| | | | || |+------------+| ||
| | | | || || || E3 ||
| | E1 | | || E1 || E2 || ||
| | | | || || || ||
| | | | || |+------------++------------------+|
| +----------------+ | |+----------------+ |
| | | | || |+------------+ |
| | | | || || |+------------------+|
| | E1 | | || E1 || E2 || E3 ||
| | | | || || |+------------------+|
| | | | || |+------------+ |
| +----------------+ | |+----------------+ |
| +------------+ | +----------------------------------------------------+
| | | |
| | E2 | |
| | | |
| | | | (both have center alignment)
| +------------+ |
|+------------------+|
|| ||
@ -218,22 +218,26 @@ at frame end:
Styling
=======
+-----------------------------------------+
| MARGIN |
| |
| +-----------------------------------+ |
| |xxxxxxxxxxx BORDER xxxxxxxxxxxx| |
| |x+-------------------------------+x| |
| |x| PADDING |x| |
| |x| +-----------------------+ |x| |
| |x| | | |x| |
| |x| | CONTENT | |x| |
| |x| +-----------------------+ |x| |
| |x| |x| |
| |x+-------------------------------+x| |
| |xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx| |
| +-----------------------------------+ |
| |
| |
+-----------------------------------------+
The element bounds include the whole CSS box model:
+---------------------------------------------+
| MARGIN |
| +-----------------------------------+ |
| |xxxxxxxxxxx BORDER xxxxxxxxxxxx| |
| |x+-------------------------------+x| |
| |x| PADDING |x| |
| |x| +-----------------------+ |x| |
| |x| | | |x| |
| |x| | CONTENT | |x| |
| |x| | | |x| |
| |x| +-----------------------+ |x| |
| |x| |x| |
| |x+-------------------------------+x| |
| |xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx| |
| +-----------------------------------+ |
| |
+---------------------------------------------+
Styling happens via a .css file, the sizing strictly refers to the content, so if the the user
requests an exact size of 100px*100px the content box will have those dimensions, but the element
bounds will be larger.

4
lib/ugui.c3l/src/ugui_font.c3
View file

@ -404,9 +404,5 @@ fn TextSize? Ctx.measure_string(&ctx, String text)
ts.height.min = bounds.h;
ts.height.max = words * line_height + line_gap * (words-1);
//io::print("'");
//io::print(text);
//io::print("': ");
//io::printn(ts);
return ts;
}

39
lib/ugui.c3l/src/ugui_layout.c3
View file

@ -118,22 +118,25 @@ macro Point Elem.get_view_off(&elem)
// Assign the width and height of an element in the directions that it doesn't need to grow
fn void resolve_dimensions(Elem* e, Elem* p)
{
Layout* el = &e.layout;
Layout* pl = &p.layout;
// ASSIGN WIDTH
switch {
case e.layout.w.@is_exact():
case el.w.@is_exact():
// if width is exact then assign it to the bounds
e.bounds.w = e.layout.total_width().min;
case e.layout.w.@is_grow():
e.bounds.w = el.total_width().min;
case el.w.@is_grow():
// done in another pass
break;
case e.layout.w.@is_fit(): // fit the element's children
Size elem_width = e.layout.w; // the element's content width
Size children_width = e.layout.children.w; // element children (content) width
case el.w.@is_fit(): // fit the element's children
Size elem_width = el.w; // the element's content width
Size children_width = el.children.w; // element children (content) width
Size combined = elem_width.combine(children_width);
if (combined.min <= combined.max) { // OK!
// the final element width is the content width plus padding and border
e.bounds.w = min(elem_width.max, children_width.max) + e.layout.content_offset.x + e.layout.content_offset.w;
e.bounds.w = min(elem_width.max, children_width.max) + el.content_offset.x + el.content_offset.w;
} else {
unreachable("Cannot fit children width: min:%d max:%d", combined.min, combined.max);
}
@ -142,31 +145,31 @@ fn void resolve_dimensions(Elem* e, Elem* p)
// ASSIGN HEIGHT
switch {
case e.layout.h.@is_exact():
case el.h.@is_exact():
// if width is exact then assign it to the bounds and add border and paddign
e.bounds.h = e.layout.total_height().min;
case e.layout.h.@is_grow():
e.bounds.h = el.total_height().min;
case el.h.@is_grow():
break;
// done in another pass
case e.layout.h.@is_fit(): // fit the element's children
Size elem_height = e.layout.h; // the element's content width
Size children_height = e.layout.children.h; // element children (content) width
case el.h.@is_fit(): // fit the element's children
Size elem_height = el.h; // the element's content width
Size children_height = el.children.h; // element children (content) width
Size combined = elem_height.combine(children_height);
if (combined.min <= combined.max) { // OK!
// the final element width is the content width plus padding and border
e.bounds.h = min(elem_height.max, children_height.max) + e.layout.content_offset.y + e.layout.content_offset.h;
e.bounds.h = min(elem_height.max, children_height.max) + el.content_offset.y + el.content_offset.h;
} else {
unreachable("Cannot fit children height: min:%d max:%d", combined.min, combined.max);
}
default: unreachable("width is not exact, grow or fit");
}
switch (p.layout.dir) {
switch (pl.dir) {
case ROW:
if (!e.layout.w.@is_grow()) p.layout.occupied += e.bounds.w;
if (!el.w.@is_grow()) pl.occupied += e.bounds.w;
case COLUMN:
if (!e.layout.h.@is_grow()) p.layout.occupied += e.bounds.h;
if (!el.h.@is_grow()) pl.occupied += e.bounds.h;
}
}
@ -295,8 +298,6 @@ fn void resolve_placement(Elem* c, Elem* p)
pl.origin.y += c.bounds.h;
default: unreachable("unknown layout direction");
}
//sprintln("origin: ", p.layout.origin, " bounds: ", c.bounds);
}
fn void Ctx.layout_element_tree(&ctx)