Merge pull request #684 from abarth/explode_box

Split box.dart into many files

examples/rendering/align_items.dart

@@ -9,6 +9,8 @@ import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 import 'solid_color_box.dart';

examples/rendering/baseline.dart

@@ -9,6 +9,8 @@ import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 RenderBox getBox(double lh) {

examples/rendering/borders.dart

@@ -6,6 +6,8 @@ import 'dart:sky' as sky;
 
 import 'package:sky/rendering/block.dart';
 import 'package:sky/rendering/box.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 void main() {

examples/rendering/flex.dart

@@ -6,6 +6,8 @@ import 'dart:sky' as sky;
 
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 class RenderSolidColor extends RenderDecoratedBox {

examples/rendering/interactive_flex.dart

@@ -8,10 +8,12 @@ import 'dart:math' as math;
 import 'package:sky/mojo/activity.dart' as activity;
 import 'package:sky/mojo/net/image_cache.dart' as image_cache;
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/image.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 import 'solid_color_box.dart';

examples/rendering/justify_content.dart

@@ -5,10 +5,11 @@
 import 'dart:sky';
 
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 import 'solid_color_box.dart';

examples/rendering/render_paragraph.dart

@@ -5,11 +5,11 @@
 import 'dart:sky';
 
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
 import 'package:sky/rendering/sky_binding.dart';
+import 'package:sky/rendering/proxy_box.dart';
 
 import 'solid_color_box.dart';
 

examples/rendering/sector_layout.dart

@@ -7,6 +7,7 @@ import 'dart:sky' as sky;
 
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/proxy_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 
 const double kTwoPi = 2 * math.PI;

examples/rendering/shadowed_box.dart

@@ -4,7 +4,8 @@
 
 import 'dart:sky';
 
-import 'package:sky/rendering/box.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 import 'package:sky/theme/colors.dart';
 import 'package:sky/theme/shadows.dart';

examples/rendering/simple_autolayout.dart

@@ -3,11 +3,12 @@
 // found in the LICENSE file.
 
 import 'dart:sky';
-import 'package:sky/rendering/box.dart';
+
+import 'package:cassowary/cassowary.dart' as al;
+import 'package:sky/rendering/auto_layout.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/proxy_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
-import 'package:sky/rendering/auto_layout.dart';
-import 'package:cassowary/cassowary.dart' as al;
 
 void main() {
   RenderDecoratedBox c1 = new RenderDecoratedBox(

examples/rendering/solid_color_box.dart

@@ -3,8 +3,10 @@
 // found in the LICENSE file.
 
 import 'dart:sky' as sky;
-import 'package:sky/rendering/object.dart';
+
 import 'package:sky/rendering/box.dart';
+import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/proxy_box.dart';
 
 class RenderSolidColorBox extends RenderDecoratedBox {
   final Size desiredSize;

examples/rendering/spinning_flex.dart

@@ -5,8 +5,9 @@
 import 'dart:sky' as sky;
 
 import 'package:sky/base/scheduler.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 import 'package:vector_math/vector_math.dart';
 

examples/rendering/transform.dart

@@ -6,6 +6,7 @@ import 'dart:sky' as sky;
 
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/proxy_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 import 'package:vector_math/vector_math.dart';
 

examples/stocks/lib/main.dart

@@ -9,7 +9,6 @@ import 'dart:sky' as sky;
 
 import 'package:sky/editing/input.dart';
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/theme/typography.dart' as typography;
 import 'package:sky/widgets.dart';

examples/widgets/container.dart

@@ -2,7 +2,6 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/widgets/raised_button.dart';
 import 'package:sky/widgets/basic.dart';

examples/widgets/ensure_visible.dart

@@ -8,7 +8,6 @@ import 'package:sky/animation/curves.dart';
 import 'package:sky/base/lerp.dart';
 import 'package:sky/painting/box_painter.dart';
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/rendering/box.dart';
 import 'package:sky/theme/colors.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/block_viewport.dart';

examples/widgets/piano.dart

@@ -5,7 +5,6 @@
 import 'package:mojo/mojo/url_response.mojom.dart';
 import 'package:sky/mojo/net/fetch.dart';
 import 'package:sky/mojo/shell.dart' as shell;
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/widgets/basic.dart';

examples/widgets/spinning_mixed.dart

@@ -5,12 +5,13 @@
 import 'dart:sky' as sky;
 
 import 'package:sky/base/scheduler.dart' as scheduler;
-import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/sky_binding.dart';
 import 'package:sky/widgets/basic.dart';
-import 'package:sky/widgets/raised_button.dart';
 import 'package:sky/widgets/framework.dart';
+import 'package:sky/widgets/raised_button.dart';
 import 'package:vector_math/vector_math.dart';
 
 import '../rendering/solid_color_box.dart';

packages/flutter/lib/rendering/image.dart

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:sky' as sky;
+
+import 'package:sky/painting/box_painter.dart';
+import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/box.dart';
+
+class RenderImage extends RenderBox {
+  RenderImage({
+    sky.Image image,
+    double width,
+    double height,
+    sky.ColorFilter colorFilter,
+    fit: ImageFit.scaleDown,
+    repeat: ImageRepeat.noRepeat
+  }) : _image = image,
+      _width = width,
+      _height = height,
+      _colorFilter = colorFilter,
+      _fit = fit,
+      _repeat = repeat;
+
+  sky.Image _image;
+  sky.Image get image => _image;
+  void set image (sky.Image value) {
+    if (value == _image)
+      return;
+    _image = value;
+    markNeedsPaint();
+    if (_width == null || _height == null)
+      markNeedsLayout();
+  }
+
+  double _width;
+  double get width => _width;
+  void set width (double value) {
+    if (value == _width)
+      return;
+    _width = value;
+    markNeedsLayout();
+  }
+
+  double _height;
+  double get height => _height;
+  void set height (double value) {
+    if (value == _height)
+      return;
+    _height = value;
+    markNeedsLayout();
+  }
+
+  sky.ColorFilter _colorFilter;
+  sky.ColorFilter get colorFilter => _colorFilter;
+  void set colorFilter (sky.ColorFilter value) {
+    if (value == _colorFilter)
+      return;
+    _colorFilter = value;
+    markNeedsPaint();
+  }
+
+  ImageFit _fit;
+  ImageFit get fit => _fit;
+  void set fit (ImageFit value) {
+    if (value == _fit)
+      return;
+    _fit = value;
+    markNeedsPaint();
+  }
+
+  ImageRepeat _repeat;
+  ImageRepeat get repeat => _repeat;
+  void set repeat (ImageRepeat value) {
+    if (value == _repeat)
+      return;
+    _repeat = value;
+    markNeedsPaint();
+  }
+
+  Size _sizeForConstraints(BoxConstraints constraints) {
+    // Folds the given |width| and |height| into |cosntraints| so they can all
+    // be treated uniformly.
+    constraints = new BoxConstraints.tightFor(
+      width: _width,
+      height: _height
+    ).apply(constraints);
+
+    if (constraints.isTight || _image == null)
+      return constraints.smallest;
+
+    // This algorithm attempts to find a size for the RenderImage that fits in
+    // the given constraints and preserves the image's intrinisc aspect ratio.
+    // Its goals as follow:
+    //
+    //  - The dimensions of the RenderImage fit within the constraints.
+    //  - The aspect ratio of the RenderImage matches the instrinsic aspect
+    //    ratio of the image.
+    //  - The RenderImage's dimension are maximal subject to being smaller than
+    //    the intrinsic size of the image.
+
+    double width = _image.width.toDouble();
+    double height = _image.height.toDouble();
+    assert(width > 0.0);
+    assert(height > 0.0);
+    double aspectRatio = width / height;
+
+    if (width > constraints.maxWidth) {
+      width = constraints.maxWidth;
+      height = width / aspectRatio;
+    }
+
+    if (height > constraints.maxHeight) {
+      height = constraints.maxHeight;
+      width = height * aspectRatio;
+    }
+
+    if (width < constraints.minWidth) {
+      width = constraints.minWidth;
+      height = width / aspectRatio;
+    }
+
+    if (height < constraints.minHeight) {
+      height = constraints.minHeight;
+      width = height * aspectRatio;
+    }
+
+    return constraints.constrain(new Size(width, height));
+  }
+
+  double getMinIntrinsicWidth(BoxConstraints constraints) {
+    if (_width == null && _height == null)
+      return constraints.constrainWidth(0.0);
+    return _sizeForConstraints(constraints).width;
+  }
+
+  double getMaxIntrinsicWidth(BoxConstraints constraints) {
+    return _sizeForConstraints(constraints).width;
+  }
+
+  double getMinIntrinsicHeight(BoxConstraints constraints) {
+    if (_width == null && _height == null)
+      return constraints.constrainHeight(0.0);
+    return _sizeForConstraints(constraints).height;
+  }
+
+  double getMaxIntrinsicHeight(BoxConstraints constraints) {
+    return _sizeForConstraints(constraints).height;
+  }
+
+  void performLayout() {
+    size = _sizeForConstraints(constraints);
+  }
+
+  void paint(PaintingContext context, Offset offset) {
+    if (_image == null)
+      return;
+    paintImage(
+      canvas: context.canvas,
+      rect: offset & size,
+      image: _image,
+      colorFilter: _colorFilter,
+      fit: _fit,
+      repeat: _repeat
+    );
+  }
+
+  String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}width: ${width}\n${prefix}height: ${height}\n';
+}

packages/flutter/lib/rendering/shifted_box.dart

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:sky/painting/box_painter.dart';
+import 'package:sky/painting/text_style.dart';
+import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/box.dart';
+
+abstract class RenderShiftedBox extends RenderBox with RenderObjectWithChildMixin<RenderBox> {
+
+  // Abstract class for one-child-layout render boxes
+
+  RenderShiftedBox(RenderBox child) {
+    this.child = child;
+  }
+
+  double getMinIntrinsicWidth(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMinIntrinsicWidth(constraints);
+    return super.getMinIntrinsicWidth(constraints);
+  }
+
+  double getMaxIntrinsicWidth(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMaxIntrinsicWidth(constraints);
+    return super.getMaxIntrinsicWidth(constraints);
+  }
+
+  double getMinIntrinsicHeight(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMinIntrinsicHeight(constraints);
+    return super.getMinIntrinsicHeight(constraints);
+  }
+
+  double getMaxIntrinsicHeight(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMaxIntrinsicHeight(constraints);
+    return super.getMaxIntrinsicHeight(constraints);
+  }
+
+  double computeDistanceToActualBaseline(TextBaseline baseline) {
+    double result;
+    if (child != null) {
+      assert(!needsLayout);
+      result = child.getDistanceToActualBaseline(baseline);
+      assert(child.parentData is BoxParentData);
+      if (result != null)
+        result += child.parentData.position.y;
+    } else {
+      result = super.computeDistanceToActualBaseline(baseline);
+    }
+    return result;
+  }
+
+  void paint(PaintingContext context, Offset offset) {
+    if (child != null)
+      context.paintChild(child, child.parentData.position + offset);
+  }
+
+  void hitTestChildren(HitTestResult result, { Point position }) {
+    if (child != null) {
+      assert(child.parentData is BoxParentData);
+      child.hitTest(result, position: new Point(position.x - child.parentData.position.x,
+                                                position.y - child.parentData.position.y));
+    }
+  }
+
+}
+
+class RenderPadding extends RenderShiftedBox {
+
+  RenderPadding({ EdgeDims padding, RenderBox child }) : super(child) {
+    assert(padding != null);
+    this.padding = padding;
+  }
+
+  EdgeDims _padding;
+  EdgeDims get padding => _padding;
+  void set padding (EdgeDims value) {
+    assert(value != null);
+    if (_padding == value)
+      return;
+    _padding = value;
+    markNeedsLayout();
+  }
+
+  double getMinIntrinsicWidth(BoxConstraints constraints) {
+    double totalPadding = padding.left + padding.right;
+    if (child != null)
+      return child.getMinIntrinsicWidth(constraints.deflate(padding)) + totalPadding;
+    return constraints.constrainWidth(totalPadding);
+  }
+
+  double getMaxIntrinsicWidth(BoxConstraints constraints) {
+    double totalPadding = padding.left + padding.right;
+    if (child != null)
+      return child.getMaxIntrinsicWidth(constraints.deflate(padding)) + totalPadding;
+    return constraints.constrainWidth(totalPadding);
+  }
+
+  double getMinIntrinsicHeight(BoxConstraints constraints) {
+    double totalPadding = padding.top + padding.bottom;
+    if (child != null)
+      return child.getMinIntrinsicHeight(constraints.deflate(padding)) + totalPadding;
+    return constraints.constrainHeight(totalPadding);
+  }
+
+  double getMaxIntrinsicHeight(BoxConstraints constraints) {
+    double totalPadding = padding.top + padding.bottom;
+    if (child != null)
+      return child.getMaxIntrinsicHeight(constraints.deflate(padding)) + totalPadding;
+    return constraints.constrainHeight(totalPadding);
+  }
+
+  void performLayout() {
+    assert(padding != null);
+    if (child == null) {
+      size = constraints.constrain(new Size(
+        padding.left + padding.right,
+        padding.top + padding.bottom
+      ));
+      return;
+    }
+    BoxConstraints innerConstraints = constraints.deflate(padding);
+    child.layout(innerConstraints, parentUsesSize: true);
+    assert(child.parentData is BoxParentData);
+    child.parentData.position = new Point(padding.left, padding.top);
+    size = constraints.constrain(new Size(
+      padding.left + child.size.width + padding.right,
+      padding.top + child.size.height + padding.bottom
+    ));
+  }
+
+  String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}padding: ${padding}\n';
+}
+
+class RenderPositionedBox extends RenderShiftedBox {
+
+  // This box aligns a child box within itself. It's only useful for
+  // children that don't always size to fit their parent. For example,
+  // to align a box at the bottom right, you would pass this box a
+  // tight constraint that is bigger than the child's natural size,
+  // with horizontal and vertical set to 1.0.
+
+  RenderPositionedBox({
+    RenderBox child,
+    double horizontal: 0.5,
+    double vertical: 0.5
+  }) : _horizontal = horizontal,
+       _vertical = vertical,
+       super(child) {
+    assert(horizontal != null);
+    assert(vertical != null);
+  }
+
+  double _horizontal;
+  double get horizontal => _horizontal;
+  void set horizontal (double value) {
+    assert(value != null);
+    if (_horizontal == value)
+      return;
+    _horizontal = value;
+    markNeedsLayout();
+  }
+
+  double _vertical;
+  double get vertical => _vertical;
+  void set vertical (double value) {
+    assert(value != null);
+    if (_vertical == value)
+      return;
+    _vertical = value;
+    markNeedsLayout();
+  }
+
+  void performLayout() {
+    if (child != null) {
+      child.layout(constraints.loosen(), parentUsesSize: true);
+      size = constraints.constrain(child.size);
+      assert(child.parentData is BoxParentData);
+      Offset delta = size - child.size;
+      child.parentData.position = (delta.scale(horizontal, vertical)).toPoint();
+    } else {
+      performResize();
+    }
+  }
+
+  String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}horizontal: ${horizontal}\n${prefix}vertical: ${vertical}\n';
+}
+
+class RenderBaseline extends RenderShiftedBox {
+
+  RenderBaseline({
+    RenderBox child,
+    double baseline,
+    TextBaseline baselineType
+  }) : _baseline = baseline,
+       _baselineType = baselineType,
+       super(child) {
+    assert(baseline != null);
+    assert(baselineType != null);
+  }
+
+  double _baseline;
+  double get baseline => _baseline;
+  void set baseline (double value) {
+    assert(value != null);
+    if (_baseline == value)
+      return;
+    _baseline = value;
+    markNeedsLayout();
+  }
+
+  TextBaseline _baselineType;
+  TextBaseline get baselineType => _baselineType;
+  void set baselineType (TextBaseline value) {
+    assert(value != null);
+    if (_baselineType == value)
+      return;
+    _baselineType = value;
+    markNeedsLayout();
+  }
+
+  void performLayout() {
+    if (child != null) {
+      child.layout(constraints.loosen(), parentUsesSize: true);
+      size = constraints.constrain(child.size);
+      assert(child.parentData is BoxParentData);
+      double delta = baseline - child.getDistanceToBaseline(baselineType);
+      child.parentData.position = new Point(0.0, delta);
+    } else {
+      performResize();
+    }
+  }
+
+  String debugDescribeSettings(String prefix) => '${super.debugDescribeSettings(prefix)}${prefix}baseline: ${baseline}\nbaselineType: ${baselineType}';
+}

packages/flutter/lib/rendering/sky_binding.dart

@@ -4,10 +4,11 @@
 
 import 'dart:sky' as sky;
 
-import 'package:sky/base/scheduler.dart' as scheduler;
 import 'package:sky/base/hit_test.dart';
+import 'package:sky/base/scheduler.dart' as scheduler;
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/view.dart';
 
 int _hammingWeight(int value) {
   if (value == 0)

packages/flutter/lib/rendering/toggleable.dart

@@ -9,6 +9,7 @@ import 'package:sky/animation/animation_performance.dart';
 import 'package:sky/animation/curves.dart';
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/proxy_box.dart';
 
 typedef void ValueChanged(bool value);
 

packages/flutter/lib/rendering/view.dart

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:sky' as sky;
+
+import 'package:sky/rendering/layer.dart';
+import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/box.dart';
+import 'package:vector_math/vector_math.dart';
+
+class ViewConstraints {
+  const ViewConstraints({
+    this.size: Size.zero,
+    this.orientation
+  });
+  final Size size;
+  final int orientation;
+}
+
+class RenderView extends RenderObject with RenderObjectWithChildMixin<RenderBox> {
+  RenderView({
+    RenderBox child,
+    this.timeForRotation: const Duration(microseconds: 83333)
+  }) {
+    this.child = child;
+  }
+
+  Size _size = Size.zero;
+  Size get size => _size;
+
+  int _orientation; // 0..3
+  int get orientation => _orientation;
+  Duration timeForRotation;
+
+  ViewConstraints _rootConstraints;
+  ViewConstraints get rootConstraints => _rootConstraints;
+  void set rootConstraints(ViewConstraints value) {
+    if (_rootConstraints == value)
+      return;
+    _rootConstraints = value;
+    markNeedsLayout();
+  }
+
+  ContainerLayer _rootLayer;
+
+  // We never call layout() on this class, so this should never get
+  // checked. (This class is laid out using scheduleInitialLayout().)
+  bool debugDoesMeetConstraints() { assert(false); return false; }
+
+  void performResize() {
+    assert(false);
+  }
+
+  void performLayout() {
+    if (_rootConstraints.orientation != _orientation) {
+      if (_orientation != null && child != null)
+        child.rotate(oldAngle: _orientation, newAngle: _rootConstraints.orientation, time: timeForRotation);
+      _orientation = _rootConstraints.orientation;
+    }
+    _size = _rootConstraints.size;
+    assert(!_size.isInfinite);
+
+    if (child != null)
+      child.layout(new BoxConstraints.tight(_size));
+  }
+
+  void rotate({ int oldAngle, int newAngle, Duration time }) {
+    assert(false); // nobody tells the screen to rotate, the whole rotate() dance is started from our performResize()
+  }
+
+  bool hitTest(HitTestResult result, { Point position }) {
+    if (child != null) {
+      Rect childBounds = Point.origin & child.size;
+      if (childBounds.contains(position))
+        child.hitTest(result, position: position);
+    }
+    result.add(new HitTestEntry(this));
+    return true;
+  }
+
+  void paint(PaintingContext context, Offset offset) {
+    if (child != null)
+      context.paintChild(child, offset.toPoint());
+  }
+
+  void paintFrame() {
+    sky.tracing.begin('RenderView.paintFrame');
+    try {
+      final double devicePixelRatio = sky.view.devicePixelRatio;
+      Matrix4 transform = new Matrix4.diagonal3Values(devicePixelRatio, devicePixelRatio, 1.0);
+      _rootLayer = new TransformLayer(transform: transform);
+      PaintingContext context = new PaintingContext(Offset.zero, size);
+      _rootLayer.add(context.layer);
+      context.paintChild(child, Point.origin);
+      context.endRecording();
+    } finally {
+      sky.tracing.end('RenderView.paintFrame');
+    }
+  }
+
+  void compositeFrame() {
+    sky.tracing.begin('RenderView.compositeFrame');
+    try {
+      sky.PictureRecorder recorder = new sky.PictureRecorder();
+      sky.Canvas canvas = new sky.Canvas(recorder, Point.origin & (size * sky.view.devicePixelRatio));
+      _rootLayer.paint(canvas);
+      sky.view.picture = recorder.endRecording();
+    } finally {
+      sky.tracing.end('RenderView.compositeFrame');
+    }
+  }
+
+  Rect get paintBounds => Point.origin & size;
+}

packages/flutter/lib/rendering/viewport.dart

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:sky' as sky;
+
+import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/box.dart';
+import 'package:vector_math/vector_math.dart';
+
+enum ScrollDirection { horizontal, vertical, both }
+
+class RenderViewport extends RenderBox with RenderObjectWithChildMixin<RenderBox> {
+
+  RenderViewport({
+    RenderBox child,
+    Offset scrollOffset,
+    ScrollDirection scrollDirection: ScrollDirection.vertical
+  }) : _scrollOffset = scrollOffset,
+       _scrollDirection = scrollDirection {
+    assert(_offsetIsSane(scrollOffset, scrollDirection));
+    this.child = child;
+  }
+
+  bool _offsetIsSane(Offset offset, ScrollDirection direction) {
+    switch (direction) {
+      case ScrollDirection.both:
+        return true;
+      case ScrollDirection.horizontal:
+        return offset.dy == 0.0;
+      case ScrollDirection.vertical:
+        return offset.dx == 0.0;
+    }
+  }
+
+  Offset _scrollOffset;
+  Offset get scrollOffset => _scrollOffset;
+  void set scrollOffset(Offset value) {
+    if (value == _scrollOffset)
+      return;
+    assert(_offsetIsSane(value, scrollDirection));
+    _scrollOffset = value;
+    markNeedsPaint();
+  }
+
+  ScrollDirection _scrollDirection;
+  ScrollDirection get scrollDirection => _scrollDirection;
+  void set scrollDirection(ScrollDirection value) {
+    if (value == _scrollDirection)
+      return;
+    assert(_offsetIsSane(scrollOffset, value));
+    _scrollDirection = value;
+    markNeedsLayout();
+  }
+
+  BoxConstraints _getInnerConstraints(BoxConstraints constraints) {
+    BoxConstraints innerConstraints;
+    switch (scrollDirection) {
+      case ScrollDirection.both:
+        innerConstraints = new BoxConstraints();
+        break;
+      case ScrollDirection.horizontal:
+        innerConstraints = constraints.heightConstraints();
+        break;
+      case ScrollDirection.vertical:
+        innerConstraints = constraints.widthConstraints();
+        break;
+    }
+    return innerConstraints;
+  }
+
+  double getMinIntrinsicWidth(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMinIntrinsicWidth(_getInnerConstraints(constraints));
+    return super.getMinIntrinsicWidth(constraints);
+  }
+
+  double getMaxIntrinsicWidth(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMaxIntrinsicWidth(_getInnerConstraints(constraints));
+    return super.getMaxIntrinsicWidth(constraints);
+  }
+
+  double getMinIntrinsicHeight(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMinIntrinsicHeight(_getInnerConstraints(constraints));
+    return super.getMinIntrinsicHeight(constraints);
+  }
+
+  double getMaxIntrinsicHeight(BoxConstraints constraints) {
+    if (child != null)
+      return child.getMaxIntrinsicHeight(_getInnerConstraints(constraints));
+    return super.getMaxIntrinsicHeight(constraints);
+  }
+
+  // We don't override computeDistanceToActualBaseline(), because we
+  // want the default behaviour (returning null). Otherwise, as you
+  // scroll the RenderViewport, it would shift in its parent if the
+  // parent was baseline-aligned, which makes no sense.
+
+  void performLayout() {
+    if (child != null) {
+      child.layout(_getInnerConstraints(constraints), parentUsesSize: true);
+      size = constraints.constrain(child.size);
+      assert(child.parentData is BoxParentData);
+      child.parentData.position = Point.origin;
+    } else {
+      performResize();
+    }
+  }
+
+  Offset get _scrollOffsetRoundedToIntegerDevicePixels {
+    double devicePixelRatio = sky.view.devicePixelRatio;
+    int dxInDevicePixels = (scrollOffset.dx * devicePixelRatio).round();
+    int dyInDevicePixels = (scrollOffset.dy * devicePixelRatio).round();
+    return new Offset(dxInDevicePixels / devicePixelRatio,
+                      dyInDevicePixels / devicePixelRatio);
+  }
+
+  void paint(PaintingContext context, Offset offset) {
+    if (child != null) {
+      Offset roundedScrollOffset = _scrollOffsetRoundedToIntegerDevicePixels;
+      bool _needsClip = offset < Offset.zero ||
+                        !(offset & size).contains(((offset - roundedScrollOffset) & child.size).bottomRight);
+      if (_needsClip) {
+        context.canvas.save();
+        context.canvas.clipRect(offset & size);
+      }
+      context.paintChild(child, (offset - roundedScrollOffset).toPoint());
+      if (_needsClip)
+        context.canvas.restore();
+    }
+  }
+
+  void applyPaintTransform(Matrix4 transform) {
+    super.applyPaintTransform(transform);
+    transform.translate(-scrollOffset.dx, -scrollOffset.dy);
+  }
+
+  void hitTestChildren(HitTestResult result, { Point position }) {
+    if (child != null) {
+      assert(child.parentData is BoxParentData);
+      Point transformed = position + _scrollOffsetRoundedToIntegerDevicePixels;
+      child.hitTest(result, position: transformed);
+    }
+  }
+}

packages/flutter/lib/widgets/basic.dart

@@ -14,18 +14,24 @@ import 'package:sky/painting/paragraph_painter.dart';
 import 'package:sky/rendering/block.dart';
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/flex.dart';
+import 'package:sky/rendering/image.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/paragraph.dart';
+import 'package:sky/rendering/proxy_box.dart';
+import 'package:sky/rendering/shifted_box.dart';
 import 'package:sky/rendering/stack.dart';
+import 'package:sky/rendering/viewport.dart';
 import 'package:sky/widgets/default_text_style.dart';
 import 'package:sky/widgets/framework.dart';
 
 export 'package:sky/base/hit_test.dart' show EventDisposition, combineEventDispositions;
 export 'package:sky/rendering/block.dart' show BlockDirection;
-export 'package:sky/rendering/box.dart' show BackgroundImage, BoxConstraints, BoxDecoration, Border, BorderSide, EdgeDims, ScrollDirection;
+export 'package:sky/rendering/box.dart' show BoxConstraints;
 export 'package:sky/rendering/flex.dart' show FlexDirection, FlexJustifyContent, FlexAlignItems;
 export 'package:sky/rendering/object.dart' show Point, Offset, Size, Rect, Color, Paint, Path;
+export 'package:sky/rendering/proxy_box.dart' show BackgroundImage, BoxDecoration, BoxShadow, Border, BorderSide, EdgeDims;
 export 'package:sky/rendering/toggleable.dart' show ValueChanged;
+export 'package:sky/rendering/viewport.dart' show ScrollDirection;
 export 'package:sky/widgets/framework.dart' show Key, GlobalKey, Widget, Component, StatefulComponent, App, runApp, Listener, ParentDataNode;
 
 // PAINTING NODES

packages/flutter/lib/widgets/framework.dart

@@ -12,6 +12,7 @@ import 'package:sky/mojo/activity.dart' as activity;
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
 import 'package:sky/rendering/sky_binding.dart';
+import 'package:sky/rendering/view.dart';
 
 export 'package:sky/base/hit_test.dart' show EventDisposition, combineEventDispositions;
 export 'package:sky/rendering/box.dart' show BoxConstraints, BoxDecoration, Border, BorderSide, EdgeDims;

packages/flutter/lib/widgets/icon_button.dart

@@ -4,7 +4,6 @@
 
 import 'dart:sky' as sky;
 
-import 'package:sky/rendering/box.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/icon.dart';
 import 'package:sky/widgets/framework.dart';

packages/flutter/lib/widgets/ink_well.dart

@@ -10,6 +10,7 @@ import 'package:sky/animation/animation_performance.dart';
 import 'package:sky/animation/curves.dart';
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/proxy_box.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/framework.dart';
 

packages/flutter/lib/widgets/scrollable.dart

@@ -10,6 +10,7 @@ import 'package:sky/animation/animated_simulation.dart';
 import 'package:sky/animation/animation_performance.dart';
 import 'package:sky/animation/scroll_behavior.dart';
 import 'package:sky/rendering/box.dart';
+import 'package:sky/rendering/viewport.dart';
 import 'package:sky/theme/view_configuration.dart' as config;
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/block_viewport.dart';

packages/flutter/lib/widgets/tabs.dart

@@ -13,6 +13,7 @@ import 'package:sky/animation/scroll_behavior.dart';
 import 'package:sky/painting/text_style.dart';
 import 'package:sky/rendering/box.dart';
 import 'package:sky/rendering/object.dart';
+import 'package:sky/rendering/viewport.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/theme/typography.dart' as typography;
 import 'package:sky/widgets/basic.dart';