mirror of
https://github.com/RGBCube/serenity
synced 2025-07-25 04:27:43 +00:00
LibWeb: Begin formatting the grid
This is a really starter attempt at formatting the grid. It doesn't yet take into account the computed_values of grid-template-rows, nor the values in grid-column-start and like CSS properties. But these changes are a start and make it so the examples in display-grid.html work. To be fleshed out further..
This commit is contained in:
parent
7bb3a8d646
commit
79a630adef
1 changed files with 67 additions and 0 deletions
|
@ -4,6 +4,7 @@
|
|||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
||||
#include <LibWeb/DOM/Node.h>
|
||||
#include <LibWeb/Layout/Box.h>
|
||||
#include <LibWeb/Layout/GridFormattingContext.h>
|
||||
|
||||
|
@ -18,9 +19,75 @@ GridFormattingContext::~GridFormattingContext() = default;
|
|||
|
||||
void GridFormattingContext::run(Box const& box, LayoutMode)
|
||||
{
|
||||
auto should_skip_is_anonymous_text_run = [&](Box& child_box) -> bool {
|
||||
if (child_box.is_anonymous() && !child_box.first_child_of_type<BlockContainer>()) {
|
||||
bool contains_only_white_space = true;
|
||||
child_box.for_each_in_subtree([&](auto const& node) {
|
||||
if (!is<TextNode>(node) || !static_cast<TextNode const&>(node).dom_node().data().is_whitespace()) {
|
||||
contains_only_white_space = false;
|
||||
return IterationDecision::Break;
|
||||
}
|
||||
return IterationDecision::Continue;
|
||||
});
|
||||
if (contains_only_white_space)
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
auto number_of_columns = (int)box.computed_values().grid_template_columns().size();
|
||||
struct GridRow {
|
||||
float height { 0 };
|
||||
Vector<Box&> boxes;
|
||||
};
|
||||
Vector<GridRow> grid_rows;
|
||||
|
||||
auto current_column_count = 0;
|
||||
box.for_each_child_of_type<Box>([&](Box& child_box) {
|
||||
if (should_skip_is_anonymous_text_run(child_box))
|
||||
return IterationDecision::Continue;
|
||||
|
||||
if (current_column_count == 0)
|
||||
grid_rows.append(GridRow());
|
||||
GridRow& grid_row = grid_rows.last();
|
||||
grid_row.boxes.append(child_box);
|
||||
|
||||
auto& child_box_state = m_state.get_mutable(child_box);
|
||||
if (child_box_state.content_height() > grid_row.height)
|
||||
grid_row.height = child_box_state.content_height();
|
||||
(void)layout_inside(child_box, LayoutMode::Normal);
|
||||
if (child_box_state.content_height() > grid_row.height)
|
||||
grid_row.height = child_box_state.content_height();
|
||||
|
||||
current_column_count++;
|
||||
if (current_column_count == number_of_columns)
|
||||
current_column_count = 0;
|
||||
return IterationDecision::Continue;
|
||||
});
|
||||
|
||||
auto& box_state = m_state.get_mutable(box);
|
||||
float current_y_position = 0;
|
||||
current_column_count = 0;
|
||||
for (auto& grid_row : grid_rows) {
|
||||
for (auto& child_box : grid_row.boxes) {
|
||||
if (should_skip_is_anonymous_text_run(child_box))
|
||||
continue;
|
||||
auto& child_box_state = m_state.get_mutable(child_box);
|
||||
|
||||
// FIXME: instead of dividing the parent width equally between the columns, should use
|
||||
// the values in the GridTrackSize objects.
|
||||
child_box_state.set_content_width(box_state.content_width() / number_of_columns);
|
||||
child_box_state.set_content_height(grid_row.height);
|
||||
child_box_state.offset = { current_column_count * (box_state.content_width() / number_of_columns), current_y_position };
|
||||
|
||||
current_column_count++;
|
||||
if (current_column_count == number_of_columns) {
|
||||
current_y_position += grid_row.height;
|
||||
current_column_count = 0;
|
||||
}
|
||||
continue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue