From 6cc103cf07a13b39b1701d6c19c7c05197a1c8f4 Mon Sep 17 00:00:00 2001 From: Adam Barth Date: Tue, 18 Aug 2015 16:00:36 -0700 Subject: [PATCH] Borders on Containers shouldn't overlap the content This CL inflates the padding of Container to account for the borders so that the borders are allocated space in the layout and don't draw behind the Container's child. --- .../flutter/lib/painting/box_painter.dart | 59 +++++++++++++++++++ packages/flutter/lib/rendering/box.dart | 55 ----------------- packages/flutter/lib/widgets/basic.dart | 14 ++++- 3 files changed, 71 insertions(+), 57 deletions(-) diff --git a/packages/flutter/lib/painting/box_painter.dart b/packages/flutter/lib/painting/box_painter.dart index 139eba97551..674b820c66e 100644 --- a/packages/flutter/lib/painting/box_painter.dart +++ b/packages/flutter/lib/painting/box_painter.dart @@ -10,6 +10,61 @@ import 'package:sky/base/image_resource.dart'; import 'package:sky/base/lerp.dart'; import 'package:sky/painting/shadows.dart'; +class EdgeDims { + // used for e.g. padding + const EdgeDims(this.top, this.right, this.bottom, this.left); + const EdgeDims.all(double value) + : top = value, right = value, bottom = value, left = value; + const EdgeDims.only({ this.top: 0.0, + this.right: 0.0, + this.bottom: 0.0, + this.left: 0.0 }); + const EdgeDims.symmetric({ double vertical: 0.0, + double horizontal: 0.0 }) + : top = vertical, left = horizontal, bottom = vertical, right = horizontal; + + final double top; + final double right; + final double bottom; + final double left; + + bool operator ==(other) { + if (identical(this, other)) + return true; + return other is EdgeDims + && top == other.top + && right == other.right + && bottom == other.bottom + && left == other.left; + } + + EdgeDims operator+(EdgeDims other) { + return new EdgeDims(top + other.top, + right + other.right, + bottom + other.bottom, + left + other.left); + } + + EdgeDims operator-(EdgeDims other) { + return new EdgeDims(top - other.top, + right - other.right, + bottom - other.bottom, + left - other.left); + } + + static const EdgeDims zero = const EdgeDims(0.0, 0.0, 0.0, 0.0); + + int get hashCode { + int value = 373; + value = 37 * value + top.hashCode; + value = 37 * value + left.hashCode; + value = 37 * value + bottom.hashCode; + value = 37 * value + right.hashCode; + return value; + } + String toString() => "EdgeDims($top, $right, $bottom, $left)"; +} + class BorderSide { const BorderSide({ this.color: const Color(0xFF000000), @@ -50,6 +105,10 @@ class Border { final BorderSide bottom; final BorderSide left; + EdgeDims get dimensions { + return new EdgeDims(top.width, right.width, bottom.width, left.width); + } + int get hashCode { int value = 373; value = 37 * value * top.hashCode; diff --git a/packages/flutter/lib/rendering/box.dart b/packages/flutter/lib/rendering/box.dart index a4e856854ce..820127e1524 100644 --- a/packages/flutter/lib/rendering/box.dart +++ b/packages/flutter/lib/rendering/box.dart @@ -25,61 +25,6 @@ class _DebugSize extends Size { final bool _canBeUsedByParent; } -class EdgeDims { - // used for e.g. padding - const EdgeDims(this.top, this.right, this.bottom, this.left); - const EdgeDims.all(double value) - : top = value, right = value, bottom = value, left = value; - const EdgeDims.only({ this.top: 0.0, - this.right: 0.0, - this.bottom: 0.0, - this.left: 0.0 }); - const EdgeDims.symmetric({ double vertical: 0.0, - double horizontal: 0.0 }) - : top = vertical, left = horizontal, bottom = vertical, right = horizontal; - - final double top; - final double right; - final double bottom; - final double left; - - bool operator ==(other) { - if (identical(this, other)) - return true; - return other is EdgeDims - && top == other.top - && right == other.right - && bottom == other.bottom - && left == other.left; - } - - EdgeDims operator+(EdgeDims other) { - return new EdgeDims(top + other.top, - right + other.right, - bottom + other.bottom, - left + other.left); - } - - EdgeDims operator-(EdgeDims other) { - return new EdgeDims(top - other.top, - right - other.right, - bottom - other.bottom, - left - other.left); - } - - static const EdgeDims zero = const EdgeDims(0.0, 0.0, 0.0, 0.0); - - int get hashCode { - int value = 373; - value = 37 * value + top.hashCode; - value = 37 * value + left.hashCode; - value = 37 * value + bottom.hashCode; - value = 37 * value + right.hashCode; - return value; - } - String toString() => "EdgeDims($top, $right, $bottom, $left)"; -} - class BoxConstraints extends Constraints { const BoxConstraints({ this.minWidth: 0.0, diff --git a/packages/flutter/lib/widgets/basic.dart b/packages/flutter/lib/widgets/basic.dart index 2da0fd258a6..8a4864e4cb7 100644 --- a/packages/flutter/lib/widgets/basic.dart +++ b/packages/flutter/lib/widgets/basic.dart @@ -336,14 +336,24 @@ class Container extends Component { final double width; final double height; + EdgeDims get _paddingIncludingBorder { + if (decoration == null || decoration.border == null) + return padding; + EdgeDims borderPadding = decoration.border.dimensions; + if (padding == null) + return borderPadding; + return padding + borderPadding; + } + Widget build() { Widget current = child; if (child == null && (width == null || height == null)) current = new ConstrainedBox(constraints: BoxConstraints.expand); - if (padding != null) - current = new Padding(padding: padding, child: current); + EdgeDims effectivePadding = _paddingIncludingBorder; + if (effectivePadding != null) + current = new Padding(padding: effectivePadding, child: current); if (decoration != null) current = new DecoratedBox(decoration: decoration, child: current);