Improve widgets/README.md based on Hixie's feeback

sky/sdk/lib/widgets/README.md

Index: sky/sdk/lib/widgets/README.md
diff --git a/sky/sdk/lib/widgets/README.md b/sky/sdk/lib/widgets/README.md
index ea79e329a60b165b0b43652f674ba9e54d864188..67510a32599a9ebe6b6049453c8b60c863b452e7 100644
--- a/sky/sdk/lib/widgets/README.md
+++ b/sky/sdk/lib/widgets/README.md
@@ -69,16 +69,16 @@ import 'package:sky/widgets/basic.dart';
 class MyToolBar extends Component {
   Widget build() {
     return new Container(
-      child: new Flex([
-        new Image(src: 'menu.png', size: const Size(25.0, 25.0)),
-        new Flexible(child: new Text('My awesome toolbar')),
-        new Image(src: 'search.png', size: const Size(25.0, 25.0)),
-      ]),
       height: 56.0,
       padding: new EdgeDims.symmetric(horizontal: 8.0),
       decoration: const BoxDecoration(

[Hixie, 2015/06/17 17:13:16]

decoration should go first, since you say "cyan" before "56".

[abarth-chromium, 2015/06/17 17:39:29]

Done.

         backgroundColor: const Color(0xFF00FFFF),
-      )
+      ),
+      child: new Flex([
+        new Image(src: 'menu.png', size: const Size(25.0, 25.0)),
+        new Flexible(child: new Text('My awesome toolbar')),
+        new Image(src: 'search.png', size: const Size(25.0, 25.0)),
+      ])
     );
   }
 }
@@ -113,8 +113,9 @@ void main() {
 ```
 
 Here, we've used the `Center` widget to center the toolbar within the view, both
-vertically and horizontally. Because the toolbar uses a flexible layout
-internally, it expands to fill all the available horizontal space.
+vertically and horizontally. If we didn't center the toolbar, it would fill the
+view, both vertically and horizontally, because the root widget is sized to fill
+the view.
 
 Listening to Events
 -------------------
@@ -137,18 +138,18 @@ final BoxDecoration _decoration = new BoxDecoration(
 class MyButton extends Component {
   Widget build() {
     return new Listener(
+      onGestureTap: (event) {
+        print('MyButton was tapped!');
+      },
       child: new Container(
-        child: new Center(
-          child: new Text('Engage')
-        ),
         height: 36.0,
         padding: new EdgeDims.all(8.0),
         margin: new EdgeDims.symmetric(horizontal: 8.0),
-        decoration: _decoration
-      ),
-      onGestureTap: (event) {
-        print('MyButton was tapped!');
-      }
+        decoration: _decoration,
+        child: new Center(
+          child: new Text('Engage')
+        )
+      )
     );
   }
 }
@@ -180,17 +181,17 @@ class MyButton extends Component {
 
   Widget build() {
     return new Listener(
+      onGestureTap: (_) {
+        if (onPressed != null)
+          onPressed();
+      },
       child: new Container(
-        child: new Center(child: child),
         height: 36.0,
         padding: new EdgeDims.all(8.0),
         margin: new EdgeDims.symmetric(horizontal: 8.0),
-        decoration: _decoration
-      ),
-      onGestureTap: (_) {
-        if (onPressed != null)
-          onPressed();
-      }
+        decoration: _decoration,
+        child: new Center(child: child)
+      )
     );
   }
 }
@@ -208,8 +209,8 @@ button:
         child: new Flex([
           new Image(src: 'thumbs-up.png', size: const Size(25.0, 25.0)),
           new Container(
-            child: new Text('Thumbs up'),
             padding: new EdgeDims.only(left: 10.0)
+            child: new Text('Thumbs up'),
           )
         ])
       )