From b75b2de8bb8c5d2103ed99ae2a8f87975a33cde6 Mon Sep 17 00:00:00 2001 From: Eric Atkinson Date: Tue, 4 Jun 2013 11:49:16 -0700 Subject: [PATCH] Compute percent widths/margins properly and fix numerous small visual layout bugs. --- src/components/main/layout/block.rs | 34 ++++++++++++++++------------- src/components/main/layout/model.rs | 19 ++++++++-------- 2 files changed, 28 insertions(+), 25 deletions(-) diff --git a/src/components/main/layout/block.rs b/src/components/main/layout/block.rs index fc90d3273d2..6bc5e0159a2 100644 --- a/src/components/main/layout/block.rs +++ b/src/components/main/layout/block.rs @@ -196,15 +196,15 @@ impl BlockFlowData { let available_width = remaining_width - model.noncontent_width(); // Top and bottom margins for blocks are 0 if auto. - let margin_top = MaybeAuto::from_margin(style.margin_top()); - let margin_top = margin_top.spec_or_default(Au(0)); - let margin_bottom = MaybeAuto::from_margin(style.margin_bottom()); - let margin_bottom = margin_bottom.spec_or_default(Au(0)); + let margin_top = MaybeAuto::from_margin(style.margin_top(), + remaining_width).spec_or_default(Au(0)); + let margin_bottom = MaybeAuto::from_margin(style.margin_bottom(), + remaining_width).spec_or_default(Au(0)); let (width, margin_left, margin_right) = - (MaybeAuto::from_width(style.width()), - MaybeAuto::from_margin(style.margin_left()), - MaybeAuto::from_margin(style.margin_right())); + (MaybeAuto::from_width(style.width(), remaining_width), + MaybeAuto::from_margin(style.margin_left(), remaining_width), + MaybeAuto::from_margin(style.margin_right(), remaining_width)); // FIXME(pcwalton): We discard the width here. Is that correct? let (_, margin_left, margin_right) = self.compute_horiz(width, @@ -218,7 +218,7 @@ impl BlockFlowData { model.margin.left = margin_left; x_offset = model.offset(); - remaining_width = remaining_width - model.noncontent_width(); + remaining_width = width; } do box.with_mut_base |base| { @@ -243,10 +243,12 @@ impl BlockFlowData { pub fn assign_height_block(@mut self, ctx: &LayoutContext) { let mut cur_y = Au(0); + let mut top_offset = Au(0); for self.box.each |&box| { do box.with_model |model| { - cur_y += model.margin.top + model.border.top + model.padding.top; + top_offset = model.margin.top + model.border.top + model.padding.top; + cur_y += top_offset; } } @@ -260,22 +262,24 @@ impl BlockFlowData { let height = if self.is_root { Au::max(ctx.screen_size.size.height, cur_y) } else { - cur_y + cur_y - top_offset }; - - //TODO(eatkinson): compute heights using the 'height' property. - self.common.position.size.height = height; - + + let mut pb = Au(0); self.box.map(|&box| { do box.with_mut_base |base| { //The associated box is the border box of this flow base.position.origin.y = base.model.margin.top; - let pb = base.model.padding.top + base.model.padding.bottom + + pb = base.model.padding.top + base.model.padding.bottom + base.model.border.top + base.model.border.bottom; base.position.size.height = height + pb; } }); + + //TODO(eatkinson): compute heights using the 'height' property. + self.common.position.size.height = height + pb; + } pub fn build_display_list_block(@mut self, diff --git a/src/components/main/layout/model.rs b/src/components/main/layout/model.rs index 0260fd346c7..0b654978400 100644 --- a/src/components/main/layout/model.rs +++ b/src/components/main/layout/model.rs @@ -37,12 +37,12 @@ pub enum MaybeAuto { Specified(Au), } -impl MaybeAuto { - pub fn from_margin(margin: CSSMargin) -> MaybeAuto{ +impl MaybeAuto{ + pub fn from_margin(margin: CSSMargin, cb_width: Au) -> MaybeAuto{ match margin { CSSMarginAuto => Auto, //FIXME(eatkinson): Compute percents properly - CSSMarginPercentage(_) => Specified(Au(0)), + CSSMarginPercentage(percent) => Specified(cb_width.scale_by(percent/100.0)), //FIXME(eatkinson): Compute pt and em values properly CSSMarginLength(Px(v)) | CSSMarginLength(Pt(v)) | @@ -50,11 +50,10 @@ impl MaybeAuto { } } - pub fn from_width(width: CSSWidth) -> MaybeAuto{ + pub fn from_width(width: CSSWidth, cb_width: Au) -> MaybeAuto{ match width{ CSSWidthAuto => Auto, - //FIXME(eatkinson): Compute percents properly - CSSWidthPercentage(_) => Specified(Au(0)), + CSSWidthPercentage(percent) => Specified(cb_width.scale_by(percent/100.0)), //FIXME(eatkinson): Compute pt and em values properly CSSWidthLength(Px(v)) | CSSWidthLength(Pt(v)) | @@ -165,12 +164,12 @@ impl RenderBox { let border_width = border.top; let bounds = Rect { origin: Point2D { - x: abs_bounds.origin.x, - y: abs_bounds.origin.y, + x: abs_bounds.origin.x + border_width.scale_by(0.5), + y: abs_bounds.origin.y + border_width.scale_by(0.5), }, size: Size2D { - width: abs_bounds.size.width, - height: abs_bounds.size.height + width: abs_bounds.size.width - border_width, + height: abs_bounds.size.height - border_width } };