Add a `color` argument to `Container`. (#8396)

It's common to just want a simple colored box. Simple thing should be simple,
so this patch adds a convenience argument to Continer for creating a box
decoration that is just a color.

Fixes #5555

dev/manual_tests/card_collection.dart

@@ -324,7 +324,7 @@ class CardCollectionState extends State<CardCollection> {
         child: new SingleChildScrollView(
           child: new Container(
             height: cardModel.height,
-            decoration: new BoxDecoration(backgroundColor: theme.primaryColor),
+            color: theme.primaryColor,
             child: new Row(
               children: <Widget>[
                 leftArrowIcon,
@@ -378,7 +378,7 @@ class CardCollectionState extends State<CardCollection> {
 
     Widget body = new Container(
       padding: const EdgeInsets.symmetric(vertical: 12.0, horizontal: 8.0),
-      decoration: new BoxDecoration(backgroundColor: _primaryColor[50]),
+      color: _primaryColor[50],
       child: cardCollection,
     );
 

examples/flutter_gallery/lib/demo/colors_demo.dart

@@ -58,7 +58,7 @@ class ColorItem extends StatelessWidget {
     return new Container(
       height: kColorItemHeight,
       padding: const EdgeInsets.symmetric(horizontal: 16.0),
-      decoration: new BoxDecoration(backgroundColor: color),
+      color: color,
       child: new Row(
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         crossAxisAlignment: CrossAxisAlignment.center,

examples/flutter_gallery/lib/demo/leave_behind_demo.dart

@@ -102,13 +102,13 @@ class LeaveBehindDemoState extends State<LeaveBehindDemo> {
         ));
       },
       background: new Container(
-        decoration: new BoxDecoration(backgroundColor: theme.primaryColor),
+        color: theme.primaryColor,
         child: new ListItem(
           leading: new Icon(Icons.delete, color: Colors.white, size: 36.0)
         )
       ),
       secondaryBackground: new Container(
-        decoration: new BoxDecoration(backgroundColor: theme.primaryColor),
+        color: theme.primaryColor,
         child: new ListItem(
           trailing: new Icon(Icons.archive, color: Colors.white, size: 36.0)
         )

packages/flutter/lib/src/material/date_picker.dart

@@ -116,7 +116,7 @@ class _DatePickerHeader extends StatelessWidget {
       width: width,
       height: height,
       padding: padding,
-      decoration: new BoxDecoration(backgroundColor: backgroundColor),
+      color: backgroundColor,
       child: new Column(
         mainAxisAlignment: mainAxisAlignment,
         crossAxisAlignment: CrossAxisAlignment.start,

packages/flutter/lib/src/material/popup_menu.dart

@@ -275,7 +275,7 @@ class _PopupMenu<T> extends StatelessWidget {
       Widget item = route.items[i];
       if (route.initialValue != null && route.initialValue == route.items[i].value) {
         item = new Container(
-          decoration: new BoxDecoration(backgroundColor: Theme.of(context).highlightColor),
+          color: Theme.of(context).highlightColor,
           child: item
         );
       }

packages/flutter/lib/src/material/time_picker.dart

@@ -334,7 +334,7 @@ class _TimePickerHeader extends StatelessWidget {
       width: width,
       height: height,
       padding: padding,
-      decoration: new BoxDecoration(backgroundColor: backgroundColor),
+      color: backgroundColor,
       child: new CustomMultiChildLayout(
         delegate: new _TimePickerHeaderLayout(orientation),
         children: <Widget>[

packages/flutter/lib/src/widgets/container.dart

@@ -80,11 +80,18 @@ class Container extends StatelessWidget {
   /// Creates a widget that combines common painting, positioning, and sizing widgets.
   ///
   /// The `height` and `width` values include the padding.
+  ///
+  /// The `color` argument is a shorthand for
+  /// `decoration: new BoxDecoration(backgroundColor: color)`, which means you
+  /// cannot supply both a `color` and a `decoration` argument. If you want to
+  /// have both a `color` and a `decoration`, you can pass the color as the
+  /// `backgroundColor` argument to the `BoxDecoration`.
   Container({
     Key key,
     this.alignment,
     this.padding,
-    this.decoration,
+    Color color,
+    Decoration decoration,
     this.foregroundDecoration,
     double width,
     double height,
@@ -92,7 +99,8 @@ class Container extends StatelessWidget {
     this.margin,
     this.transform,
     this.child,
-  }) : constraints =
+  }) : decoration = decoration ?? (color != null ? new BoxDecoration(backgroundColor: color) : null),
+       constraints =
         (width != null || height != null)
           ? constraints?.tighten(width: width, height: height)
             ?? new BoxConstraints.tightFor(width: width, height: height)
@@ -102,6 +110,10 @@ class Container extends StatelessWidget {
     assert(padding == null || padding.isNonNegative);
     assert(decoration == null || decoration.debugAssertIsValid());
     assert(constraints == null || constraints.debugAssertIsValid());
+    assert(color == null || decoration == null,
+      'Cannot provide both a color and a decoration\n'
+      'The color argument is just a shorthand for "decoration: new BoxDecoration(backgroundColor: color)".'
+    );
   }
 
   /// The [child] contained by the container.

packages/flutter/test/material/app_bar_test.dart

@@ -24,7 +24,7 @@ Widget buildSliverAppBarApp({ bool floating, bool pinned, double expandedHeight
         new SliverToBoxAdapter(
           child: new Container(
             height: 1200.0,
-            decoration: new BoxDecoration(backgroundColor: Colors.orange[400]),
+            color: Colors.orange[400],
           ),
         ),
       ],

packages/flutter/test/material/scaffold_test.dart

@@ -189,7 +189,7 @@ void main() {
         theme: new ThemeData(platform: TargetPlatform.android),
         home: new Scaffold(
           appBar: new AppBar(
-            title: new Text('Title')
+            title: new Text('Title'),
           ),
           body: new Builder(
             builder: (BuildContext context) {
@@ -198,16 +198,16 @@ void main() {
                   Scaffold.of(context).showBottomSheet<Null>((BuildContext context) {
                     return new Container(
                       key: sheetKey,
-                      decoration: new BoxDecoration(backgroundColor: Colors.blue[500])
+                      color: Colors.blue[500],
                     );
                   });
                 },
-                child: new Text('X')
+                child: new Text('X'),
               );
-            }
-          )
-        )
-      )
+            },
+          ),
+        ),
+      ),
     );
 
     await tester.tap(find.text('X'));

packages/flutter/test/widgets/rotated_box_test.dart

@@ -23,21 +23,21 @@ void main() {
                 child: new Container(
                   width: 100.0,
                   height: 40.0,
-                  decoration: new BoxDecoration(backgroundColor: Colors.blue[500])
-                )
+                  color: Colors.blue[500],
+                ),
               ),
               new GestureDetector(
                 onTap: () { log.add('right'); },
                 child: new Container(
                   width: 75.0,
                   height: 65.0,
-                  decoration: new BoxDecoration(backgroundColor: Colors.blue[500])
-                )
+                  color: Colors.blue[500],
+                ),
               ),
-            ]
-          )
-        )
-      )
+            ],
+          ),
+        ),
+      ),
     );
 
     RenderBox box = tester.renderObject(find.byKey(rotatedBoxKey));

packages/flutter/test/widgets/semantics_debugger_test.dart

@@ -165,8 +165,7 @@ void main() {
             new Container(
               key: childKey,
               height: 5000.0,
-              decoration:
-                new BoxDecoration(backgroundColor: Colors.green[500]),
+              color: Colors.green[500],
             ),
           ],
         ),