Add more debugPaintSizeEnabled construction lines.

- padding is shown in blue with a darker blue around the child
- spacing (empty size boxes or padding) is shown in gray
- alignment from a RenderPositionedBox is shown with yellow arrows

packages/flutter/lib/src/rendering/box.dart

@@ -693,50 +693,62 @@ abstract class RenderBox extends RenderObject {
   }
 
   void debugPaint(PaintingContext context, Offset offset) {
-    if (debugPaintSizeEnabled)
-      debugPaintSize(context, offset);
-    if (debugPaintBaselinesEnabled)
-      debugPaintBaselines(context, offset);
-    if (debugPaintPointersEnabled)
-      debugPaintPointers(context, offset);
+    assert(() {
+      if (debugPaintSizeEnabled)
+        debugPaintSize(context, offset);
+      if (debugPaintBaselinesEnabled)
+        debugPaintBaselines(context, offset);
+      if (debugPaintPointersEnabled)
+        debugPaintPointers(context, offset);
+      return true;
+    });
   }
   void debugPaintSize(PaintingContext context, Offset offset) {
-    Paint paint = new Paint()
-     ..style = ui.PaintingStyle.stroke
-     ..strokeWidth = 1.0
-     ..color = debugPaintSizeColor;
-    context.canvas.drawRect(offset & size, paint);
+    assert(() {
+      Paint paint = new Paint()
+       ..style = ui.PaintingStyle.stroke
+       ..strokeWidth = 1.0
+       ..color = debugPaintSizeColor;
+      context.canvas.drawRect((offset & size).deflate(0.5), paint);
+      return true;
+    });
   }
   void debugPaintBaselines(PaintingContext context, Offset offset) {
-    Paint paint = new Paint()
-     ..style = ui.PaintingStyle.stroke
-     ..strokeWidth = 0.25;
-    Path path;
-    // ideographic baseline
-    double baselineI = getDistanceToBaseline(TextBaseline.ideographic, onlyReal: true);
-    if (baselineI != null) {
-      paint.color = debugPaintIdeographicBaselineColor;
-      path = new Path();
-      path.moveTo(offset.dx, offset.dy + baselineI);
-      path.lineTo(offset.dx + size.width, offset.dy + baselineI);
-      context.canvas.drawPath(path, paint);
-    }
-    // alphabetic baseline
-    double baselineA = getDistanceToBaseline(TextBaseline.alphabetic, onlyReal: true);
-    if (baselineA != null) {
-      paint.color = debugPaintAlphabeticBaselineColor;
-      path = new Path();
-      path.moveTo(offset.dx, offset.dy + baselineA);
-      path.lineTo(offset.dx + size.width, offset.dy + baselineA);
-      context.canvas.drawPath(path, paint);
-    }
+    assert(() {
+      Paint paint = new Paint()
+       ..style = ui.PaintingStyle.stroke
+       ..strokeWidth = 0.25;
+      Path path;
+      // ideographic baseline
+      double baselineI = getDistanceToBaseline(TextBaseline.ideographic, onlyReal: true);
+      if (baselineI != null) {
+        paint.color = debugPaintIdeographicBaselineColor;
+        path = new Path();
+        path.moveTo(offset.dx, offset.dy + baselineI);
+        path.lineTo(offset.dx + size.width, offset.dy + baselineI);
+        context.canvas.drawPath(path, paint);
+      }
+      // alphabetic baseline
+      double baselineA = getDistanceToBaseline(TextBaseline.alphabetic, onlyReal: true);
+      if (baselineA != null) {
+        paint.color = debugPaintAlphabeticBaselineColor;
+        path = new Path();
+        path.moveTo(offset.dx, offset.dy + baselineA);
+        path.lineTo(offset.dx + size.width, offset.dy + baselineA);
+        context.canvas.drawPath(path, paint);
+      }
+      return true;
+    });
   }
   void debugPaintPointers(PaintingContext context, Offset offset) {
-    if (_debugActivePointers > 0) {
-      Paint paint = new Paint()
-       ..color = new Color(debugPaintPointersColorValue | ((0x04000000 * depth) & 0xFF000000));
-      context.canvas.drawRect(offset & size, paint);
-    }
+    assert(() {
+      if (_debugActivePointers > 0) {
+        Paint paint = new Paint()
+         ..color = new Color(debugPaintPointersColorValue | ((0x04000000 * depth) & 0xFF000000));
+        context.canvas.drawRect(offset & size, paint);
+      }
+      return true;
+    });
   }
 
   void debugDescribeSettings(List<String> settings) {

packages/flutter/lib/src/rendering/debug.dart

@@ -13,12 +13,26 @@ import 'package:flutter/scheduler.dart';
 
 export 'package:flutter/services.dart' show debugPrint;
 
-/// Causes each RenderBox to paint a box around its bounds.
+/// Causes each RenderBox to paint a box around its bounds, and some extra
+/// boxes, such as RenderPadding, to draw construction lines.
 bool debugPaintSizeEnabled = false;
 
 /// The color to use when painting RenderObject bounds.
 ui.Color debugPaintSizeColor = const ui.Color(0xFF00FFFF);
 
+/// The color to use when painting some boxes that just add space (e.g. an empty
+/// RenderConstrainedBox or RenderPadding).
+ui.Color debugPaintSpacingColor = const ui.Color(0x90909090);
+
+/// The color to use when painting RenderPadding edges.
+ui.Color debugPaintPaddingColor = const ui.Color(0x900090FF);
+
+/// The color to use when painting RenderPadding edges.
+ui.Color debugPaintPaddingInnerEdgeColor = const ui.Color(0xFF0090FF);
+
+/// The color to use when painting the arrows used to show RenderPositionedBox alignment.
+ui.Color debugPaintArrowColor = const ui.Color(0xFFFFFF00);
+
 /// Causes each RenderBox to paint a line at each of its baselines.
 bool debugPaintBaselinesEnabled = false;
 

packages/flutter/lib/src/rendering/proxy_box.dart

@@ -158,6 +158,19 @@ class RenderConstrainedBox extends RenderProxyBox {
     }
   }
 
+  void debugPaintSize(PaintingContext context, Offset offset) {
+    super.debugPaintSize(context, offset);
+    assert(() {
+      Paint paint;
+      if (child == null || child.size.isEmpty) {
+        paint = new Paint()
+          ..color = debugPaintSpacingColor;
+        context.canvas.drawRect(offset & size, paint);
+      }
+      return true;
+    });
+  }
+
   void debugDescribeSettings(List<String> settings) {
     super.debugDescribeSettings(settings);
     settings.add('additionalConstraints: $additionalConstraints');

packages/flutter/lib/src/rendering/shifted_box.dart

@@ -2,9 +2,13 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:math' as math;
+import 'dart:ui' as ui;
+
 import 'package:flutter/painting.dart';
 
 import 'box.dart';
+import 'debug.dart';
 import 'object.dart';
 
 /// Abstract class for one-child-layout render boxes that provide control over
@@ -153,6 +157,50 @@ class RenderPadding extends RenderShiftedBox {
     ));
   }
 
+  void debugPaintSize(PaintingContext context, Offset offset) {
+    super.debugPaintSize(context, offset);
+    assert(() {
+      Paint paint;
+      if (child != null && !child.size.isEmpty) {
+        Path path;
+        paint = new Paint()
+          ..color = debugPaintPaddingColor;
+        path = new Path()
+          ..moveTo(offset.dx, offset.dy)
+          ..lineTo(offset.dx + size.width, offset.dy)
+          ..lineTo(offset.dx + size.width, offset.dy + size.height)
+          ..lineTo(offset.dx, offset.dy + size.height)
+          ..close()
+          ..moveTo(offset.dx + padding.left, offset.dy + padding.top)
+          ..lineTo(offset.dx + padding.left, offset.dy + size.height - padding.bottom)
+          ..lineTo(offset.dx + size.width - padding.right, offset.dy + size.height - padding.bottom)
+          ..lineTo(offset.dx + size.width - padding.right, offset.dy + padding.top)
+          ..close();
+        context.canvas.drawPath(path, paint);
+        paint = new Paint()
+          ..color = debugPaintPaddingInnerEdgeColor;
+        const kOutline = 2.0;
+        path = new Path()
+          ..moveTo(offset.dx + math.max(padding.left - kOutline, 0.0), offset.dy + math.max(padding.top - kOutline, 0.0))
+          ..lineTo(offset.dx + math.min(size.width - padding.right + kOutline, size.width), offset.dy + math.max(padding.top - kOutline, 0.0))
+          ..lineTo(offset.dx + math.min(size.width - padding.right + kOutline, size.width), offset.dy + math.min(size.height - padding.bottom + kOutline, size.height))
+          ..lineTo(offset.dx + math.max(padding.left - kOutline, 0.0), offset.dy + math.min(size.height - padding.bottom + kOutline, size.height))
+          ..close()
+          ..moveTo(offset.dx + padding.left, offset.dy + padding.top)
+          ..lineTo(offset.dx + padding.left, offset.dy + size.height - padding.bottom)
+          ..lineTo(offset.dx + size.width - padding.right, offset.dy + size.height - padding.bottom)
+          ..lineTo(offset.dx + size.width - padding.right, offset.dy + padding.top)
+          ..close();
+        context.canvas.drawPath(path, paint);
+      } else {
+        paint = new Paint()
+          ..color = debugPaintSpacingColor;
+        context.canvas.drawRect(offset & size, paint);
+      }
+      return true;
+    });
+  }
+
   void debugDescribeSettings(List<String> settings) {
     super.debugDescribeSettings(settings);
     settings.add('padding: $padding');
@@ -245,6 +293,63 @@ class RenderPositionedBox extends RenderShiftedBox {
     }
   }
 
+  void debugPaintSize(PaintingContext context, Offset offset) {
+    super.debugPaintSize(context, offset);
+    assert(() {
+      Paint paint;
+      if (child != null && !child.size.isEmpty) {
+        Path path;
+        paint = new Paint()
+          ..style = ui.PaintingStyle.stroke
+          ..strokeWidth = 1.0
+          ..color = debugPaintArrowColor;
+        path = new Path();
+        final BoxParentData childParentData = child.parentData;
+        if (childParentData.offset.dy > 0.0) {
+          // vertical alignment arrows
+          double headSize = math.min(childParentData.offset.dy * 0.2, 10.0);
+          path
+            ..moveTo(offset.dx + size.width / 2.0, offset.dy)
+            ..relativeLineTo(0.0, childParentData.offset.dy - headSize)
+            ..relativeLineTo(headSize, 0.0)
+            ..relativeLineTo(-headSize, headSize)
+            ..relativeLineTo(-headSize, -headSize)
+            ..relativeLineTo(headSize, 0.0)
+            ..moveTo(offset.dx + size.width / 2.0, offset.dy + size.height)
+            ..relativeLineTo(0.0, -childParentData.offset.dy + headSize)
+            ..relativeLineTo(headSize, 0.0)
+            ..relativeLineTo(-headSize, -headSize)
+            ..relativeLineTo(-headSize, headSize)
+            ..relativeLineTo(headSize, 0.0);
+          context.canvas.drawPath(path, paint);
+        }
+        if (childParentData.offset.dx > 0.0) {
+          // horizontal alignment arrows
+          double headSize = math.min(childParentData.offset.dx * 0.2, 10.0);
+          path
+            ..moveTo(offset.dx, offset.dy + size.height / 2.0)
+            ..relativeLineTo(childParentData.offset.dx - headSize, 0.0)
+            ..relativeLineTo(0.0, headSize)
+            ..relativeLineTo(headSize, -headSize)
+            ..relativeLineTo(-headSize, -headSize)
+            ..relativeLineTo(0.0, headSize)
+            ..moveTo(offset.dx + size.width, offset.dy + size.height / 2.0)
+            ..relativeLineTo(-childParentData.offset.dx + headSize, 0.0)
+            ..relativeLineTo(0.0, headSize)
+            ..relativeLineTo(-headSize, -headSize)
+            ..relativeLineTo(headSize, -headSize)
+            ..relativeLineTo(0.0, headSize);
+          context.canvas.drawPath(path, paint);
+        }
+      } else {
+        paint = new Paint()
+          ..color = debugPaintSpacingColor;
+        context.canvas.drawRect(offset & size, paint);
+      }
+      return true;
+    });
+  }
+
   void debugDescribeSettings(List<String> settings) {
     super.debugDescribeSettings(settings);
     settings.add('alignment: $alignment');