Rename Container's desiredSize argument to width and height arguments.

Also change SizedBox.

This makes the code that uses Container() and SizedBox() much more readable.

The underlying RenderSizedBox is not affected by this change.

R=abarth@chromium.org, eseidel@chromium.org

Review URL: https://codereview.chromium.org/1166203002

examples/fn2/container.dart

@@ -24,13 +24,13 @@ class ContainerApp extends App {
         new Container(
           padding: new EdgeDims.all(10.0),
           margin: new EdgeDims.all(10.0),
-          desiredSize: new sky.Size(double.INFINITY, 100.0),
+          height: 100.0,
           decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFF00FF00)),
           child: new BlockContainer(
               children: [
                   new Container(
                       decoration: new BoxDecoration(backgroundColor: const sky.Color(0xFFFFFF00)),
-                      desiredSize: new sky.Size(double.INFINITY, 20.0)
+                      height: 20.0,
                   ),
                   new Image(src: "https://www.dartlang.org/logos/dart-logo.png",
                             size: new sky.Size(300.0, 300.0),

examples/stocks2/lib/stock_row.dart

@@ -32,21 +32,21 @@ class StockRow extends Component {
       // ),
       new FlexExpandingChild(new Text(stock.symbol)),
       new Container(
-        desiredSize: const sky.Size.fromWidth(75.0),
+        width: 75.0,
         padding: const EdgeDims.only(right: 16.0),
         // text-align: right
         child: new Text(lastSale)
       ),
       // text-align: right, ${typography.black.caption};
       new SizedBox(
-        desiredSize: const sky.Size.fromWidth(75.0),
+        width: 75.0,
         child: new Text(changeInPrice)
       ),
     ];
 
     return new Container(
       padding: const EdgeDims(16.0, 16.0, 20.0, 16.0),
-      desiredSize: const sky.Size.fromHeight(kHeight),
+      height: kHeight,
       decoration: const BoxDecoration(
         backgroundColor: const sky.Color(0xFFFFFFFF),
         border: const Border(

sdk/lib/framework/components2/checkbox.dart

@@ -31,7 +31,8 @@ class Checkbox extends ButtonBase {
     return new EventListenerNode(
       new Container(
         margin: const EdgeDims.symmetric(horizontal: 5.0),
-        desiredSize: new sky.Size(edgeSize + 2.0, edgeSize + 2.0),
+        width: edgeSize + 2.0,
+        height: edgeSize + 2.0,
         child: new CustomPaint(
           callback: (sky.Canvas canvas) {
 

sdk/lib/framework/components2/drawer.dart

@@ -113,10 +113,7 @@ class Drawer extends AnimatedComponent {
     Color maskColor = new Color(((_position / _kWidth + 1) * 0xFF).floor() << 24);
 
     var mask = new EventListenerNode(
-      new Container(
-        desiredSize: Size.infinite,
-        decoration: new BoxDecoration(backgroundColor: maskColor)
-      ),
+      new Container(decoration: new BoxDecoration(backgroundColor: maskColor)),
       onGestureTap: controller.handleMaskTap,
       onGestureFlingStart: controller.handleFlingStart
     );
@@ -124,7 +121,7 @@ class Drawer extends AnimatedComponent {
     Material content = new Material(
       content: new Container(
         decoration: new BoxDecoration(backgroundColor: new Color(0xFFFFFFFF)),
-        desiredSize: new Size.fromWidth(_kWidth),
+        width: _kWidth,
         transform: transform,
         child: new BlockContainer(children: children)
       ),

sdk/lib/framework/components2/drawer_header.dart

@@ -15,7 +15,7 @@ class DrawerHeader extends Component {
   UINode build() {
     return new Container(
       key: 'drawer-header-outside',
-      desiredSize: const Size.fromHeight(kStatusBarHeight + kMaterialDrawerHeight),
+      height: kStatusBarHeight + kMaterialDrawerHeight,
       decoration: new BoxDecoration(
         backgroundColor: BlueGrey[50],
         border: const Border(
@@ -31,10 +31,7 @@ class DrawerHeader extends Component {
         key: 'drawer-header-inside',
         direction: FlexDirection.vertical,
         children: [
-          new FlexExpandingChild(new Container(
-            key: 'drawer-header-spacer',
-            desiredSize: Size.infinite
-           )),
+          new FlexExpandingChild(new Container(key: 'drawer-header-spacer')),
           new Container(
             key: 'drawer-header-label',
             padding: const EdgeDims.symmetric(horizontal: 16.0),

sdk/lib/framework/components2/floating_action_button.dart

@@ -31,7 +31,8 @@ class FloatingActionButton extends Component {
           canvas.drawCircle(radius, radius, radius, new sky.Paint()..color = Red[500]);
         },
         child: new Container(
-          desiredSize: const sky.Size(_kSize, _kSize),
+          width: _kSize,
+          height: _kSize,
           child: new InkWell(children: children))),
       level: level);
   }

sdk/lib/framework/components2/menu_divider.dart

@@ -9,6 +9,7 @@ class MenuDivider extends Component {
 
   UINode build() {
     return new Container(
+      height: 0.0,
       decoration: const BoxDecoration(
         border: const Border(
           bottom: const BorderSide(

sdk/lib/framework/components2/menu_item.dart

@@ -40,7 +40,7 @@ class MenuItem extends ButtonBase {
             )
           ]
         ),
-        desiredSize: const Size.fromHeight(48.0),
+        height: 48.0,
         decoration: highlight ? highlightDecoration : null
       ),
       onGestureTap: onGestureTap

sdk/lib/framework/components2/radio.dart

@@ -33,7 +33,8 @@ class Radio extends ButtonBase {
     return new EventListenerNode(
       new Container(
         margin: const EdgeDims.symmetric(horizontal: 5.0),
-        desiredSize: new Size(diameter, diameter),
+        width: diameter,
+        height: diameter,
         child: new CustomPaint(
           callback: (sky.Canvas canvas) {
 

sdk/lib/framework/components2/scaffold.dart

@@ -80,8 +80,8 @@ class RenderScaffold extends RenderBox {
 
   static const kToolbarHeight = 100.0;
   static const kStatusbarHeight = 50.0;
-  static const kButtonX = -16.0; // from right edge of body
-  static const kButtonY = -16.0; // from bottom edge of body
+  static const kButtonX = 16.0; // left from right edge of body
+  static const kButtonY = 16.0; // up from bottom edge of body
 
   void performLayout() {
     double bodyHeight = size.height;
@@ -115,7 +115,7 @@ class RenderScaffold extends RenderBox {
     }
     if (_slots[ScaffoldSlots.floatingActionButton] != null) {
       RenderBox floatingActionButton = _slots[ScaffoldSlots.floatingActionButton];
-      Size area = new Size(size.width + kButtonX, size.height + kButtonY);
+      Size area = new Size(size.width - kButtonX, size.height - kButtonY);
       floatingActionButton.layout(new BoxConstraints.loose(area));
       assert(floatingActionButton.parentData is BoxParentData);
       floatingActionButton.parentData.position = (area - floatingActionButton.size).toPoint();

sdk/lib/framework/components2/tool_bar.dart

@@ -38,7 +38,7 @@ class ToolBar extends Component {
         children: children,
         direction: FlexDirection.horizontal
       ),
-      desiredSize: new Size.fromHeight(56.0),
+      height: 56.0,
       padding: new EdgeDims(kStatusBarHeight.toDouble(), 8.0, 0.0, 8.0),
       decoration: new BoxDecoration(backgroundColor: backgroundColor)
     );

sdk/lib/framework/fn2.dart

@@ -408,10 +408,11 @@ class SizedBox extends OneChildRenderObjectWrapper {
   final Size desiredSize;
 
   SizedBox({
-    this.desiredSize: sky.Size.infinite,
+    double width: double.INFINITY,
+    double height: double.INFINITY,
     UINode child,
     Object key
-  }) : super(child: child, key: key);
+  }) : desiredSize = new Size(width, height), super(child: child, key: key);
 
   RenderSizedBox createNode() => new RenderSizedBox(desiredSize: desiredSize);
 
@@ -958,14 +959,16 @@ class Container extends Component {
   final EdgeDims margin;
   final EdgeDims padding;
   final Matrix4 transform;
-  final Size desiredSize;
+  final double width;
+  final double height;
 
   Container({
     Object key,
     this.child,
     this.constraints,
     this.decoration,
-    this.desiredSize,
+    this.width,
+    this.height,
     this.margin,
     this.padding,
     this.transform
@@ -974,14 +977,21 @@ class Container extends Component {
   UINode build() {
     UINode current = child;
 
+    if (child == null && width == null && height == null)
+      current = new SizedBox();
+
     if (padding != null)
       current = new Padding(padding: padding, child: current);
 
     if (decoration != null)
       current = new DecoratedBox(decoration: decoration, child: current);
 
-    if (desiredSize != null)
-      current = new SizedBox(desiredSize: desiredSize, child: current);
+    if (width != null || height != null)
+      current = new SizedBox(
+        width: width == null ? double.INFINITY : width,
+        height: height == null ? double.INFINITY : height,
+        child: current
+      );
 
     if (constraints != null)
       current = new ConstrainedBox(constraints: constraints, child: current);
@@ -992,9 +1002,6 @@ class Container extends Component {
     if (transform != null)
       current = new Transform(transform: transform, child: current);
 
-    if (current == null)
-      current = new SizedBox();
-
     return current;
   }
 }