Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-10-31 21:30:58 +00:00
Code Issues Projects Releases Packages Wiki Activity
ladybird/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp

1078 lines
48 KiB
C++
Raw Normal View History

LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
/*
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
* Copyright (c) 2021-2022, Andreas Kling <kling@serenityos.org>
Everywhere: Use tobyase@serenityos.org for my copyright headers
2021-08-09 21:28:56 +02:00
* Copyright (c) 2021, Tobias Christiansen <tobyase@serenityos.org>
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
*
Everything: Move to SPDX license identifiers in all files. SPDX License Identifiers are a more compact / standardized way of representing file license information. See: https://spdx.dev/resources/use/#identifiers This was done with the `ambr` search and replace tool. ambr --no-parent-ignore --key-from-file --rep-from-file key.txt rep.txt *
2021-04-22 01:24:48 -07:00
* SPDX-License-Identifier: BSD-2-Clause
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
*/
LibWeb: Flexbox: Use InlineFormattingContext when needed Previously any children would be layout using a BlockFormattingContext. Now we at least differentiate between IFC and BFC if the sizes in question are not constrained by other things.
2021-09-23 14:26:53 +02:00
#include "InlineFormattingContext.h"
LibWeb: Flexbox: Check for relative resolvability on the cross axis If an element has a relative specified length on the cross axis, but in the lineage there are no parents that have any fixed cross size, this would have resulted in a 0 cross size. We now catch that and check whether the relative length would result in an actual definite length if resolved.
2021-10-01 13:43:36 +02:00
#include <AK/Function.h>
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
#include <AK/StdLibExtras.h>
LibWeb: Rename Layout::BlockBox => BlockContainer There's a subtle difference here. A "block box" in the spec is a block-level box, while a "block container" is a box whose children are either all inline-level boxes in an IFC, or all block-level boxes participating in a BFC. Notably, an "inline-block" box is a "block container" but not a "block box" since it is itself inline-level.
2021-10-06 20:02:41 +02:00
#include <LibWeb/Layout/BlockContainer.h>
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
#include <LibWeb/Layout/BlockFormattingContext.h>
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
#include <LibWeb/Layout/Box.h>
#include <LibWeb/Layout/FlexFormattingContext.h>
LibWeb: Rename InitialContainingBlockBox => InitialContainingBlock The "Box" suffix added nothing here.
2021-09-08 11:27:46 +02:00
#include <LibWeb/Layout/InitialContainingBlock.h>
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
#include <LibWeb/Layout/TextNode.h>
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
namespace Web::Layout {
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
static float get_pixel_size(FormattingState const& state, Box const& box, Optional<CSS::LengthPercentage> const& length_percentage)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
LibWeb: Use Optional instead of undefined-lengths for widths/heights
2022-02-18 15:10:11 +00:00
if (!length_percentage.has_value())
return 0;
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto inner_main_size = CSS::Length::make_px(state.get(*box.containing_block()).content_width);
LibWeb: Remove redundant Length::resolved() calls Now that calc() is also resolved in to_px(), code in the form `foo.resolved(bar).to_px(bar)` can be simplified to `foo.to_px(bar)`.
2022-02-18 16:27:28 +00:00
return length_percentage->resolved(box, inner_main_size).to_px(box);
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Use Optional instead of undefined-lengths for widths/heights
2022-02-18 15:10:11 +00:00
static bool is_undefined_or_auto(Optional<CSS::LengthPercentage> const& length_percentage)
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
{
LibWeb: Use Optional instead of undefined-lengths for widths/heights
2022-02-18 15:10:11 +00:00
if (!length_percentage.has_value())
return true;
LibWeb: Remove Length::Type::Undefined! :^)
2022-02-18 16:50:17 +00:00
return length_percentage->is_length() && length_percentage->length().is_auto();
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
FlexFormattingContext::FlexFormattingContext(FormattingState& state, Box const& flex_container, FormattingContext* parent)
LibWeb: Add Layout::FormattingState The purpose of this new object will be to keep track of various states during an ongoing layout. Until now, we've been updating layout tree nodes as we go during layout, which adds an invisible layer of implicit serialization to the whole layout system. My idea with FormattingState is that running layout will produce a result entirely contained within the FormattingState object. At the end of layout, it can then be applied to the layout tree, or simply queried for some metrics we were trying to determine. When doing subtree layouts to determine intrinsic sizes, we will eventually be able to clone the current FormattingState, and run the subtree layout in isolation, opening up opportunities for parallelism. This first patch doesn't go very far though, it merely adds the object as a skeleton class, and makes sure the root BFC has one. :^)
2022-02-19 20:13:47 +01:00
: FormattingContext(Type::Flex, state, flex_container, parent)
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
, m_flex_container_state(m_state.get_mutable(flex_container))
LibWeb: Call the FlexFormattingContext context box "flow_container" This is what the spec calls it and makes the code much less ambiguous.
2021-10-13 19:59:15 +02:00
, m_flex_direction(flex_container.computed_values().flex_direction())
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
{
}
FlexFormattingContext::~FlexFormattingContext()
{
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::run(Box const& run_box, LayoutMode)
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
{
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
VERIFY(&run_box == &flex_container());
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// This implements https://www.w3.org/TR/css-flexbox-1/#layout-algorithm
// FIXME: Implement reverse and ordering.
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
// 1. Generate anonymous flex items
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
generate_anonymous_flex_items();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 2. Determine the available main and cross space for the flex items
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
float main_max_size = NumericLimits<float>::max();
float main_min_size = 0;
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
float cross_max_size = NumericLimits<float>::max();
float cross_min_size = 0;
bool main_is_constrained = false;
bool cross_is_constrained = false;
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
determine_available_main_and_cross_space(main_is_constrained, cross_is_constrained, main_min_size, main_max_size, cross_min_size, cross_max_size);
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 3. Determine the flex base size and hypothetical main size of each item
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_item : m_flex_items) {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
determine_flex_base_size_and_hypothetical_main_size(flex_item);
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
}
// 4. Determine the main size of the flex container
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
determine_main_size_of_flex_container(main_is_constrained, main_min_size, main_max_size);
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 5. Collect flex items into flex lines:
// After this step no additional items are to be added to flex_lines or any of its items!
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
collect_flex_items_into_flex_lines();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
// 6. Resolve the flexible lengths
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
resolve_flexible_lengths();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// Cross Size Determination
// 7. Determine the hypothetical cross size of each item
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_item : m_flex_items) {
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
determine_hypothetical_cross_size_of_item(flex_item);
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
}
// 8. Calculate the cross size of each flex line.
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
calculate_cross_size_of_each_flex_line(cross_min_size, cross_max_size);
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 9. Handle 'align-content: stretch'.
// FIXME: This
// 10. Collapse visibility:collapse items.
// FIXME: This
// 11. Determine the used cross size of each flex item.
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
determine_used_cross_size_of_each_flex_item();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 12. Distribute any remaining free space.
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
distribute_any_remaining_free_space();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 13. Resolve cross-axis auto margins.
// FIXME: This
// 14. Align all flex items along the cross-axis
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
align_all_flex_items_along_the_cross_axis();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
// 15. Determine the flex container’s used cross size:
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
determine_flex_container_used_cross_size(cross_min_size, cross_max_size);
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
LibWeb: Move FFC layout algorithm step 16 to a separate function
2021-10-13 22:25:39 +02:00
// 16. Align all flex lines (per align-content)
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
align_all_flex_lines();
LibWeb: Layout inside of flex items at the end of FFC layout Instead of doing internal child layout incrementally as we go, save it for the end of flex layout. The code will become simpler if we can focus on simply computing the dimensions of each flex item while we're doing the main FFC algorithm.
2022-02-27 10:01:38 +01:00
// AD-HOC: Layout the inside of all flex items.
LibWeb: Fix flex line alignment in single-line flex containers For single-line flex containers, center the only flex line along the cross axis. Alignment of multi-line flex containers are left as a FIXME. This patch also moves out the assignment of final metrics to the FormattingState from align_all_flex_lines() to a separate function.
2022-02-27 23:58:54 +01:00
copy_dimensions_from_flex_items_to_boxes();
LibWeb: Layout inside of flex items at the end of FFC layout Instead of doing internal child layout incrementally as we go, save it for the end of flex layout. The code will become simpler if we can focus on simply computing the dimensions of each flex item while we're doing the main FFC algorithm.
2022-02-27 10:01:38 +01:00
for (auto& flex_item : m_flex_items) {
auto independent_formatting_context = layout_inside(flex_item.box, LayoutMode::Default);
independent_formatting_context->parent_context_did_dimension_child_root_box();
}
LibWeb: Fix flex line alignment in single-line flex containers For single-line flex containers, center the only flex line along the cross axis. Alignment of multi-line flex containers are left as a FIXME. This patch also moves out the assignment of final metrics to the FormattingState from align_all_flex_lines() to a separate function.
2022-02-27 23:58:54 +01:00
// FIXME: We run the "copy dimensions" step *again* here, in order to override any sizes
LibWeb: Layout inside of flex items at the end of FFC layout Instead of doing internal child layout incrementally as we go, save it for the end of flex layout. The code will become simpler if we can focus on simply computing the dimensions of each flex item while we're doing the main FFC algorithm.
2022-02-27 10:01:38 +01:00
// assigned to the flex item by the "layout inside" step above. This is definitely not
// part of the spec, and simply covering up the fact that our inside layout currently
// mutates the height of BFC roots.
LibWeb: Fix flex line alignment in single-line flex containers For single-line flex containers, center the only flex line along the cross axis. Alignment of multi-line flex containers are left as a FIXME. This patch also moves out the assignment of final metrics to the FormattingState from align_all_flex_lines() to a separate function.
2022-02-27 23:58:54 +01:00
copy_dimensions_from_flex_items_to_boxes();
LibWeb: Implement FlexBox Layout Algorithm
2021-05-31 12:54:06 +02:00
}
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
void FlexFormattingContext::populate_specified_margins(FlexItem& item, CSS::FlexDirection flex_direction) const
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
{
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto width_of_containing_block = m_state.get(*item.box.containing_block()).content_width;
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
auto width_of_containing_block_as_length = CSS::Length::make_px(width_of_containing_block);
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
// FIXME: This should also take reverse-ness into account
if (flex_direction == CSS::FlexDirection::Row || flex_direction == CSS::FlexDirection::RowReverse) {
LibWeb: Remove redundant Length::resolved() calls Now that calc() is also resolved in to_px(), code in the form `foo.resolved(bar).to_px(bar)` can be simplified to `foo.to_px(bar)`.
2022-02-18 16:27:28 +00:00
item.margins.main_before = item.box.computed_values().margin().left.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.main_after = item.box.computed_values().margin().right.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.cross_before = item.box.computed_values().margin().top.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.cross_after = item.box.computed_values().margin().bottom.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
} else {
LibWeb: Remove redundant Length::resolved() calls Now that calc() is also resolved in to_px(), code in the form `foo.resolved(bar).to_px(bar)` can be simplified to `foo.to_px(bar)`.
2022-02-18 16:27:28 +00:00
item.margins.main_before = item.box.computed_values().margin().top.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.main_after = item.box.computed_values().margin().bottom.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.cross_before = item.box.computed_values().margin().left.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
item.margins.cross_after = item.box.computed_values().margin().right.resolved(item.box, width_of_containing_block_as_length).to_px(item.box);
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
}
};
// https://www.w3.org/TR/css-flexbox-1/#flex-items
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::generate_anonymous_flex_items()
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
{
// More like, sift through the already generated items.
// After this step no items are to be added or removed from flex_items!
// It holds every item we need to consider and there should be nothing in the following
// calculations that could change that.
// This is particularly important since we take references to the items stored in flex_items
// later, whose addresses won't be stable if we added or removed any items.
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
flex_container().for_each_child_of_type<Box>([&](Box& child_box) {
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
// Skip anonymous text runs that are only whitespace.
if (child_box.is_anonymous() && !child_box.first_child_of_type<BlockContainer>()) {
bool contains_only_white_space = true;
child_box.for_each_in_inclusive_subtree_of_type<TextNode>([&contains_only_white_space](auto& text_node) {
LibWeb: Avoid unnecessary layout_inside() in FFC step 1 We don't need to perform inside layout here. The only information we need in this step is whether an anonymous block container has nothing but empty-or-whitespace text children. This information is already accurate after the initial layout tree construction. Performing a layout does not change the answer. It does however have many other side effects, so let's defer those.
2022-02-27 09:47:01 +01:00
if (!text_node.dom_node().data().is_whitespace()) {
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
contains_only_white_space = false;
return IterationDecision::Break;
}
return IterationDecision::Continue;
});
if (contains_only_white_space)
return IterationDecision::Continue;
}
// Skip any "out-of-flow" children
if (child_box.is_out_of_flow(*this))
return IterationDecision::Continue;
child_box.set_flex_item(true);
FlexItem flex_item = { child_box };
populate_specified_margins(flex_item, m_flex_direction);
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
m_flex_items.append(move(flex_item));
LibWeb: Split out FFC's "generate anonymous flex items" to a function Let's begin splitting the FlexFormattingContext layout algorithm into separate functions to make it more manageable.
2021-10-13 19:57:26 +02:00
return IterationDecision::Continue;
});
}
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
bool FlexFormattingContext::has_definite_main_size(Box const& box) const
{
return is_row_layout() ? box.has_definite_width() : box.has_definite_height();
}
float FlexFormattingContext::specified_main_size(Box const& box) const
{
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto const& box_state = m_state.get(box);
return is_row_layout() ? box_state.content_width : box_state.content_height;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::specified_cross_size(Box const& box) const
{
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto const& box_state = m_state.get(box);
return is_row_layout() ? box_state.content_height : box_state.content_width;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Add FFC helpers for resolving definite main/cross sizes Although something has a definite size, we may still have to "resolve" it, since FFC is quite liberal in what it considers to be definite. Let's put that logic in a set of helper functions.
2022-03-12 14:11:55 +01:00
float FlexFormattingContext::resolved_definite_cross_size(Box const& box) const
{
if (is_row_layout())
VERIFY(box.has_definite_height());
else
VERIFY(box.has_definite_width());
auto const& cross_value = is_row_layout() ? box.computed_values().height() : box.computed_values().width();
if (cross_value->is_length())
return cross_value->length().to_px(box);
return cross_value->resolved(box, CSS::Length::make_px(specified_cross_size(flex_container()))).to_px(box);
}
float FlexFormattingContext::resolved_definite_main_size(Box const& box) const
{
if (is_row_layout())
VERIFY(box.has_definite_width());
else
VERIFY(box.has_definite_height());
auto const& cross_value = is_row_layout() ? box.computed_values().width() : box.computed_values().height();
if (cross_value->is_length())
return cross_value->length().to_px(box);
return cross_value->resolved(box, CSS::Length::make_px(specified_main_size(flex_container()))).to_px(box);
}
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
bool FlexFormattingContext::has_main_min_size(Box const& box) const
{
auto value = is_row_layout() ? box.computed_values().min_width() : box.computed_values().min_height();
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
return !is_undefined_or_auto(value);
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::has_cross_min_size(Box const& box) const
{
auto value = is_row_layout() ? box.computed_values().min_height() : box.computed_values().min_width();
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
return !is_undefined_or_auto(value);
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::has_definite_cross_size(Box const& box) const
{
LibWeb: Remove FFC::cross_size_is_absolute_or_resolved_nicely() This is now answered authoritatively by Layout::Box itself.
2022-02-27 17:15:37 +01:00
return is_row_layout() ? box.has_definite_height() : box.has_definite_width();
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
float FlexFormattingContext::specified_main_size_of_child_box(Box const& child_box) const
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
auto main_size_of_parent = specified_main_size(flex_container());
LibWeb: Use Optional instead of undefined-lengths for widths/heights
2022-02-18 15:10:11 +00:00
auto& value = is_row_layout() ? child_box.computed_values().width() : child_box.computed_values().height();
if (!value.has_value())
return 0;
LibWeb: Remove redundant Length::resolved() calls Now that calc() is also resolved in to_px(), code in the form `foo.resolved(bar).to_px(bar)` can be simplified to `foo.to_px(bar)`.
2022-02-18 16:27:28 +00:00
return value->resolved(child_box, CSS::Length::make_px(main_size_of_parent)).to_px(child_box);
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::specified_main_min_size(Box const& box) const
{
return is_row_layout()
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
? get_pixel_size(m_state, box, box.computed_values().min_width())
: get_pixel_size(m_state, box, box.computed_values().min_height());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::specified_cross_min_size(Box const& box) const
{
return is_row_layout()
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
? get_pixel_size(m_state, box, box.computed_values().min_height())
: get_pixel_size(m_state, box, box.computed_values().min_width());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::has_main_max_size(Box const& box) const
{
return is_row_layout()
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
? !is_undefined_or_auto(box.computed_values().max_width())
: !is_undefined_or_auto(box.computed_values().max_height());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::has_cross_max_size(Box const& box) const
{
return is_row_layout()
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
? !is_undefined_or_auto(box.computed_values().max_height())
: !is_undefined_or_auto(box.computed_values().max_width());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::specified_main_max_size(Box const& box) const
{
return is_row_layout()
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
? get_pixel_size(m_state, box, box.computed_values().max_width())
: get_pixel_size(m_state, box, box.computed_values().max_height());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::specified_cross_max_size(Box const& box) const
{
return is_row_layout()
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
? get_pixel_size(m_state, box, box.computed_values().max_height())
: get_pixel_size(m_state, box, box.computed_values().max_width());
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::calculated_main_size(Box const& box) const
{
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto const& box_state = m_state.get(box);
return is_row_layout() ? box_state.content_width : box_state.content_height;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::is_cross_auto(Box const& box) const
{
LibWeb: Use Optional instead of undefined-lengths for widths/heights
2022-02-18 15:10:11 +00:00
auto& cross_length = is_row_layout() ? box.computed_values().height() : box.computed_values().width();
LibWeb: Add missing is_length() check in FFC::is_cross_auto() We can't access LengthPercentage::length() before verifying that it's indeed a length.
2022-02-18 19:19:56 +01:00
return cross_length.has_value() && cross_length->is_length() && cross_length->length().is_auto();
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::is_main_axis_margin_first_auto(Box const& box) const
{
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
if (is_row_layout())
return box.computed_values().margin().left.is_length() && box.computed_values().margin().left.length().is_auto();
return box.computed_values().margin().top.is_length() && box.computed_values().margin().top.length().is_auto();
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
bool FlexFormattingContext::is_main_axis_margin_second_auto(Box const& box) const
{
LibWeb: Convert width/height and min-/max- versions to LengthPercentage A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
2022-01-19 16:19:43 +00:00
if (is_row_layout())
return box.computed_values().margin().right.is_length() && box.computed_values().margin().right.length().is_auto();
return box.computed_values().margin().bottom.is_length() && box.computed_values().margin().bottom.length().is_auto();
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::set_main_size(Box const& box, float size)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
if (is_row_layout())
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).content_width = size;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
else
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).content_height = size;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::set_cross_size(Box const& box, float size)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
if (is_row_layout())
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).content_height = size;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
else
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).content_width = size;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::set_offset(Box const& box, float main_offset, float cross_offset)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
if (is_row_layout())
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).offset = Gfx::FloatPoint { main_offset, cross_offset };
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
else
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).offset = Gfx::FloatPoint { cross_offset, main_offset };
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::set_main_axis_first_margin(Box const& box, float margin)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
if (is_row_layout())
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).margin_left = margin;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
else
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).margin_top = margin;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
void FlexFormattingContext::set_main_axis_second_margin(Box const& box, float margin)
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
{
if (is_row_layout())
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).margin_right = margin;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
else
LibWeb: Rename FormattingState::ensure() -> get_mutable() This makes it much more obvious what the difference between get() and get_mutable() is.
2022-02-21 17:42:09 +01:00
m_state.get_mutable(box).margin_bottom = margin;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
float FlexFormattingContext::sum_of_margin_padding_border_in_main_axis(Box const& box) const
{
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto const& box_state = m_state.get(box);
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
if (is_row_layout()) {
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
return box_state.margin_left + box_state.margin_right
+ box_state.padding_left + box_state.padding_right
+ box_state.border_left + box_state.border_right;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
} else {
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
return box_state.margin_top + box_state.margin_bottom
+ box_state.padding_top + box_state.padding_bottom
+ box_state.border_top + box_state.border_bottom;
LibWeb: Turn FlexFormattingContext helper lambdas into member functions Continuing on the quest towards making FlexFormattingContext readable.
2021-10-13 21:24:00 +02:00
}
}
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-available
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
void FlexFormattingContext::determine_available_main_and_cross_space(bool& main_is_constrained, bool& cross_is_constrained, float& main_min_size, float& main_max_size, float& cross_min_size, float& cross_max_size)
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
{
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
auto containing_block_effective_main_size = [&](Box const& box) -> Optional<float> {
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto& containing_block = *box.containing_block();
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (has_definite_main_size(containing_block))
return resolved_definite_main_size(containing_block);
return {};
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
};
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
Optional<float> main_available_space;
LibWeb: Add spec comments to FFC layout algorithm step 2
2021-10-13 23:56:05 +02:00
main_is_constrained = false;
// For each dimension,
// if that dimension of the flex container’s content box is a definite size, use that;
// if that dimension of the flex container is being sized under a min or max-content constraint, the available space in that dimension is that constraint;
// otherwise, subtract the flex container’s margin, border, and padding from the space available to the flex container in that dimension and use that value. (This might result in an infinite value.)
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_definite_main_size(flex_container())) {
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
main_is_constrained = true;
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
main_available_space = specified_main_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
} else {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_main_max_size(flex_container())) {
main_max_size = specified_main_max_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
main_available_space = main_max_size;
main_is_constrained = true;
}
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_main_min_size(flex_container())) {
main_min_size = specified_main_min_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
main_is_constrained = true;
}
if (!main_is_constrained) {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
auto available_main_size = containing_block_effective_main_size(flex_container());
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
main_available_space = available_main_size.value_or(NumericLimits<float>::max()) - sum_of_margin_padding_border_in_main_axis(flex_container());
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (flex_container().computed_values().flex_wrap() == CSS::FlexWrap::Wrap || flex_container().computed_values().flex_wrap() == CSS::FlexWrap::WrapReverse) {
main_available_space = specified_main_size(*flex_container().containing_block());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
main_is_constrained = true;
}
}
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
Optional<float> cross_available_space;
LibWeb: Add spec comments to FFC layout algorithm step 2
2021-10-13 23:56:05 +02:00
cross_is_constrained = false;
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_definite_cross_size(flex_container())) {
cross_available_space = specified_cross_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
} else {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_cross_max_size(flex_container())) {
cross_max_size = specified_cross_max_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
cross_is_constrained = true;
}
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_cross_min_size(flex_container())) {
cross_min_size = specified_cross_min_size(flex_container());
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
cross_is_constrained = true;
}
// FIXME: Is this right? Probably not.
if (!cross_is_constrained)
cross_available_space = cross_max_size;
}
LibWeb: Put available space information in an FFC member This makes it easier for each step of the flex layout algorithm to access this information.
2022-02-27 12:19:58 +01:00
m_available_space = AvailableSpace { .main = main_available_space, .cross = cross_available_space };
LibWeb: Move FFC layout algorithm step 2 into a separate function Determining the available main and cross space is now done by a separate function. The signature is a little bit hairy since this function computes some things that are used by subsequent algorithm steps. Factoring can definitely be improved further.
2021-10-13 21:41:35 +02:00
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
float FlexFormattingContext::calculate_indefinite_main_size(FlexItem const& item)
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
{
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
VERIFY(!has_definite_main_size(item.box));
if (has_definite_cross_size(item.box)) {
// For indefinite main sizes, we perform a throwaway layout and then measure it.
LibWeb: Make Layout::FormattingState copies shallow Previously, each NodeState in a FormattingState was shared with the parent FormattingState, but the HashMap of NodeState had to be copied when making FormattingState copies. This patch makes copying instant by keeping a pointer to the parent FormattingState instead. When fetching immutable state via get(), we may now return a reference to a NodeState owned by a parent FormattingState. get_mutable() will copy any NodeState found in the ancestor chain before making a brand new one.
2022-03-12 16:33:11 +01:00
FormattingState throwaway_state(&m_state);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
auto& box_state = throwaway_state.get_mutable(item.box);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
// Item has definite cross size, layout with that as the used cross size.
auto independent_formatting_context = create_independent_formatting_context_if_needed(throwaway_state, item.box);
// NOTE: Flex items should always create an independent formatting context!
VERIFY(independent_formatting_context);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
if (is_row_layout()) {
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
box_state.content_height = resolved_definite_cross_size(item.box);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
} else {
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
box_state.content_width = resolved_definite_cross_size(item.box);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
independent_formatting_context->run(item.box, LayoutMode::Default);
if (is_row_layout())
return box_state.content_width;
return BlockFormattingContext::compute_theoretical_height(throwaway_state, item.box);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
// Item has indefinite cross size, layout with "fit-content"
// If we're in a row layout and looking for the width, just use the fit-content width.
if (is_row_layout())
return calculate_fit_content_width(item.box, m_available_space->main);
// We're in a column layout, looking for the height. Figure out the fit-content width,
// then layout with that and see what height comes out of it.
float fit_content_cross_size = calculate_fit_content_width(item.box, m_available_space->cross);
LibWeb: Make Layout::FormattingState copies shallow Previously, each NodeState in a FormattingState was shared with the parent FormattingState, but the HashMap of NodeState had to be copied when making FormattingState copies. This patch makes copying instant by keeping a pointer to the parent FormattingState instead. When fetching immutable state via get(), we may now return a reference to a NodeState owned by a parent FormattingState. get_mutable() will copy any NodeState found in the ancestor chain before making a brand new one.
2022-03-12 16:33:11 +01:00
FormattingState throwaway_state(&m_state);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
auto& box_state = throwaway_state.get_mutable(item.box);
// Item has definite cross size, layout with that as the used cross size.
auto independent_formatting_context = create_independent_formatting_context_if_needed(throwaway_state, item.box);
// NOTE: Flex items should always create an independent formatting context!
VERIFY(independent_formatting_context);
box_state.content_width = fit_content_cross_size;
independent_formatting_context->run(item.box, LayoutMode::Default);
return BlockFormattingContext::compute_theoretical_height(throwaway_state, item.box);
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
}
// https://www.w3.org/TR/css-flexbox-1/#algo-main-item
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::determine_flex_base_size_and_hypothetical_main_size(FlexItem& flex_item)
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
{
auto& child_box = flex_item.box;
LibWeb: Tidy up and add spec comments to FFC layout algorithm step 3
2021-10-13 23:26:31 +02:00
flex_item.flex_base_size = [&] {
auto const& used_flex_basis = child_box.computed_values().flex_basis();
// A. If the item has a definite used flex basis, that’s the flex base size.
if (used_flex_basis.is_definite()) {
LibWeb: Start making our layout system "transactional" This patch adds a map of Layout::Node to FormattingState::NodeState. Instead of updating layout nodes incrementally as layout progresses through the formatting contexts, all updates are now written to the corresponding NodeState instead. At the end of layout, FormattingState::commit() is called, which transfers all the values from the NodeState objects to the Node. This will soon allow us to perform completely non-destructive layouts which don't affect the tree. Note that there are many imperfections here, and still many places where we assign to the NodeState, but later read directly from the Node instead. I'm just committing at this stage to make subsequent diffs easier to understand.
2022-02-20 15:51:24 +01:00
auto specified_base_size = get_pixel_size(m_state, child_box, used_flex_basis.length_percentage.value());
LibWeb: Tidy up and add spec comments to FFC layout algorithm step 3
2021-10-13 23:26:31 +02:00
if (specified_base_size == 0)
return calculated_main_size(flex_item.box);
return specified_base_size;
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
}
LibWeb: Tidy up and add spec comments to FFC layout algorithm step 3
2021-10-13 23:26:31 +02:00
// B. If the flex item has ...
// - an intrinsic aspect ratio,
// - a used flex basis of content, and
// - a definite cross size,
LibWeb: Use Box::has_intrinsic_aspect_ratio() check in FFC step 3 Now that we can ask any Box about its intrinsic aspect ratio, let's fix a FIXME in FlexFormattingContext.
2021-10-14 19:42:09 +02:00
if (flex_item.box.has_intrinsic_aspect_ratio()
LibWeb: Tidy up and add spec comments to FFC layout algorithm step 3
2021-10-13 23:26:31 +02:00
&& used_flex_basis.type == CSS::FlexBasis::Content
&& has_definite_cross_size(child_box)) {
TODO();
// flex_base_size is calculated from definite cross size and intrinsic aspect ratio
}
// C. If the used flex basis is content or depends on its available space,
// and the flex container is being sized under a min-content or max-content constraint
// (e.g. when performing automatic table layout [CSS21]), size the item under that constraint.
// The flex base size is the item’s resulting main size.
if (used_flex_basis.type == CSS::FlexBasis::Content
// FIXME: && sized under min-content or max-content constraints
&& false) {
TODO();
// Size child_box under the constraints, flex_base_size is then the resulting main_size.
}
// D. Otherwise, if the used flex basis is content or depends on its available space,
// the available main size is infinite, and the flex item’s inline axis is parallel to the main axis,
// lay the item out using the rules for a box in an orthogonal flow [CSS3-WRITING-MODES].
// The flex base size is the item’s max-content main size.
if (used_flex_basis.type == CSS::FlexBasis::Content
// FIXME: && main_size is infinite && inline axis is parallel to the main axis
&& false && false) {
TODO();
// Use rules for a flex_container in orthogonal flow
}
// E. Otherwise, size the item into the available space using its used flex basis in place of its main size,
// treating a value of content as max-content. If a cross size is needed to determine the main size
// (e.g. when the flex item’s main size is in its block axis) and the flex item’s cross size is auto and not definite,
// in this calculation use fit-content as the flex item’s cross size.
// The flex base size is the item’s resulting main size.
// FIXME: This is probably too naive.
// FIXME: Care about FlexBasis::Auto
if (has_definite_main_size(child_box))
return specified_main_size_of_child_box(child_box);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
return calculate_indefinite_main_size(flex_item);
LibWeb: Tidy up and add spec comments to FFC layout algorithm step 3
2021-10-13 23:26:31 +02:00
}();
// The hypothetical main size is the item’s flex base size clamped according to its used min and max main sizes (and flooring the content box size at zero).
auto clamp_min = has_main_min_size(child_box) ? specified_main_min_size(child_box) : 0;
auto clamp_max = has_main_max_size(child_box) ? specified_main_max_size(child_box) : NumericLimits<float>::max();
LibWeb: Move FFC layout algorithm step 3 to a separate function
2021-10-13 21:49:28 +02:00
flex_item.hypothetical_main_size = clamp(flex_item.flex_base_size, clamp_min, clamp_max);
}
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-main-container
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
void FlexFormattingContext::determine_main_size_of_flex_container(bool const main_is_constrained, float const main_min_size, float const main_max_size)
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
{
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (!main_is_constrained || !m_available_space->main.has_value()) {
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
// Uses https://www.w3.org/TR/css-flexbox-1/#intrinsic-main-sizes
// 9.9.1
// 1.
float largest_max_content_flex_fraction = 0;
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_item : m_flex_items) {
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
// FIXME: This needs some serious work.
float max_content_contribution = calculated_main_size(flex_item.box);
float max_content_flex_fraction = max_content_contribution - flex_item.flex_base_size;
if (max_content_flex_fraction > 0) {
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
max_content_flex_fraction /= max(flex_item.box.computed_values().flex_grow(), 1.0f);
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
} else {
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
max_content_flex_fraction /= max(flex_item.box.computed_values().flex_shrink(), 1.0f) * flex_item.flex_base_size;
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
}
flex_item.max_content_flex_fraction = max_content_flex_fraction;
if (max_content_flex_fraction > largest_max_content_flex_fraction)
largest_max_content_flex_fraction = max_content_flex_fraction;
}
// 2. Omitted
// 3.
float result = 0;
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_item : m_flex_items) {
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
auto product = 0;
if (flex_item.max_content_flex_fraction > 0) {
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
product = largest_max_content_flex_fraction * flex_item.box.computed_values().flex_grow();
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
} else {
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
product = largest_max_content_flex_fraction * max(flex_item.box.computed_values().flex_shrink(), 1.0f) * flex_item.flex_base_size;
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
}
result += flex_item.flex_base_size + product;
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
m_available_space->main = clamp(result, main_min_size, main_max_size);
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
set_main_size(flex_container(), m_available_space->main.value_or(NumericLimits<float>::max()));
LibWeb: Move FFC layout algorithm step 4 to a separate function
2021-10-13 22:03:39 +02:00
}
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-line-break
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
void FlexFormattingContext::collect_flex_items_into_flex_lines()
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
{
// FIXME: Also support wrap-reverse
LibWeb: Add spec comments to FFC layout algorithm step 5
2021-10-13 23:38:04 +02:00
// If the flex container is single-line, collect all the flex items into a single flex line.
if (is_single_line()) {
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
FlexLine line;
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_item : m_flex_items) {
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
line.items.append(&flex_item);
}
LibWeb: Add spec comments to FFC layout algorithm step 5
2021-10-13 23:38:04 +02:00
m_flex_lines.append(move(line));
return;
}
// Otherwise, starting from the first uncollected item, collect consecutive items one by one
// until the first time that the next collected item would not fit into the flex container’s inner main size
// (or until a forced break is encountered, see §10 Fragmenting Flex Layout).
// If the very first uncollected item wouldn't fit, collect just it into the line.
// For this step, the size of a flex item is its outer hypothetical main size. (Note: This can be negative.)
// Repeat until all flex items have been collected into flex lines.
FlexLine line;
float line_main_size = 0;
for (auto& flex_item : m_flex_items) {
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if ((line_main_size + flex_item.hypothetical_main_size) > m_available_space->main.value_or(NumericLimits<float>::max())) {
LibWeb: Add spec comments to FFC layout algorithm step 5
2021-10-13 23:38:04 +02:00
m_flex_lines.append(move(line));
line = {};
line_main_size = 0;
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
}
LibWeb: Add spec comments to FFC layout algorithm step 5
2021-10-13 23:38:04 +02:00
line.items.append(&flex_item);
line_main_size += flex_item.hypothetical_main_size;
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
}
LibWeb: Add spec comments to FFC layout algorithm step 5
2021-10-13 23:38:04 +02:00
m_flex_lines.append(move(line));
LibWeb: Move FFC layout algorithm step 5 to a separate function
2021-10-13 22:07:55 +02:00
}
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
// https://www.w3.org/TR/css-flexbox-1/#resolve-flexible-lengths
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
void FlexFormattingContext::resolve_flexible_lengths()
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
{
enum FlexFactor {
FlexGrowFactor,
FlexShrinkFactor
};
FlexFactor used_flex_factor;
// 6.1. Determine used flex factor
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_line : m_flex_lines) {
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
size_t number_of_unfrozen_items_on_line = flex_line.items.size();
float sum_of_hypothetical_main_sizes = 0;
for (auto& flex_item : flex_line.items) {
sum_of_hypothetical_main_sizes += flex_item->hypothetical_main_size;
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (sum_of_hypothetical_main_sizes < m_available_space->main.value_or(NumericLimits<float>::max()))
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
used_flex_factor = FlexFactor::FlexGrowFactor;
else
used_flex_factor = FlexFactor::FlexShrinkFactor;
for (auto& flex_item : flex_line.items) {
if (used_flex_factor == FlexFactor::FlexGrowFactor)
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
flex_item->flex_factor = flex_item->box.computed_values().flex_grow();
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
else if (used_flex_factor == FlexFactor::FlexShrinkFactor)
LibWeb: Make computed flex-grow and flex-shrink always available These values are not allowed to be absent (auto/none/etc) so we don't need to use Optional<float> for them. This simplifies some things.
2021-10-19 15:22:08 +02:00
flex_item->flex_factor = flex_item->box.computed_values().flex_shrink();
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
}
// 6.2. Size inflexible items
auto freeze_item_setting_target_main_size_to_hypothetical_main_size = [&number_of_unfrozen_items_on_line](FlexItem& item) {
item.target_main_size = item.hypothetical_main_size;
number_of_unfrozen_items_on_line--;
item.frozen = true;
};
for (auto& flex_item : flex_line.items) {
if (flex_item->flex_factor.has_value() && flex_item->flex_factor.value() == 0) {
freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
} else if (used_flex_factor == FlexFactor::FlexGrowFactor) {
// FIXME: Spec doesn't include the == case, but we take a too basic approach to calculating the values used so this is appropriate
if (flex_item->flex_base_size > flex_item->hypothetical_main_size) {
freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
}
} else if (used_flex_factor == FlexFactor::FlexShrinkFactor) {
if (flex_item->flex_base_size < flex_item->hypothetical_main_size) {
freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
}
}
}
// 6.3. Calculate initial free space
auto calculate_free_space = [&]() {
float sum_of_items_on_line = 0;
for (auto& flex_item : flex_line.items) {
if (flex_item->frozen)
sum_of_items_on_line += flex_item->target_main_size;
else
sum_of_items_on_line += flex_item->flex_base_size;
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
return specified_main_size(flex_container()) - sum_of_items_on_line;
LibWeb: Move FFC layout algorithm step 6 to a separate function
2021-10-13 22:11:50 +02:00
};
float initial_free_space = calculate_free_space();
// 6.4 Loop
auto for_each_unfrozen_item = [&flex_line](auto callback) {
for (auto& flex_item : flex_line.items) {
if (!flex_item->frozen)
callback(flex_item);
}
};
while (number_of_unfrozen_items_on_line > 0) {
// b Calculate the remaining free space
auto remaining_free_space = calculate_free_space();
float sum_of_unfrozen_flex_items_flex_factors = 0;
for_each_unfrozen_item([&](FlexItem* item) {
sum_of_unfrozen_flex_items_flex_factors += item->flex_factor.value_or(1);
});
if (sum_of_unfrozen_flex_items_flex_factors < 1) {
auto intermediate_free_space = initial_free_space * sum_of_unfrozen_flex_items_flex_factors;
if (AK::abs(intermediate_free_space) < AK::abs(remaining_free_space))
remaining_free_space = intermediate_free_space;
}
// c Distribute free space proportional to the flex factors
if (remaining_free_space != 0) {
if (used_flex_factor == FlexFactor::FlexGrowFactor) {
float sum_of_flex_grow_factor_of_unfrozen_items = sum_of_unfrozen_flex_items_flex_factors;
for_each_unfrozen_item([&](FlexItem* flex_item) {
float ratio = flex_item->flex_factor.value_or(1) / sum_of_flex_grow_factor_of_unfrozen_items;
flex_item->target_main_size = flex_item->flex_base_size + (remaining_free_space * ratio);
});
} else if (used_flex_factor == FlexFactor::FlexShrinkFactor) {
float sum_of_scaled_flex_shrink_factor_of_unfrozen_items = 0;
for_each_unfrozen_item([&](FlexItem* flex_item) {
flex_item->scaled_flex_shrink_factor = flex_item->flex_factor.value_or(1) * flex_item->flex_base_size;
sum_of_scaled_flex_shrink_factor_of_unfrozen_items += flex_item->scaled_flex_shrink_factor;
});
for_each_unfrozen_item([&](FlexItem* flex_item) {
float ratio = 1.0f;
if (sum_of_scaled_flex_shrink_factor_of_unfrozen_items != 0.0f)
ratio = flex_item->scaled_flex_shrink_factor / sum_of_scaled_flex_shrink_factor_of_unfrozen_items;
flex_item->target_main_size = flex_item->flex_base_size - (AK::abs(remaining_free_space) * ratio);
});
}
} else {
// This isn't spec but makes sense.
for_each_unfrozen_item([&](FlexItem* flex_item) {
flex_item->target_main_size = flex_item->flex_base_size;
});
}
// d Fix min/max violations.
float adjustments = 0.0f;
for_each_unfrozen_item([&](FlexItem* item) {
auto min_main = has_main_min_size(item->box)
? specified_main_min_size(item->box)
: 0;
auto max_main = has_main_max_size(item->box)
? specified_main_max_size(item->box)
: NumericLimits<float>::max();
float original_target_size = item->target_main_size;
if (item->target_main_size < min_main) {
item->target_main_size = min_main;
item->is_min_violation = true;
}
if (item->target_main_size > max_main) {
item->target_main_size = max_main;
item->is_max_violation = true;
}
float delta = item->target_main_size - original_target_size;
adjustments += delta;
});
// e Freeze over-flexed items
float total_violation = adjustments;
if (total_violation == 0) {
for_each_unfrozen_item([&](FlexItem* item) {
--number_of_unfrozen_items_on_line;
item->frozen = true;
});
} else if (total_violation > 0) {
for_each_unfrozen_item([&](FlexItem* item) {
if (item->is_min_violation) {
--number_of_unfrozen_items_on_line;
item->frozen = true;
}
});
} else if (total_violation < 0) {
for_each_unfrozen_item([&](FlexItem* item) {
if (item->is_max_violation) {
--number_of_unfrozen_items_on_line;
item->frozen = true;
}
});
}
}
// 6.5.
for (auto& flex_item : flex_line.items) {
flex_item->main_size = flex_item->target_main_size;
}
}
}
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
// https://drafts.csswg.org/css-flexbox-1/#algo-cross-item
void FlexFormattingContext::determine_hypothetical_cross_size_of_item(FlexItem& item)
LibWeb: Move FFC layout algorithm step 7 to a separate function
2021-10-13 22:15:16 +02:00
{
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
// Determine the hypothetical cross size of each item by performing layout
// as if it were an in-flow block-level box with the used main size
// and the given available space, treating auto as fit-content.
// If we have a definite cross size, this is easy! No need to perform layout, we can just use it as-is.
if (has_definite_cross_size(item.box)) {
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
item.hypothetical_cross_size = resolved_definite_cross_size(item.box);
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
return;
LibWeb: Move FFC layout algorithm step 7 to a separate function
2021-10-13 22:15:16 +02:00
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (has_definite_main_size(item.box)) {
// For indefinite cross sizes, we perform a throwaway layout and then measure it.
LibWeb: Make Layout::FormattingState copies shallow Previously, each NodeState in a FormattingState was shared with the parent FormattingState, but the HashMap of NodeState had to be copied when making FormattingState copies. This patch makes copying instant by keeping a pointer to the parent FormattingState instead. When fetching immutable state via get(), we may now return a reference to a NodeState owned by a parent FormattingState. get_mutable() will copy any NodeState found in the ancestor chain before making a brand new one.
2022-03-12 16:33:11 +01:00
FormattingState throwaway_state(&m_state);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
auto& box_state = throwaway_state.get_mutable(item.box);
// Item has definite main size, layout with that as the used main size.
auto independent_formatting_context = create_independent_formatting_context_if_needed(throwaway_state, item.box);
// NOTE: Flex items should always create an independent formatting context!
VERIFY(independent_formatting_context);
LibWeb: Move FFC layout algorithm step 7 to a separate function
2021-10-13 22:15:16 +02:00
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (is_row_layout()) {
box_state.content_width = resolved_definite_main_size(item.box);
} else {
box_state.content_height = resolved_definite_main_size(item.box);
}
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
independent_formatting_context->run(item.box, LayoutMode::Default);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
if (is_row_layout())
item.hypothetical_cross_size = BlockFormattingContext::compute_theoretical_height(throwaway_state, item.box);
else
item.hypothetical_cross_size = box_state.content_width;
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
} else {
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
// Item has indefinite main size, layout with "fit-content"
LibWeb: Fix calculation of hypothetical cross size in column flex layout Simplify automatic cross sizing of items in flex-direction:column by using the fit-content width directly. There's obviously a lot more nuance to this, but for now this makes flex items with both width:auto and height:auto actually get some height in column flex layouts.
2022-03-12 19:36:04 +01:00
// If we're in a column layout and looking for the width, just use the fit-content width.
if (!is_row_layout()) {
item.hypothetical_cross_size = calculate_fit_content_width(item.box, m_available_space->cross);
return;
}
// We're in a row layout, looking for the height. Figure out the fit-content width,
// then layout with that and see what height comes out of it.
float fit_content_main_size = calculate_fit_content_width(item.box, m_available_space->main);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
LibWeb: Make Layout::FormattingState copies shallow Previously, each NodeState in a FormattingState was shared with the parent FormattingState, but the HashMap of NodeState had to be copied when making FormattingState copies. This patch makes copying instant by keeping a pointer to the parent FormattingState instead. When fetching immutable state via get(), we may now return a reference to a NodeState owned by a parent FormattingState. get_mutable() will copy any NodeState found in the ancestor chain before making a brand new one.
2022-03-12 16:33:11 +01:00
FormattingState throwaway_state(&m_state);
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
auto& box_state = throwaway_state.get_mutable(item.box);
// Item has definite main size, layout with that as the used main size.
auto independent_formatting_context = create_independent_formatting_context_if_needed(throwaway_state, item.box);
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
// NOTE: Flex items should always create an independent formatting context!
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
VERIFY(independent_formatting_context);
LibWeb: Move FFC layout algorithm step 7 to a separate function
2021-10-13 22:15:16 +02:00
LibWeb: Fix calculation of hypothetical cross size in column flex layout Simplify automatic cross sizing of items in flex-direction:column by using the fit-content width directly. There's obviously a lot more nuance to this, but for now this makes flex items with both width:auto and height:auto actually get some height in column flex layouts.
2022-03-12 19:36:04 +01:00
box_state.content_width = fit_content_main_size;
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
independent_formatting_context->run(item.box, LayoutMode::Default);
LibWeb: Fix calculation of hypothetical cross size in column flex layout Simplify automatic cross sizing of items in flex-direction:column by using the fit-content width directly. There's obviously a lot more nuance to this, but for now this makes flex items with both width:auto and height:auto actually get some height in column flex layouts.
2022-03-12 19:36:04 +01:00
item.hypothetical_cross_size = BlockFormattingContext::compute_theoretical_height(throwaway_state, item.box);
LibWeb: Improve FFC step 7 (hypothetical cross size) - Avoid performing inside layout on definite-size flex items (since their computed size can be used as-is.) - Use FormattingState::clone() to generate a throwaway layout instead of mutating the tree in-place. - Update spec link & comments based on current CSSWG draft. The latest version is quite a bit clearer on how this should work.
2022-02-27 13:39:38 +01:00
}
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
}
// https://www.w3.org/TR/css-flexbox-1/#algo-cross-line
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::calculate_cross_size_of_each_flex_line(float const cross_min_size, float const cross_max_size)
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
{
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
// If the flex container is single-line and has a definite cross size, the cross size of the flex line is the flex container’s inner cross size.
if (is_single_line() && has_definite_cross_size(flex_container())) {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
m_flex_lines[0].cross_size = specified_cross_size(flex_container());
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
return;
}
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
// Otherwise, for each flex line:
for (auto& flex_line : m_flex_lines) {
// FIXME: 1. Collect all the flex items whose inline-axis is parallel to the main-axis, whose align-self is baseline,
// and whose cross-axis margins are both non-auto. Find the largest of the distances between each item’s baseline
// and its hypothetical outer cross-start edge, and the largest of the distances between each item’s baseline
// and its hypothetical outer cross-end edge, and sum these two values.
// FIXME: This isn't spec but makes sense here
if (has_definite_cross_size(flex_container()) && flex_container().computed_values().align_items() == CSS::AlignItems::Stretch) {
flex_line.cross_size = specified_cross_size(flex_container()) / m_flex_lines.size();
continue;
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
}
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
// 2. Among all the items not collected by the previous step, find the largest outer hypothetical cross size.
float largest_hypothetical_cross_size = 0;
for (auto& flex_item : flex_line.items) {
if (largest_hypothetical_cross_size < flex_item->hypothetical_cross_size_with_margins())
largest_hypothetical_cross_size = flex_item->hypothetical_cross_size_with_margins();
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
}
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
// 3. The used cross-size of the flex line is the largest of the numbers found in the previous two steps and zero.
flex_line.cross_size = max(0.0f, largest_hypothetical_cross_size);
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
}
LibWeb: Use is_single_line() and add spec comments to FFC step 8
2021-10-18 18:37:43 +02:00
// If the flex container is single-line, then clamp the line’s cross-size to be within the container’s computed min and max cross sizes.
// Note that if CSS 2.1’s definition of min/max-width/height applied more generally, this behavior would fall out automatically.
if (is_single_line())
clamp(m_flex_lines[0].cross_size, cross_min_size, cross_max_size);
LibWeb: Move FFC layout algorithm step 8 to a separate function
2021-10-13 22:17:33 +02:00
}
LibWeb: Move FFC layout algorithm step 7 to a separate function
2021-10-13 22:15:16 +02:00
LibWeb: Move FFC layout algorithm step 11 to a separate function
2021-10-13 22:19:17 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-stretch
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::determine_used_cross_size_of_each_flex_item()
LibWeb: Move FFC layout algorithm step 11 to a separate function
2021-10-13 22:19:17 +02:00
{
// FIXME: Get the alignment via "align-self" of the item (which accesses "align-items" of the parent if unset)
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_line : m_flex_lines) {
LibWeb: Move FFC layout algorithm step 11 to a separate function
2021-10-13 22:19:17 +02:00
for (auto& flex_item : flex_line.items) {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (is_cross_auto(flex_item->box) && flex_container().computed_values().align_items() == CSS::AlignItems::Stretch) {
LibWeb: Move FFC layout algorithm step 11 to a separate function
2021-10-13 22:19:17 +02:00
flex_item->cross_size = flex_line.cross_size;
} else {
flex_item->cross_size = flex_item->hypothetical_cross_size;
}
}
}
}
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-main-align
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
void FlexFormattingContext::distribute_any_remaining_free_space()
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
{
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_line : m_flex_lines) {
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
// 12.1.
float used_main_space = 0;
size_t auto_margins = 0;
for (auto& flex_item : flex_line.items) {
used_main_space += flex_item->main_size;
if (is_main_axis_margin_first_auto(flex_item->box))
++auto_margins;
if (is_main_axis_margin_second_auto(flex_item->box))
++auto_margins;
}
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
float remaining_free_space = m_available_space->main.value_or(NumericLimits<float>::max()) - used_main_space;
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
if (remaining_free_space > 0) {
float size_per_auto_margin = remaining_free_space / (float)auto_margins;
for (auto& flex_item : flex_line.items) {
if (is_main_axis_margin_first_auto(flex_item->box))
set_main_axis_first_margin(flex_item->box, size_per_auto_margin);
if (is_main_axis_margin_second_auto(flex_item->box))
set_main_axis_second_margin(flex_item->box, size_per_auto_margin);
}
} else {
for (auto& flex_item : flex_line.items) {
if (is_main_axis_margin_first_auto(flex_item->box))
set_main_axis_first_margin(flex_item->box, 0);
if (is_main_axis_margin_second_auto(flex_item->box))
set_main_axis_second_margin(flex_item->box, 0);
}
}
// 12.2.
float space_between_items = 0;
float space_before_first_item = 0;
auto number_of_items = flex_line.items.size();
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
switch (flex_container().computed_values().justify_content()) {
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
case CSS::JustifyContent::FlexStart:
break;
case CSS::JustifyContent::FlexEnd:
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
space_before_first_item = m_available_space->main.value_or(NumericLimits<float>::max()) - used_main_space;
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
break;
case CSS::JustifyContent::Center:
LibWeb: Handle many more cases with intrinsic/auto sizing in flex layout The flexbox specification barely even handwaves about automatically sized items, but there's actually a lot of work to do in order for them to get the correct size. This patch is messy, but does make significant progress on supporting flex items with indefinite width and/or height. There's a fair amount of nested layout going on here, but do note that we'll be hitting the intrinsic sizes cache whenever possible.
2022-03-12 14:40:13 +01:00
space_before_first_item = (m_available_space->main.value_or(NumericLimits<float>::max()) - used_main_space) / 2.0f;
LibWeb: Move FFC layout algorithm step 12 to a separate function
2021-10-13 22:20:55 +02:00
break;
case CSS::JustifyContent::SpaceBetween:
space_between_items = remaining_free_space / (number_of_items - 1);
break;
case CSS::JustifyContent::SpaceAround:
space_between_items = remaining_free_space / number_of_items;
space_before_first_item = space_between_items / 2.0f;
break;
}
// FIXME: Support reverse
float main_offset = space_before_first_item;
for (auto& flex_item : flex_line.items) {
flex_item->main_offset = main_offset;
main_offset += flex_item->main_size + space_between_items;
}
}
}
LibWeb: Add a debug helper to dump current state of an FFC
2022-03-13 00:03:59 +01:00
void FlexFormattingContext::dump_items() const
{
dbgln("\033[34;1mflex-container\033[0m {}, direction: {}, current-size: {}x{}", flex_container().debug_description(), is_row_layout() ? "row" : "column", m_flex_container_state.content_width, m_flex_container_state.content_height);
for (size_t i = 0; i < m_flex_lines.size(); ++i) {
dbgln("{} flex-line #{}:", flex_container().debug_description(), i);
for (size_t j = 0; j < m_flex_lines[i].items.size(); ++j) {
auto& item = *m_flex_lines[i].items[j];
dbgln("{} flex-item #{}: {} (main:{}, cross:{})", flex_container().debug_description(), j, item.box.debug_description(), item.main_size, item.cross_size);
}
}
}
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::align_all_flex_items_along_the_cross_axis()
LibWeb: Move FFC layout algorithm step 14 to a separate function
2021-10-13 22:22:30 +02:00
{
// FIXME: Get the alignment via "align-self" of the item (which accesses "align-items" of the parent if unset)
// FIXME: Take better care of margins
float line_cross_offset = 0;
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
for (auto& flex_line : m_flex_lines) {
LibWeb: Move FFC layout algorithm step 14 to a separate function
2021-10-13 22:22:30 +02:00
for (auto* flex_item : flex_line.items) {
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
switch (flex_container().computed_values().align_items()) {
LibWeb: Move FFC layout algorithm step 14 to a separate function
2021-10-13 22:22:30 +02:00
case CSS::AlignItems::Baseline:
// FIXME: Implement this
// Fallthrough
case CSS::AlignItems::FlexStart:
case CSS::AlignItems::Stretch:
flex_item->cross_offset = line_cross_offset + flex_item->margins.cross_before;
break;
case CSS::AlignItems::FlexEnd:
flex_item->cross_offset = line_cross_offset + flex_line.cross_size - flex_item->cross_size;
break;
case CSS::AlignItems::Center:
flex_item->cross_offset = line_cross_offset + (flex_line.cross_size / 2.0f) - (flex_item->cross_size / 2.0f);
break;
default:
break;
}
}
line_cross_offset += flex_line.cross_size;
}
}
LibWeb: Move FFC layout algorithm step 15 to a separate function
2021-10-13 22:24:09 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-cross-container
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
void FlexFormattingContext::determine_flex_container_used_cross_size(float const cross_min_size, float const cross_max_size)
LibWeb: Move FFC layout algorithm step 15 to a separate function
2021-10-13 22:24:09 +02:00
{
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
float cross_size = 0;
LibWeb: Add FFC::flex_container() and use throughout Since FFC is only ever run() on the flex container, we can assume (but verify) that the run box is the flex container and use an accessor throughout. The end result: less parameter passing.
2021-10-13 22:52:50 +02:00
if (has_definite_cross_size(flex_container())) {
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
// Flex container has definite cross size: easy-peasy.
cross_size = specified_cross_size(flex_container());
LibWeb: Move FFC layout algorithm step 15 to a separate function
2021-10-13 22:24:09 +02:00
} else {
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
// Flex container has indefinite cross size.
auto cross_size_value = is_row_layout() ? flex_container().computed_values().height() : flex_container().computed_values().width();
LibWeb: Give flex containers with percentage cross size some dimensions Instead of making them zero-sized on the cross axis, just treat percentage sizes like auto for now. Better to have *some* size than none at all.
2022-03-13 00:02:03 +01:00
if (!cross_size_value.has_value() || (cross_size_value->is_length() && cross_size_value->length().is_auto()) || cross_size_value->is_percentage()) {
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
// If a content-based cross size is needed, use the sum of the flex lines' cross sizes.
float sum_of_flex_lines_cross_sizes = 0;
for (auto& flex_line : m_flex_lines) {
sum_of_flex_lines_cross_sizes += flex_line.cross_size;
}
cross_size = sum_of_flex_lines_cross_sizes;
LibWeb: Give flex containers with percentage cross size some dimensions Instead of making them zero-sized on the cross axis, just treat percentage sizes like auto for now. Better to have *some* size than none at all.
2022-03-13 00:02:03 +01:00
if (cross_size_value->is_percentage()) {
// FIXME: Handle percentage values here! Right now we're just treating them as "auto"
}
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
} else {
// Otherwise, resolve the indefinite size at this point.
cross_size = cross_size_value->resolved(flex_container(), CSS::Length::make_px(specified_cross_size(*flex_container().containing_block()))).to_px(flex_container());
LibWeb: Move FFC layout algorithm step 15 to a separate function
2021-10-13 22:24:09 +02:00
}
}
LibWeb: Support indefinite flex container cross sizes Instead of assuming that any indefinite cross size must be "auto", check what is actually is, and resolve it accordingly.
2022-02-28 00:02:00 +01:00
set_cross_size(flex_container(), clamp(cross_size, cross_min_size, cross_max_size));
LibWeb: Move FFC layout algorithm step 15 to a separate function
2021-10-13 22:24:09 +02:00
}
LibWeb: Move FFC layout algorithm step 16 to a separate function
2021-10-13 22:25:39 +02:00
// https://www.w3.org/TR/css-flexbox-1/#algo-line-align
LibWeb: Make FFC line and item vectors members instead of locals This gives all member functions access to these vectors without having to pass them as arguments.
2021-10-13 22:44:54 +02:00
void FlexFormattingContext::align_all_flex_lines()
LibWeb: Move FFC layout algorithm step 16 to a separate function
2021-10-13 22:25:39 +02:00
{
// FIXME: Support reverse
LibWeb: Fix flex line alignment in single-line flex containers For single-line flex containers, center the only flex line along the cross axis. Alignment of multi-line flex containers are left as a FIXME. This patch also moves out the assignment of final metrics to the FormattingState from align_all_flex_lines() to a separate function.
2022-02-27 23:58:54 +01:00
if (is_single_line()) {
// For single-line flex containers, we only need to center the line along the cross axis.
auto& flex_line = m_flex_lines[0];
float cross_size_of_flex_container = specified_cross_size(flex_container());
for (auto* flex_item : flex_line.items)
flex_item->cross_offset += (cross_size_of_flex_container / 2.0f) - (flex_line.cross_size / 2.0f);
} else {
// FIXME: Support align-content
LibWeb: Move FFC layout algorithm step 16 to a separate function
2021-10-13 22:25:39 +02:00
}
}
LibWeb: Fix flex line alignment in single-line flex containers For single-line flex containers, center the only flex line along the cross axis. Alignment of multi-line flex containers are left as a FIXME. This patch also moves out the assignment of final metrics to the FormattingState from align_all_flex_lines() to a separate function.
2022-02-27 23:58:54 +01:00
void FlexFormattingContext::copy_dimensions_from_flex_items_to_boxes()
{
for (auto& flex_item : m_flex_items) {
set_main_size(flex_item.box, flex_item.main_size);
set_cross_size(flex_item.box, flex_item.cross_size);
set_offset(flex_item.box, flex_item.main_offset, flex_item.cross_offset);
}
}
LibWeb: Add a very naive Layout::FlexFormattingContext :^) This is very dumb and only lays out its child boxes on a horizontal line with their shrink-to-fit widths. You have to start somewhere! :^)
2021-01-18 17:33:46 +01:00
}
Reference in a new issue Copy permalink