Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-09 07:25:35 +01:00
Code Issues Projects Releases Packages Wiki Activity

layout: Add support for table rows, columns, rowgroups and colgroups (#31341)

Browse source 
This adds support for table rows, columns, rowgroups and colgroups.
There are few additions here:

1. The createion of fragments, which allows script queries and hit
   testing to work properly. These fragments are empty as all cells are
   still direct descendants of the table fragment.
2. Properly handling size information from tracks and track groups as
   well as frustrating rules about reordering rowgroups.
3. Painting a background seemlessly across track groups and groups. This
   is a thing that isn't done in legacy layout (nor WebKit)!

Co-authored-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Martin Robinson 2024-02-20 14:22:02 +01:00 • committed by GitHub
parent 74c07db56c
commit 02ae1f448e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
57 changed files with 4274 additions and 21000 deletions
Download patch file Download diff file Expand all files Collapse all files

98
components/layout_2020/display_list/background.rs
View file

@ -36,62 +36,68 @@ fn get_cyclic<T>(values: &[T], layer_index: usize) -> &T {
&values[layer_index % values.len()]
}
pub(super) enum Source<'a> {
Fragment,
Canvas {
style: &'a ComputedValues,
// Theoretically the painting area is the infinite 2D plane,
// but WebRender doesn’t really do infinite so this is the part of it that can be visible.
painting_area: units::LayoutRect,
},
pub(super) struct BackgroundPainter<'a> {
pub style: &'a ComputedValues,
pub positioning_area_override: Option<units::LayoutRect>,
pub painting_area_override: Option<units::LayoutRect>,
}
pub(super) fn painting_area<'a>(
fragment_builder: &'a super::BuilderForBoxFragment,
source: &'a Source,
builder: &mut super::DisplayListBuilder,
layer_index: usize,
) -> (&'a units::LayoutRect, wr::CommonItemProperties) {
let fb = fragment_builder;
let (painting_area, clip) = match source {
Source::Canvas { painting_area, .. } => (painting_area, None),
Source::Fragment => {
let b = fb.fragment.style.get_background();
match get_cyclic(&b.background_clip.0, layer_index) {
Clip::ContentBox => (fb.content_rect(), fb.content_edge_clip(builder)),
Clip::PaddingBox => (fb.padding_rect(), fb.padding_edge_clip(builder)),
Clip::BorderBox => (&fb.border_rect, fb.border_edge_clip(builder)),
}
},
};
// The 'backgound-clip' property maps directly to `clip_rect` in `CommonItemProperties`:
let mut common = builder.common_properties(*painting_area, &fb.fragment.style);
if let Some(clip_chain_id) = clip {
common.clip_id = wr::ClipId::ClipChain(clip_chain_id)
impl<'a> BackgroundPainter<'a> {
pub(super) fn painting_area(
&self,
fragment_builder: &'a super::BuilderForBoxFragment,
builder: &mut super::DisplayListBuilder,
layer_index: usize,
) -> (&units::LayoutRect, wr::CommonItemProperties) {
let fb = fragment_builder;
let (painting_area, clip) = match self.painting_area_override {
Some(ref painting_area) => (painting_area, None),
None if self.positioning_area_override.is_none() => {
let b = self.style.get_background();
match get_cyclic(&b.background_clip.0, layer_index) {
Clip::ContentBox => (fb.content_rect(), fb.content_edge_clip(builder)),
Clip::PaddingBox => (fb.padding_rect(), fb.padding_edge_clip(builder)),
Clip::BorderBox => (&fb.border_rect, fb.border_edge_clip(builder)),
}
},
None => (&fb.border_rect, fb.border_edge_clip(builder)),
};
// The 'backgound-clip' property maps directly to `clip_rect` in `CommonItemProperties`:
let mut common = builder.common_properties(*painting_area, &fb.fragment.style);
if let Some(clip_chain_id) = clip {
common.clip_id = wr::ClipId::ClipChain(clip_chain_id)
}
(painting_area, common)
}
pub(super) fn positioning_area(
&self,
fragment_builder: &'a super::BuilderForBoxFragment,
layer_index: usize,
) -> &units::LayoutRect {
self.positioning_area_override.as_ref().unwrap_or_else(|| {
match get_cyclic(
&self.style.get_background().background_origin.0,
layer_index,
) {
Origin::ContentBox => fragment_builder.content_rect(),
Origin::PaddingBox => fragment_builder.padding_rect(),
Origin::BorderBox => &fragment_builder.border_rect,
}
})
}
(painting_area, common)
}
pub(super) fn layout_layer(
fragment_builder: &mut super::BuilderForBoxFragment,
source: &Source,
painter: &BackgroundPainter,
builder: &mut super::DisplayListBuilder,
layer_index: usize,
intrinsic: IntrinsicSizes,
) -> Option<BackgroundLayer> {
let style = match *source {
Source::Canvas { style, .. } => style,
Source::Fragment => &fragment_builder.fragment.style,
};
let b = style.get_background();
let (painting_area, common) = painting_area(fragment_builder, source, builder, layer_index);
let positioning_area = match get_cyclic(&b.background_origin.0, layer_index) {
Origin::ContentBox => fragment_builder.content_rect(),
Origin::PaddingBox => fragment_builder.padding_rect(),
Origin::BorderBox => &fragment_builder.border_rect,
};
let (painting_area, common) = painter.painting_area(fragment_builder, builder, layer_index);
let positioning_area = painter.positioning_area(fragment_builder, layer_index);
// https://drafts.csswg.org/css-backgrounds/#background-size
enum ContainOrCover {
@ -117,6 +123,8 @@ pub(super) fn layout_layer(
}
tile_size
};
let b = painter.style.get_background();
let mut tile_size = match get_cyclic(&b.background_size.0, layer_index) {
Size::Contain => size_contain_or_cover(ContainOrCover::Contain),
Size::Cover => size_contain_or_cover(ContainOrCover::Cover),

22
components/layout_2020/display_list/conversions.rs
View file

@ -2,6 +2,7 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
use app_units::Au;
use style::color::AbsoluteColor;
use style::computed_values::mix_blend_mode::T as ComputedMixBlendMode;
use style::computed_values::text_decoration_style::T as ComputedTextDecorationStyle;
@ -86,6 +87,13 @@ impl ToWebRender for PhysicalPoint<Length> {
}
}
impl ToWebRender for PhysicalPoint<Au> {
type Type = units::LayoutPoint;
fn to_webrender(&self) -> Self::Type {
units::LayoutPoint::new(self.x.to_f32_px(), self.y.to_f32_px())
}
}
impl ToWebRender for PhysicalSize<Length> {
type Type = units::LayoutSize;
fn to_webrender(&self) -> Self::Type {
@ -93,6 +101,13 @@ impl ToWebRender for PhysicalSize<Length> {
}
}
impl ToWebRender for PhysicalSize<Au> {
type Type = units::LayoutSize;
fn to_webrender(&self) -> Self::Type {
units::LayoutSize::new(self.width.to_f32_px(), self.height.to_f32_px())
}
}
impl ToWebRender for PhysicalRect<Length> {
type Type = units::LayoutRect;
fn to_webrender(&self) -> Self::Type {
@ -100,6 +115,13 @@ impl ToWebRender for PhysicalRect<Length> {
}
}
impl ToWebRender for PhysicalRect<Au> {
type Type = units::LayoutRect;
fn to_webrender(&self) -> Self::Type {
units::LayoutRect::new(self.origin.to_webrender(), self.size.to_webrender())
}
}
impl ToWebRender for PhysicalSides<Length> {
type Type = units::LayoutSideOffsets;
fn to_webrender(&self) -> Self::Type {

133
components/layout_2020/display_list/mod.rs
View file

@ -28,7 +28,7 @@ use crate::context::LayoutContext;
use crate::display_list::conversions::ToWebRender;
use crate::display_list::stacking_context::StackingContextSection;
use crate::fragment_tree::{BoxFragment, Fragment, FragmentTree, Tag, TextFragment};
use crate::geom::{PhysicalPoint, PhysicalRect};
use crate::geom::{LogicalRect, PhysicalPoint, PhysicalRect};
use crate::replaced::IntrinsicSizes;
use crate::style_ext::ComputedValuesExt;
@ -37,6 +37,7 @@ mod conversions;
mod gradient;
mod stacking_context;
use background::BackgroundPainter;
pub use stacking_context::*;
#[derive(Clone, Copy)]
@ -205,7 +206,21 @@ impl Fragment {
Visibility::Collapse => (),
},
Fragment::AbsoluteOrFixedPositioned(_) => {},
Fragment::Anonymous(_) => {},
Fragment::Positioning(positioning_fragment) => {
if let Some(style) = positioning_fragment.style.as_ref() {
let rect = positioning_fragment
.rect
.to_physical(style.writing_mode, containing_block)
.translate(containing_block.origin.to_vector());
self.maybe_push_hit_test_for_style_and_tag(
builder,
style,
positioning_fragment.base.tag,
rect,
Cursor::Default,
);
}
},
Fragment::Image(i) => match i.style.get_inherited_box().visibility {
Visibility::Visible => {
builder.is_contentful = true;
@ -265,6 +280,33 @@ impl Fragment {
}
}
fn maybe_push_hit_test_for_style_and_tag(
&self,
builder: &mut DisplayListBuilder,
style: &ComputedValues,
tag: Option<Tag>,
rect: PhysicalRect<Length>,
cursor: Cursor,
) {
let hit_info = builder.hit_info(style, tag, cursor);
let hit_info = match hit_info {
Some(hit_info) => hit_info,
None => return,
};
let clip_chain_id = builder.current_clip_chain_id;
let spatial_id = builder.current_scroll_node_id.spatial_id;
builder.wr().push_hit_test(
&CommonItemProperties {
clip_rect: rect.to_webrender(),
clip_id: ClipId::ClipChain(clip_chain_id),
spatial_id,
flags: style.get_webrender_primitive_flags(),
},
hit_info,
);
}
fn build_display_list_for_text_fragment(
&self,
fragment: &TextFragment,
@ -291,21 +333,13 @@ impl Fragment {
return;
}
if let Some(hit_info) =
builder.hit_info(&fragment.parent_style, fragment.base.tag, Cursor::Text)
{
let clip_chain_id = builder.current_clip_chain_id;
let spatial_id = builder.current_scroll_node_id.spatial_id;
builder.wr().push_hit_test(
&CommonItemProperties {
clip_rect: rect.to_webrender(),
clip_id: ClipId::ClipChain(clip_chain_id),
spatial_id,
flags: fragment.parent_style.get_webrender_primitive_flags(),
},
hit_info,
);
}
self.maybe_push_hit_test_for_style_and_tag(
builder,
&fragment.parent_style,
fragment.base.tag,
rect,
Cursor::Text,
);
let color = fragment.parent_style.clone_color();
let font_metrics = &fragment.font_metrics;
@ -540,6 +574,27 @@ impl<'a> BuilderForBoxFragment<'a> {
builder.wr().push_hit_test(&common, hit_info);
}
fn build_background_for_painter(
&mut self,
builder: &mut DisplayListBuilder,
painter: &BackgroundPainter,
) {
let b = painter.style.get_background();
let background_color = painter.style.resolve_color(b.background_color.clone());
if background_color.alpha > 0.0 {
// https://drafts.csswg.org/css-backgrounds/#background-color
// “The background color is clipped according to the background-clip
// value associated with the bottom-most background image layer.”
let layer_index = b.background_image.0.len() - 1;
let (bounds, common) = painter.painting_area(self, builder, layer_index);
builder
.wr()
.push_rect(&common, *bounds, rgba(background_color))
}
self.build_background_image(builder, painter);
}
fn build_background(&mut self, builder: &mut DisplayListBuilder) {
if self
.fragment
@ -550,34 +605,36 @@ impl<'a> BuilderForBoxFragment<'a> {
return;
}
let source = background::Source::Fragment;
let style = &self.fragment.style;
let b = style.get_background();
let background_color = style.resolve_color(b.background_color.clone());
if background_color.alpha > 0.0 {
// https://drafts.csswg.org/css-backgrounds/#background-color
// “The background color is clipped according to the background-clip
// value associated with the bottom-most background image layer.”
let layer_index = b.background_image.0.len() - 1;
let (bounds, common) = background::painting_area(self, &source, builder, layer_index);
builder
.wr()
.push_rect(&common, *bounds, rgba(background_color))
for extra_background in self.fragment.extra_backgrounds.iter() {
let positioning_area: LogicalRect<Length> = extra_background.rect.clone().into();
let painter = BackgroundPainter {
style: &extra_background.style,
painting_area_override: None,
positioning_area_override: Some(
positioning_area
.to_physical(self.fragment.style.writing_mode, self.containing_block)
.translate(self.containing_block.origin.to_vector())
.to_webrender(),
),
};
self.build_background_for_painter(builder, &painter);
}
self.build_background_image(builder, source);
let painter = BackgroundPainter {
style: &self.fragment.style,
painting_area_override: None,
positioning_area_override: None,
};
self.build_background_for_painter(builder, &painter);
}
fn build_background_image(
&mut self,
builder: &mut DisplayListBuilder,
source: background::Source<'a>,
painter: &BackgroundPainter,
) {
use style::values::computed::image::Image;
let style = match source {
background::Source::Canvas { style, .. } => style,
background::Source::Fragment => &self.fragment.style,
};
let style = painter.style;
let b = style.get_background();
// Reverse because the property is top layer first, we want to paint bottom layer first.
for (index, image) in b.background_image.0.iter().enumerate().rev() {
@ -586,7 +643,7 @@ impl<'a> BuilderForBoxFragment<'a> {
Image::Gradient(ref gradient) => {
let intrinsic = IntrinsicSizes::empty();
if let Some(layer) =
&background::layout_layer(self, &source, builder, index, intrinsic)
&background::layout_layer(self, painter, builder, index, intrinsic)
{
gradient::build(style, gradient, layer, builder)
}
@ -627,7 +684,7 @@ impl<'a> BuilderForBoxFragment<'a> {
);
if let Some(layer) =
background::layout_layer(self, &source, builder, index, intrinsic)
background::layout_layer(self, &painter, builder, index, intrinsic)
{
let image_rendering = image_rendering(style.clone_image_rendering());
if layer.repeat {

15
components/layout_2020/display_list/stacking_context.rs
View file

@ -32,7 +32,7 @@ use crate::cell::ArcRefCell;
use crate::display_list::conversions::{FilterToWebRender, ToWebRender};
use crate::display_list::DisplayListBuilder;
use crate::fragment_tree::{
AnonymousFragment, BoxFragment, ContainingBlockManager, Fragment, FragmentTree,
BoxFragment, ContainingBlockManager, Fragment, FragmentTree, PositioningFragment,
};
use crate::geom::{PhysicalRect, PhysicalSides};
use crate::style_ext::ComputedValuesExt;
@ -636,11 +636,12 @@ impl StackingContext {
let mut fragment_builder =
super::BuilderForBoxFragment::new(box_fragment, containing_block);
let source = super::background::Source::Canvas {
let painter = super::background::BackgroundPainter {
style,
painting_area,
painting_area_override: Some(painting_area),
positioning_area_override: None,
};
fragment_builder.build_background_image(builder, source);
fragment_builder.build_background_image(builder, &painter);
}
pub(crate) fn build_display_list(&self, builder: &mut DisplayListBuilder) {
@ -858,7 +859,7 @@ impl Fragment {
StackingContextBuildMode::IncludeHoisted,
);
},
Fragment::Anonymous(fragment) => {
Fragment::Positioning(fragment) => {
fragment.build_stacking_context_tree(
display_list,
containing_block,
@ -1501,7 +1502,7 @@ impl BoxFragment {
}
}
impl AnonymousFragment {
impl PositioningFragment {
fn build_stacking_context_tree(
&self,
display_list: &mut DisplayList,
@ -1511,7 +1512,7 @@ impl AnonymousFragment {
) {
let rect = self
.rect
.to_physical(self.mode, &containing_block.rect)
.to_physical(self.writing_mode, &containing_block.rect)
.translate(containing_block.rect.origin.to_vector());
let new_containing_block = containing_block.new_replacing_rect(&rect);
let new_containing_block_info =