Merge branch 'master' of github.com:domokit/sky_engine

packages/flutter/BUILD.gn

@@ -52,7 +52,6 @@ dart_pkg("sky") {
     "lib/theme/view_configuration.dart",
     "lib/widgets/animated_component.dart",
     "lib/widgets/animated_container.dart",
-    "lib/widgets/animation_builder.dart",
     "lib/widgets/basic.dart",
     "lib/widgets/block_viewport.dart",
     "lib/widgets/button_base.dart",

packages/flutter/example/demo_launcher/lib/main.dart

@@ -60,9 +60,9 @@ class SkyDemo {
     this.description,
     this.textTheme,
     this.decoration
-  }) : name = name, key = name;
+  }) : name = name, key = new Key(name);
   final String name;
-  final String key;
+  final Key key;
   final String href;
   final String bundle;
   final String description;

packages/flutter/example/fitness/lib/home.dart → packages/flutter/example/fitness/lib/feed.dart

@@ -4,13 +4,12 @@
 
 import 'package:sky/painting/text_style.dart';
 import 'package:sky/widgets/basic.dart';
-import 'package:sky/widgets/card.dart';
-import 'package:sky/widgets/default_text_style.dart';
-import 'package:sky/widgets/dismissable.dart';
+import 'package:sky/widgets/dialog.dart';
 import 'package:sky/widgets/drawer.dart';
 import 'package:sky/widgets/drawer_divider.dart';
 import 'package:sky/widgets/drawer_header.dart';
 import 'package:sky/widgets/drawer_item.dart';
+import 'package:sky/widgets/flat_button.dart';
 import 'package:sky/widgets/floating_action_button.dart';
 import 'package:sky/widgets/icon_button.dart';
 import 'package:sky/widgets/icon.dart';
@@ -24,22 +23,24 @@ import 'package:sky/widgets/tool_bar.dart';
 import 'package:sky/widgets/widget.dart';
 
 import 'fitness_types.dart';
+import 'fitness_item.dart';
 import 'measurement.dart';
+import 'meal.dart';
 
-class MeasurementList extends Component {
-  MeasurementList({ String key, this.measurements, this.onDismissed }) : super(key: key);
+class FitnessItemList extends Component {
+  FitnessItemList({ Key key, this.items, this.onDismissed }) : super(key: key);
 
-  final List<Measurement> measurements;
-  final MeasurementHandler onDismissed;
+  final List<FitnessItem> items;
+  final FitnessItemHandler onDismissed;
 
   Widget build() {
     return new Material(
       type: MaterialType.canvas,
-      child: new ScrollableList<Measurement>(
-        items: measurements,
-        itemHeight: MeasurementRow.kHeight,
-        itemBuilder: (measurement) => new MeasurementRow(
-          measurement: measurement,
+      child: new ScrollableList<FitnessItem>(
+        items: items,
+        itemHeight: kFitnessItemHeight,
+        itemBuilder: (item) => new MeasurementRow(
+          measurement: item as Measurement,
           onDismissed: onDismissed
         )
       )
@@ -47,60 +48,15 @@ class MeasurementList extends Component {
   }
 }
 
-class MeasurementRow extends Component {
-
-  MeasurementRow({ Measurement measurement, this.onDismissed }) : this.measurement = measurement, super(key: measurement.when.toString());
-
-  final Measurement measurement;
-  final MeasurementHandler onDismissed;
-
-  static const double kHeight = 79.0;
-
-  Widget build() {
-
-    List<Widget> children = [
-      new Flexible(
-        child: new Text(
-          measurement.displayWeight,
-          style: const TextStyle(textAlign: TextAlign.right)
-        )
-      ),
-      new Flexible(
-        child: new Text(
-          measurement.displayDate,
-          style: Theme.of(this).text.caption.copyWith(textAlign: TextAlign.right)
-        )
-      )
-    ];
-
-    return new Dismissable(
-      key: measurement.when.toString(),
-      onDismissed: () => onDismissed(measurement),
-      child: new Card(
-        child: new Container(
-          height: kHeight,
-          padding: const EdgeDims.all(8.0),
-          child: new Flex(
-            children,
-            alignItems: FlexAlignItems.baseline,
-            textBaseline: DefaultTextStyle.of(this).textBaseline
-          )
-        )
-      )
-    );
-  }
-}
-
-class HomeFragment extends StatefulComponent {
-
-  HomeFragment({ this.navigator, this.userData, this.onMeasurementCreated, this.onMeasurementDeleted });
+class FeedFragment extends StatefulComponent {
+  FeedFragment({ this.navigator, this.userData, this.onItemCreated, this.onItemDeleted });
 
   Navigator navigator;
-  List<Measurement> userData;
-  MeasurementHandler onMeasurementCreated;
-  MeasurementHandler onMeasurementDeleted;
+  List<FitnessItem> userData;
+  FitnessItemHandler onItemCreated;
+  FitnessItemHandler onItemDeleted;
 
-  FitnessMode _fitnessMode = FitnessMode.measure;
+  FitnessMode _fitnessMode = FitnessMode.feed;
 
   void initState() {
     // if (debug)
@@ -108,19 +64,19 @@ class HomeFragment extends StatefulComponent {
     super.initState();
   }
 
-  void syncFields(HomeFragment source) {
+  void syncFields(FeedFragment source) {
     navigator = source.navigator;
     userData = source.userData;
-    onMeasurementCreated = source.onMeasurementCreated;
-    onMeasurementDeleted = source.onMeasurementDeleted;
+    onItemCreated = source.onItemCreated;
+    onItemDeleted = source.onItemDeleted;
   }
 
   bool _isShowingSnackBar = false;
-  bool _isRunning = false;
 
   void _handleFitnessModeChange(FitnessMode value) {
     setState(() {
       _fitnessMode = value;
+      _drawerShowing = false;
     });
   }
 
@@ -135,15 +91,15 @@ class HomeFragment extends StatefulComponent {
       children: [
         new DrawerHeader(children: [new Text('Fitness')]),
         new DrawerItem(
-          icon: 'action/assessment',
-          onPressed: () => _handleFitnessModeChange(FitnessMode.measure),
-          selected: _fitnessMode == FitnessMode.measure,
-          children: [new Text('Measure')]),
+          icon: 'action/list',
+          onPressed: () => _handleFitnessModeChange(FitnessMode.feed),
+          selected: _fitnessMode == FitnessMode.feed,
+          children: [new Text('Feed')]),
         new DrawerItem(
-          icon: 'maps/directions_run',
-          onPressed: () => _handleFitnessModeChange(FitnessMode.run),
-          selected: _fitnessMode == FitnessMode.run,
-          children: [new Text('Run')]),
+          icon: 'action/assessment',
+          onPressed: () => _handleFitnessModeChange(FitnessMode.chart),
+          selected: _fitnessMode == FitnessMode.chart,
+          children: [new Text('Chart')]),
         new DrawerDivider(),
         new DrawerItem(
           icon: 'action/settings',
@@ -180,8 +136,8 @@ class HomeFragment extends StatefulComponent {
   // TODO(jackson): We should be localizing
   String get fitnessModeTitle {
     switch(_fitnessMode) {
-      case FitnessMode.measure: return "Measure";
-      case FitnessMode.run: return "Run";
+      case FitnessMode.feed: return "Feed";
+      case FitnessMode.chart: return "Chart";
     }
   }
 
@@ -194,13 +150,12 @@ class HomeFragment extends StatefulComponent {
     );
   }
 
-  // TODO(jackson): Pull from file
-  Measurement _undoMeasurement;
+  FitnessItem _undoItem;
 
-  void _handleMeasurementDismissed(Measurement measurement) {
-    onMeasurementDeleted(measurement);
+  void _handleItemDismissed(FitnessItem item) {
+    onItemDeleted(item);
     setState(() {
-      _undoMeasurement = measurement;
+      _undoItem = item;
       _isShowingSnackBar = true;
     });
   }
@@ -208,33 +163,33 @@ class HomeFragment extends StatefulComponent {
   Widget buildBody() {
     TextStyle style = Theme.of(this).text.title;
     switch (_fitnessMode) {
-      case FitnessMode.measure:
+      case FitnessMode.feed:
         if (userData.length > 0)
-          return new MeasurementList(
-            measurements: userData,
-            onDismissed: _handleMeasurementDismissed
+          return new FitnessItemList(
+            items: userData,
+            onDismissed: _handleItemDismissed
           );
         return new Material(
           type: MaterialType.canvas,
           child: new Flex(
-            [new Text("No measurements yet.\nAdd a new one!", style: style)],
+            [new Text("No data yet.\nAdd some!", style: style)],
             justifyContent: FlexJustifyContent.center
           )
         );
-      case FitnessMode.run:
+      case FitnessMode.chart:
         return new Material(
           type: MaterialType.canvas,
           child: new Flex([
-            new Text(_isRunning ? "Go go go!" : "Start a new run!", style: style)
+            new Text("Charts are coming soon!", style: style)
           ], justifyContent: FlexJustifyContent.center)
         );
     }
   }
 
   void _handleUndo() {
-    onMeasurementCreated(_undoMeasurement);
+    onItemCreated(_undoItem);
     setState(() {
-      _undoMeasurement = null;
+      _undoItem = null;
       _isShowingSnackBar = false;
     });
   }
@@ -243,48 +198,72 @@ class HomeFragment extends StatefulComponent {
     if (!_isShowingSnackBar)
       return null;
     return new SnackBar(
-      content: new Text("Measurement deleted."),
+      showing: _isShowingSnackBar,
+      content: new Text("Item deleted."),
       actions: [new SnackBarAction(label: "UNDO", onPressed: _handleUndo)]
     );
   }
 
-  void _handleRunStarted() {
-    setState(() {
-      _isRunning = true;
-    });
+  bool _isShowingDialog = false;
+
+  Widget buildDialog() {
+    return new Dialog(
+      title: new Text("New item"),
+      content: new Text("What are you trying to do?"),
+      onDismiss: navigator.pop,
+      actions: [
+        new FlatButton(
+          child: new Text('CANCEL'),
+          onPressed: navigator.pop
+        ),
+        new FlatButton(
+          child: new Text('EAT'),
+          onPressed: () {
+            navigator.pop();
+            navigator.pushNamed("/meals/new");
+          }
+        ),
+        new FlatButton(
+          child: new Text('MEASURE'),
+          onPressed: () {
+            navigator.pop();
+            navigator.pushNamed("/measurements/new");
+          }
+        ),
+      ]
+    );
   }
 
-  void _handleRunStopped() {
+  void _handleActionButtonPressed() {
     setState(() {
-      _isRunning = false;
+      _isShowingDialog = true;
     });
   }
 
   Widget buildFloatingActionButton() {
     switch (_fitnessMode) {
-      case FitnessMode.measure:
+      case FitnessMode.feed:
         return new FloatingActionButton(
           child: new Icon(type: 'content/add', size: 24),
-          onPressed: () => navigator.pushNamed("/measurements/new")
-        );
-      case FitnessMode.run:
-        return new FloatingActionButton(
-          child: new Icon(
-            type: _isRunning ? 'av/stop' : 'maps/directions_run',
-            size: 24
-          ),
-          onPressed: _isRunning ? _handleRunStopped : _handleRunStarted
+          onPressed: _handleActionButtonPressed
         );
+      case FitnessMode.chart:
+        return null;
     }
   }
 
   Widget build() {
-    return new Scaffold(
-      toolbar: buildToolBar(),
-      body: buildBody(),
-      snackBar: buildSnackBar(),
-      floatingActionButton: buildFloatingActionButton(),
-      drawer: buildDrawer()
-    );
+    List<Widget> layers = [
+      new Scaffold(
+        toolbar: buildToolBar(),
+        body: buildBody(),
+        snackBar: buildSnackBar(),
+        floatingActionButton: buildFloatingActionButton(),
+        drawer: buildDrawer()
+      )
+    ];
+    if (_isShowingDialog)
+      layers.add(buildDialog());
+    return new Stack(layers);
   }
 }

packages/flutter/example/fitness/lib/fitness_item.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/widgets/basic.dart';
+import 'package:sky/widgets/card.dart';
+import 'package:sky/widgets/dismissable.dart';
+
+typedef void FitnessItemHandler(FitnessItem item);
+
+const double kFitnessItemHeight = 79.0;
+
+class FitnessItem {
+  FitnessItem({ this.when }) {
+    assert(when != null);
+  }
+  final DateTime when;
+
+  // TODO(jackson): Internationalize
+  String get displayDate => "${when.year.toString()}-${when.month.toString().padLeft(2,'0')}-${when.day.toString().padLeft(2,'0')}";
+}
+
+abstract class FitnessItemRow extends Component {
+
+  FitnessItemRow({ FitnessItem item, this.onDismissed })
+   : this.item = item,
+     super(key: new Key(item.when.toString()));
+
+  final FitnessItem item;
+  final FitnessItemHandler onDismissed;
+
+  Widget buildContent();
+
+  Widget build() {
+    return new Dismissable(
+      onDismissed: () => onDismissed(item),
+      child: new Card(
+        child: new Container(
+          height: kFitnessItemHeight,
+          padding: const EdgeDims.all(8.0),
+          child: buildContent()
+        )
+      )
+    );
+  }
+}

packages/flutter/example/fitness/lib/fitness_types.dart

@@ -2,5 +2,5 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-enum FitnessMode { measure, run }
+enum FitnessMode { feed, chart }
 enum BackupMode { enabled, disabled }

packages/flutter/example/fitness/lib/main.dart

@@ -9,31 +9,44 @@ import 'package:sky/widgets/theme.dart';
 import 'package:sky/widgets/widget.dart';
 import 'package:sky/widgets/task_description.dart';
 
+import 'meal.dart';
 import 'measurement.dart';
-import 'home.dart';
+import 'feed.dart';
 import 'settings.dart';
+import 'fitness_item.dart';
 import 'fitness_types.dart';
 
 class FitnessApp extends App {
 
   NavigationState _navigationState;
+  final List<FitnessItem> _userData = [
+    new Measurement(weight: 180.0, when: new DateTime.now().add(const Duration(days: -1))),
+    new Measurement(weight: 160.0, when: new DateTime.now()),
+  ];
 
   void initState() {
     _navigationState = new NavigationState([
       new Route(
         name: '/',
-        builder: (navigator, route) => new HomeFragment(
+        builder: (navigator, route) => new FeedFragment(
           navigator: navigator,
           userData: _userData,
-          onMeasurementCreated: _handleMeasurementCreated,
-          onMeasurementDeleted: _handleMeasurementDeleted
+          onItemCreated: _handleItemCreated,
+          onItemDeleted: _handleItemDeleted
+        )
+      ),
+      new Route(
+        name: '/meals/new',
+        builder: (navigator, route) => new MealFragment(
+          navigator: navigator,
+          onCreated: _handleItemCreated
         )
       ),
       new Route(
         name: '/measurements/new',
         builder: (navigator, route) => new MeasurementFragment(
           navigator: navigator,
-          onCreated: _handleMeasurementCreated
+          onCreated: _handleItemCreated
         )
       ),
       new Route(
@@ -54,16 +67,16 @@ class FitnessApp extends App {
     }
   }
 
-  void _handleMeasurementCreated(Measurement measurement) {
+  void _handleItemCreated(FitnessItem item) {
     setState(() {
-      _userData.add(measurement);
+      _userData.add(item);
       _userData.sort((a, b) => a.when.compareTo(b.when));
     });
   }
 
-  void _handleMeasurementDeleted(Measurement measurement) {
+  void _handleItemDeleted(FitnessItem item) {
     setState(() {
-      _userData.remove(measurement);
+      _userData.remove(item);
     });
   }
 
@@ -76,11 +89,6 @@ class FitnessApp extends App {
     });
   }
 
-  final List<Measurement> _userData = [
-    new Measurement(weight: 180.0, when: new DateTime.now().add(const Duration(days: -1))),
-    new Measurement(weight: 160.0, when: new DateTime.now()),
-  ];
-
   Widget build() {
     return new Theme(
       data: new ThemeData(

packages/flutter/example/fitness/lib/meal.dart

+// Copyright 2014 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/text_style.dart';
+import 'package:sky/editing/input.dart';
+import 'package:sky/widgets/basic.dart';
+import 'package:sky/widgets/default_text_style.dart';
+import 'package:sky/widgets/icon_button.dart';
+import 'package:sky/widgets/ink_well.dart';
+import 'package:sky/widgets/material.dart';
+import 'package:sky/widgets/navigator.dart';
+import 'package:sky/widgets/scaffold.dart';
+import 'package:sky/widgets/scrollable_viewport.dart';
+import 'package:sky/widgets/snack_bar.dart';
+import 'package:sky/widgets/theme.dart';
+import 'package:sky/widgets/tool_bar.dart';
+
+import 'fitness_item.dart';
+
+class Meal extends FitnessItem {
+  Meal({ DateTime when, this.description }) : super(when: when);
+
+  final String description;
+}
+
+class MealRow extends FitnessItemRow {
+  MealRow({ Meal meal, FitnessItemHandler onDismissed })
+    : super(item: meal, onDismissed: onDismissed);
+
+  Widget buildContent() {
+    Meal meal = item;
+    List<Widget> children = [
+      new Flexible(
+        child: new Text(
+          meal.description,
+          style: const TextStyle(textAlign: TextAlign.right)
+        )
+      ),
+      new Flexible(
+        child: new Text(
+          meal.displayDate,
+          style: Theme.of(this).text.caption.copyWith(textAlign: TextAlign.right)
+        )
+      )
+    ];
+    return new Flex(
+      children,
+      alignItems: FlexAlignItems.baseline,
+      textBaseline: DefaultTextStyle.of(this).textBaseline
+    );
+  }
+}
+
+class MealFragment extends StatefulComponent {
+
+  MealFragment({ this.navigator, this.onCreated });
+
+  Navigator navigator;
+  FitnessItemHandler onCreated;
+
+  void syncFields(MealFragment source) {
+    navigator = source.navigator;
+    onCreated = source.onCreated;
+  }
+
+  String _description = "";
+
+  void _handleSave() {
+    onCreated(new Meal(when: new DateTime.now(), description: _description));
+    navigator.pop();
+  }
+
+  Widget buildToolBar() {
+    return new ToolBar(
+      left: new IconButton(
+        icon: "navigation/close",
+        onPressed: navigator.pop),
+      center: new Text('New Meal'),
+      right: [new InkWell(
+        child: new Listener(
+          onGestureTap: (_) => _handleSave(),
+          child: new Text('SAVE')
+        )
+      )]
+    );
+  }
+
+  void _handleDescriptionChanged(String description) {
+    setState(() {
+      _description = description;
+    });
+  }
+
+  Widget buildBody() {
+    Meal meal = new Meal(when: new DateTime.now());
+    return new Material(
+      type: MaterialType.canvas,
+      child: new ScrollableViewport(
+        child: new Container(
+          padding: const EdgeDims.all(20.0),
+          child: new Block([
+            new Text(meal.displayDate),
+            new Input(
+              focused: false,
+              placeholder: 'Describe meal',
+              onChanged: _handleDescriptionChanged
+            ),
+          ])
+        )
+      )
+    );
+  }
+
+  Widget build() {
+    return new Scaffold(
+      toolbar: buildToolBar(),
+      body: buildBody()
+    );
+  }
+}

packages/flutter/example/fitness/lib/measurement.dart

@@ -2,8 +2,10 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'package:sky/painting/text_style.dart';
 import 'package:sky/editing/input.dart';
 import 'package:sky/widgets/basic.dart';
+import 'package:sky/widgets/default_text_style.dart';
 import 'package:sky/widgets/icon_button.dart';
 import 'package:sky/widgets/ink_well.dart';
 import 'package:sky/widgets/material.dart';
@@ -11,19 +13,46 @@ import 'package:sky/widgets/navigator.dart';
 import 'package:sky/widgets/scaffold.dart';
 import 'package:sky/widgets/scrollable_viewport.dart';
 import 'package:sky/widgets/snack_bar.dart';
+import 'package:sky/widgets/theme.dart';
 import 'package:sky/widgets/tool_bar.dart';
 
-typedef void MeasurementHandler(Measurement measurement);
+import 'fitness_item.dart';
 
-class Measurement {
-  Measurement({ this.when, this.weight });
+class Measurement extends FitnessItem {
+  Measurement({ DateTime when, this.weight }) : super(when: when);
 
-  final DateTime when;
   final double weight;
 
   // TODO(jackson): Internationalize
   String get displayWeight => "${weight.toStringAsFixed(2)} lbs";
-  String get displayDate => "${when.year.toString()}-${when.month.toString().padLeft(2,'0')}-${when.day.toString().padLeft(2,'0')}";
+}
+
+class MeasurementRow extends FitnessItemRow {
+  MeasurementRow({ Measurement measurement, FitnessItemHandler onDismissed })
+    : super(item: measurement, onDismissed: onDismissed);
+
+  Widget buildContent() {
+    Measurement measurement = item;
+    List<Widget> children = [
+      new Flexible(
+        child: new Text(
+          measurement.displayWeight,
+          style: const TextStyle(textAlign: TextAlign.right)
+        )
+      ),
+      new Flexible(
+        child: new Text(
+          measurement.displayDate,
+          style: Theme.of(this).text.caption.copyWith(textAlign: TextAlign.right)
+        )
+      )
+    ];
+    return new Flex(
+      children,
+      alignItems: FlexAlignItems.baseline,
+      textBaseline: DefaultTextStyle.of(this).textBaseline
+    );
+  }
 }
 
 class MeasurementFragment extends StatefulComponent {
@@ -31,7 +60,7 @@ class MeasurementFragment extends StatefulComponent {
   MeasurementFragment({ this.navigator, this.onCreated });
 
   Navigator navigator;
-  MeasurementHandler onCreated;
+  FitnessItemHandler onCreated;
 
   void syncFields(MeasurementFragment source) {
     navigator = source.navigator;
@@ -76,7 +105,7 @@ class MeasurementFragment extends StatefulComponent {
     });
   }
 
-  Widget buildMeasurementPane() {
+  Widget buildBody() {
     Measurement measurement = new Measurement(when: new DateTime.now());
     return new Material(
       type: MaterialType.canvas,
@@ -105,7 +134,7 @@ class MeasurementFragment extends StatefulComponent {
   Widget build() {
     return new Scaffold(
       toolbar: buildToolBar(),
-      body: buildMeasurementPane(),
+      body: buildBody(),
       snackBar: buildSnackBar()
     );
   }

packages/flutter/example/fitness/lib/settings.dart

@@ -27,8 +27,6 @@ class SettingsFragment extends Component {
   final BackupMode backup;
   final SettingsUpdater updater;
 
-  bool showModeDialog = false;
-
   void _handleBackupChanged(bool value) {
     if (updater != null)
       updater(backup: value ? BackupMode.enabled : BackupMode.disabled);

packages/flutter/example/mine_digger/lib/main.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.
 
@@ -57,6 +56,20 @@ class MineDiggerApp extends App {
   // |uiState| keeps track of the visible player progess.
   List<List<CellState>> uiState;
 
+  Game(this.app) {
+    randomSeed = 22;
+    // Colors for each mine count:
+    // 0 - none, 1 - blue, 2-green, 3-red, 4-black, 5-dark red .. etc.
+    textStyles.add(new TextStyle(color: const Color(0xFF555555), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFF0094FF), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFF13A023), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFFDA1414), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFF1E2347), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFF7F0037), fontWeight: bold));
+    textStyles.add(new TextStyle(color: const Color(0xFFE93BE9), fontWeight: bold));
+    initialize();
+  }
+
   void resetGame() {
     alive = true;
     hasWon = false;
@@ -148,13 +161,14 @@ class MineDiggerApp extends App {
         } else if (state == CellState.flagged) {
           row.add(new CoveredMineNode(
             flagged: true,
-            posX: ix, posY: iy)
-          );
+            posX: ix,
+            posY: iy
+          ));
         } else {
           row.add(new ExposedMineNode(
             state: state,
-            count: count)
-          );
+            count: count
+          ));
         }
       }
       flexRows.add(
@@ -162,8 +176,9 @@ class MineDiggerApp extends App {
           row,
           direction: FlexDirection.horizontal,
           justifyContent: FlexJustifyContent.center,
-          key: 'flex_row($iy)'
-        ));
+          key: new Key.stringify(iy)
+        )
+      );
     }
 
     if (!hasCoveredCell) {

packages/flutter/example/stocks/lib/stock_arrow.dart

@@ -12,7 +12,7 @@ import 'package:sky/widgets/basic.dart';
 
 class StockArrow extends Component {
 
-  StockArrow({ String key, this.percentChange }) : super(key: key);
+  StockArrow({ Key key, this.percentChange }) : super(key: key);
 
   final double percentChange;
 

packages/flutter/example/stocks/lib/stock_home.dart

@@ -3,9 +3,6 @@
 // found in the LICENSE file.
 
 import 'package:sky/editing/input.dart';
-import 'package:sky/animation/animated_value.dart';
-import 'package:sky/widgets/animated_component.dart';
-import 'package:sky/widgets/animation_builder.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/drawer.dart';
@@ -35,7 +32,7 @@ typedef void ModeUpdater(StockMode mode);
 
 const Duration _kSnackbarSlideDuration = const Duration(milliseconds: 200);
 
-class StockHome extends AnimatedComponent {
+class StockHome extends StatefulComponent {
 
   StockHome(this.navigator, this.stocks, this.stockMode, this.modeUpdater);
 
@@ -54,7 +51,8 @@ class StockHome extends AnimatedComponent {
   bool _isSearching = false;
   String _searchQuery;
 
-  AnimationBuilder _snackbarTransform;
+  SnackBarStatus _snackBarStatus = SnackBarStatus.inactive;
+  bool _isSnackBarShowing = false;
 
   void _handleSearchBegin() {
     navigator.pushState(this, (_) {
@@ -140,6 +138,7 @@ class StockHome extends AnimatedComponent {
   Drawer buildDrawer() {
     if (_drawerStatus == DrawerStatus.inactive)
       return null;
+    assert(_drawerShowing); // TODO(mpcomplete): this is always true
     return new Drawer(
       level: 3,
       showing: _drawerShowing,
@@ -264,40 +263,34 @@ class StockHome extends AnimatedComponent {
 
   void _handleUndo() {
     setState(() {
-      _snackbarTransform = null;
+      _isSnackBarShowing = false;
     });
   }
 
   Widget buildSnackBar() {
-    if (_snackbarTransform == null)
+    if (_snackBarStatus == SnackBarStatus.inactive)
       return null;
-    return _snackbarTransform.build(
-      new SnackBar(
-        content: new Text("Stock purchased!"),
-        actions: [new SnackBarAction(label: "UNDO", onPressed: _handleUndo)]
-      ));
+    return new SnackBar(
+      showing: _isSnackBarShowing,
+      content: new Text("Stock purchased!"),
+      actions: [new SnackBarAction(label: "UNDO", onPressed: _handleUndo)],
+      onStatusChanged: (status) { setState(() { _snackBarStatus = status; }); }
+    );
   }
 
   void _handleStockPurchased() {
     setState(() {
-      _snackbarTransform = new AnimationBuilder()
-        ..position = new AnimatedValue<Point>(const Point(0.0, 45.0), end: Point.origin);
-      var performance = _snackbarTransform.createPerformance(
-          [_snackbarTransform.position], duration: _kSnackbarSlideDuration);
-      watch(performance); // TODO(mpcomplete): need to unwatch
-      performance.play();
+      _isSnackBarShowing = true;
+      _snackBarStatus = SnackBarStatus.active;
     });
   }
 
   Widget buildFloatingActionButton() {
-    var widget = new FloatingActionButton(
+    return new FloatingActionButton(
       child: new Icon(type: 'content/add', size: 24),
       backgroundColor: colors.RedAccent[200],
       onPressed: _handleStockPurchased
     );
-    if (_snackbarTransform != null)
-      widget = _snackbarTransform.build(widget);
-    return widget;
   }
 
   void addMenuToOverlays(List<Widget> overlays) {

packages/flutter/example/stocks/lib/stock_list.dart

@@ -10,7 +10,7 @@ import 'stock_data.dart';
 import 'stock_row.dart';
 
 class Stocklist extends Component {
-  Stocklist({ String key, this.stocks }) : super(key: key);
+  Stocklist({ Key key, this.stocks }) : super(key: key);
 
   final List<Stock> stocks;
 

packages/flutter/example/stocks/lib/stock_menu.dart

@@ -14,7 +14,7 @@ export 'package:sky/widgets/popup_menu.dart' show PopupMenuStatus;
 
 class StockMenu extends Component {
   StockMenu({
-    String key,
+    Key key,
     this.showing,
     this.onStatusChanged,
     this.navigator,

packages/flutter/example/stocks/lib/stock_row.dart

@@ -14,7 +14,7 @@ import 'stock_data.dart';
 
 class StockRow extends Component {
 
-  StockRow({ Stock stock }) : this.stock = stock, super(key: stock.symbol);
+  StockRow({ Stock stock }) : this.stock = stock, super(key: new Key(stock.symbol));
 
   final Stock stock;
 

packages/flutter/example/widgets/block_viewport.dart

@@ -115,7 +115,7 @@ class BlockViewportApp extends App {
     if (index >= lengths.length)
       return null;
     return new Listener(
-      key: lengths[index].toString(),
+      key: new Key.stringify(lengths[index]),
       child: new Container(
         decoration: new BoxDecoration(
           backgroundColor: new Color((0xFF000000 + 0xFFFFFF * lengths[index] / kMaxLength).round())

packages/flutter/example/widgets/card_collection.dart

@@ -27,13 +27,13 @@ class CardModel {
   Color color;
   AnimationPerformance performance;
   String get label => "Item $value";
-  String get key => value.toString();
+  Key get key => new Key.fromObjectIdentity(this);
 }
 
 class ShrinkingCard extends AnimatedComponent {
 
   ShrinkingCard({
-    String key,
+    Key key,
     CardModel this.card,
     Function this.onUpdated,
     Function this.onCompleted

packages/flutter/example/widgets/spinning_mixed.dart

@@ -24,7 +24,7 @@ void addFlexChildSolidColor(RenderFlex parent, sky.Color backgroundColor, { int
 
 // Solid colour, Widget version
 class Rectangle extends Component {
-  Rectangle(this.color, { String key }) : super(key: key);
+  Rectangle(this.color, { Key key }) : super(key: key);
   final Color color;
   Widget build() {
     return new Flexible(

packages/flutter/example/widgets/styled_text.dart

@@ -52,7 +52,7 @@ HAL: This mission is too important for me to allow you to jeopardize it.''';
   Component toStyledText(String name, String text) {
     TextStyle lineStyle = (name == "Dave") ? daveStyle : halStyle;
     return new StyledText(
-      key: text,
+      key: new Key(text),
       elements: [lineStyle, [boldStyle, [underlineStyle, name], ":"], text]
     );
   }

packages/flutter/lib/editing/editable_text.dart

@@ -18,7 +18,7 @@ const _kCursorWidth = 1.0;
 class EditableText extends StatefulComponent {
 
   EditableText({
-    String key,
+    Key key,
     this.value,
     this.focused: false,
     this.style,

packages/flutter/lib/editing/input.dart

@@ -25,7 +25,7 @@ class Input extends StatefulComponent {
   // Never makes sense to have both a localKey and a globalKey.
   // Possibly a class HeroKey who functions as a UUID.
 
-  Input({String key,
+  Input({Key key,
          this.placeholder,
          this.onChanged,
          this.focused})
@@ -75,7 +75,7 @@ class Input extends StatefulComponent {
 
     if (placeholder != null && _value.isEmpty) {
       Widget child = new Opacity(
-        key: "placeholder",
+        key: new Key('placeholder'),
         child: new Text(placeholder, style: textStyle),
         opacity: themeData.hintOpacity
       );

packages/flutter/lib/widgets/animated_component.dart

@@ -7,7 +7,7 @@ import 'package:sky/widgets/basic.dart';
 
 abstract class AnimatedComponent extends StatefulComponent {
 
-  AnimatedComponent({ String key }) : super(key: key);
+  AnimatedComponent({ Key key }) : super(key: key);
 
   void syncFields(AnimatedComponent source) { }
 

packages/flutter/lib/widgets/animated_container.dart

@@ -77,7 +77,7 @@ class ImplicitlyAnimatedValue<T> {
 
 class AnimatedContainer extends AnimatedComponent {
   AnimatedContainer({
-    String key,
+    Key key,
     this.child,
     this.duration,
     this.constraints,

packages/flutter/lib/widgets/animation_builder.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:vector_math/vector_math.dart';
-
-import 'package:sky/animation/animated_value.dart';
-import 'package:sky/animation/animation_performance.dart';
-import 'package:sky/painting/box_painter.dart';
-import 'package:sky/theme/shadows.dart';
-import 'package:sky/widgets/basic.dart';
-
-// This class builds a Container object from a collection of optionally-
-// animated properties. Use syncFields to update the Container's properties,
-// which will optionally animate them using an AnimationPerformance.
-class AnimationBuilder {
-
-  AnimationBuilder();
-
-  AnimatedValue<double> opacity;
-  AnimatedValue<Point> position;
-  AnimatedValue<double> shadow;
-  AnimatedColor backgroundColor;
-
-  // These don't animate, but are used to build the AnimationBuilder anyway.
-  double borderRadius;
-  Shape shape;
-
-  Map<AnimatedVariable, AnimationPerformance> _variableToPerformance =
-      new Map<AnimatedVariable, AnimationPerformance>();
-
-  AnimationPerformance createPerformance(List<AnimatedValue> variables,
-                                         { Duration duration }) {
-    AnimationPerformance performance = new AnimationPerformance()
-      ..duration = duration
-      ..variable = new AnimatedList(variables);
-    for (AnimatedVariable variable in variables)
-      _variableToPerformance[variable] = performance;
-    return performance;
-  }
-
-  Widget build(Widget child) {
-    Widget current = child;
-    if (shadow != null || backgroundColor != null ||
-        borderRadius != null || shape != null) {
-      current = new DecoratedBox(
-        decoration: new BoxDecoration(
-          borderRadius: borderRadius,
-          shape: shape,
-          boxShadow: shadow != null ? _computeShadow(shadow.value) : null,
-          backgroundColor: backgroundColor != null ? backgroundColor.value : null),
-        child: current);
-    }
-
-    if (position != null) {
-      Matrix4 transform = new Matrix4.identity();
-      transform.translate(position.value.x, position.value.y);
-      current = new Transform(transform: transform, child: current);
-    }
-
-    if (opacity != null) {
-      current = new Opacity(opacity: opacity.value, child: current);
-    }
-
-    return current;
-  }
-
-  void updateFields({
-    AnimatedValue<double> shadow,
-    AnimatedColor backgroundColor,
-    double borderRadius,
-    Shape shape
-  }) {
-    _updateField(this.shadow, shadow);
-    _updateField(this.backgroundColor, backgroundColor);
-    this.borderRadius = borderRadius;
-    this.shape = shape;
-  }
-
-  void _updateField(AnimatedValue variable, AnimatedValue sourceVariable) {
-    if (variable == null)
-      return; // TODO(mpcomplete): Should we handle transition from null?
-
-    AnimationPerformance performance = _variableToPerformance[variable];
-    if (performance == null) {
-      // If there's no performance, no need to animate.
-      if (sourceVariable != null)
-        variable.value = sourceVariable.value;
-      return;
-    }
-
-    if (variable.value != sourceVariable.value) {
-      variable
-        ..begin = variable.value
-        ..end = sourceVariable.value;
-      performance
-        ..progress = 0.0
-        ..play();
-    }
-  }
-}
-
-List<BoxShadow> _computeShadow(double level) {
-  if (level < 1.0)  // shadows[1] is the first shadow
-    return null;
-
-  int level1 = level.floor();
-  int level2 = level.ceil();
-  double t = level - level1.toDouble();
-
-  List<BoxShadow> shadow = new List<BoxShadow>();
-  for (int i = 0; i < shadows[level1].length; ++i)
-    shadow.add(lerpBoxShadow(shadows[level1][i], shadows[level2][i], t));
-  return shadow;
-}

packages/flutter/lib/widgets/basic.dart

@@ -22,13 +22,13 @@ import 'package:sky/widgets/widget.dart';
 export 'package:sky/rendering/box.dart' show BackgroundImage, BoxConstraints, BoxDecoration, Border, BorderSide, EdgeDims;
 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/widgets/widget.dart' show Widget, Component, StatefulComponent, App, runApp, Listener, ParentDataNode;
+export 'package:sky/widgets/widget.dart' show Key, Widget, Component, StatefulComponent, App, runApp, Listener, ParentDataNode;
 
 
 // PAINTING NODES
 
 class Opacity extends OneChildRenderObjectWrapper {
-  Opacity({ String key, this.opacity, Widget child })
+  Opacity({ Key key, this.opacity, Widget child })
     : super(key: key, child: child);
 
   final double opacity;
@@ -43,7 +43,7 @@ class Opacity extends OneChildRenderObjectWrapper {
 }
 
 class ColorFilter extends OneChildRenderObjectWrapper {
-  ColorFilter({ String key, this.color, this.transferMode, Widget child })
+  ColorFilter({ Key key, this.color, this.transferMode, Widget child })
     : super(key: key, child: child);
 
   final Color color;
@@ -60,7 +60,7 @@ class ColorFilter extends OneChildRenderObjectWrapper {
 }
 
 class DecoratedBox extends OneChildRenderObjectWrapper {
-  DecoratedBox({ String key, this.decoration, Widget child })
+  DecoratedBox({ Key key, this.decoration, Widget child })
     : super(key: key, child: child);
 
   final BoxDecoration decoration;
@@ -75,7 +75,7 @@ class DecoratedBox extends OneChildRenderObjectWrapper {
 }
 
 class CustomPaint extends OneChildRenderObjectWrapper {
-  CustomPaint({ String key, this.callback, this.token, Widget child })
+  CustomPaint({ Key key, this.callback, this.token, Widget child })
     : super(key: key, child: child);
 
   final CustomPaintCallback callback;
@@ -98,7 +98,7 @@ class CustomPaint extends OneChildRenderObjectWrapper {
 }
 
 class ClipRect extends OneChildRenderObjectWrapper {
-  ClipRect({ String key, Widget child })
+  ClipRect({ Key key, Widget child })
     : super(key: key, child: child);
 
   RenderClipRect createNode() => new RenderClipRect();
@@ -108,7 +108,7 @@ class ClipRect extends OneChildRenderObjectWrapper {
 }
 
 class ClipRRect extends OneChildRenderObjectWrapper {
-  ClipRRect({ String key, this.xRadius, this.yRadius, Widget child })
+  ClipRRect({ Key key, this.xRadius, this.yRadius, Widget child })
     : super(key: key, child: child);
 
   final double xRadius;
@@ -125,7 +125,7 @@ class ClipRRect extends OneChildRenderObjectWrapper {
 }
 
 class ClipOval extends OneChildRenderObjectWrapper {
-  ClipOval({ String key, Widget child })
+  ClipOval({ Key key, Widget child })
     : super(key: key, child: child);
 
   RenderClipOval createNode() => new RenderClipOval();
@@ -138,7 +138,7 @@ class ClipOval extends OneChildRenderObjectWrapper {
 // POSITIONING AND SIZING NODES
 
 class Transform extends OneChildRenderObjectWrapper {
-  Transform({ String key, this.transform, Widget child })
+  Transform({ Key key, this.transform, Widget child })
     : super(key: key, child: child);
 
   final Matrix4 transform;
@@ -153,7 +153,7 @@ class Transform extends OneChildRenderObjectWrapper {
 }
 
 class Padding extends OneChildRenderObjectWrapper {
-  Padding({ String key, this.padding, Widget child })
+  Padding({ Key key, this.padding, Widget child })
     : super(key: key, child: child);
 
   final EdgeDims padding;
@@ -168,7 +168,7 @@ class Padding extends OneChildRenderObjectWrapper {
 }
 
 class Center extends OneChildRenderObjectWrapper {
-  Center({ String key, Widget child })
+  Center({ Key key, Widget child })
     : super(key: key, child: child);
 
   RenderPositionedBox createNode() => new RenderPositionedBox();
@@ -178,7 +178,7 @@ class Center extends OneChildRenderObjectWrapper {
 }
 
 class SizedBox extends OneChildRenderObjectWrapper {
-  SizedBox({ String key, this.width, this.height, Widget child })
+  SizedBox({ Key key, this.width, this.height, Widget child })
     : super(key: key, child: child);
 
   final double width;
@@ -203,7 +203,7 @@ class SizedBox extends OneChildRenderObjectWrapper {
 }
 
 class ConstrainedBox extends OneChildRenderObjectWrapper {
-  ConstrainedBox({ String key, this.constraints, Widget child })
+  ConstrainedBox({ Key key, this.constraints, Widget child })
     : super(key: key, child: child);
 
   final BoxConstraints constraints;
@@ -218,7 +218,7 @@ class ConstrainedBox extends OneChildRenderObjectWrapper {
 }
 
 class AspectRatio extends OneChildRenderObjectWrapper {
-  AspectRatio({ String key, this.aspectRatio, Widget child })
+  AspectRatio({ Key key, this.aspectRatio, Widget child })
     : super(key: key, child: child);
 
   final double aspectRatio;
@@ -233,7 +233,7 @@ class AspectRatio extends OneChildRenderObjectWrapper {
 }
 
 class ShrinkWrapWidth extends OneChildRenderObjectWrapper {
-  ShrinkWrapWidth({ String key, this.stepWidth, this.stepHeight, Widget child })
+  ShrinkWrapWidth({ Key key, this.stepWidth, this.stepHeight, Widget child })
     : super(key: key, child: child);
 
   final double stepWidth;
@@ -250,7 +250,7 @@ class ShrinkWrapWidth extends OneChildRenderObjectWrapper {
 }
 
 class Baseline extends OneChildRenderObjectWrapper {
-  Baseline({ String key, this.baseline, this.baselineType: TextBaseline.alphabetic, Widget child })
+  Baseline({ Key key, this.baseline, this.baselineType: TextBaseline.alphabetic, Widget child })
     : super(key: key, child: child);
 
   final double baseline; // in pixels
@@ -267,7 +267,7 @@ class Baseline extends OneChildRenderObjectWrapper {
 }
 
 class Viewport extends OneChildRenderObjectWrapper {
-  Viewport({ String key, this.offset: 0.0, Widget child })
+  Viewport({ Key key, this.offset: 0.0, Widget child })
     : super(key: key, child: child);
 
   final double offset;
@@ -282,7 +282,7 @@ class Viewport extends OneChildRenderObjectWrapper {
 }
 
 class SizeObserver extends OneChildRenderObjectWrapper {
-  SizeObserver({ String key, this.callback, Widget child })
+  SizeObserver({ Key key, this.callback, Widget child })
     : super(key: key, child: child);
 
   final SizeChangedCallback callback;
@@ -307,7 +307,7 @@ class SizeObserver extends OneChildRenderObjectWrapper {
 class Container extends Component {
 
   Container({
-    String key,
+    Key key,
     this.child,
     this.constraints,
     this.decoration,
@@ -364,7 +364,7 @@ class Container extends Component {
 // LAYOUT NODES
 
 class Block extends MultiChildRenderObjectWrapper {
-  Block(List<Widget> children, { String key })
+  Block(List<Widget> children, { Key key })
     : super(key: key, children: children);
 
   RenderBlock createNode() => new RenderBlock();
@@ -372,7 +372,7 @@ class Block extends MultiChildRenderObjectWrapper {
 }
 
 class Stack extends MultiChildRenderObjectWrapper {
-  Stack(List<Widget> children, { String key })
+  Stack(List<Widget> children, { Key key })
     : super(key: key, children: children);
 
   RenderStack createNode() => new RenderStack();
@@ -381,7 +381,7 @@ class Stack extends MultiChildRenderObjectWrapper {
 
 class Positioned extends ParentDataNode {
   Positioned({
-    String key,
+    Key key,
     Widget child,
     double top,
     double right,
@@ -398,7 +398,7 @@ class Positioned extends ParentDataNode {
 class Flex extends MultiChildRenderObjectWrapper {
 
   Flex(List<Widget> children, {
-    String key,
+    Key key,
     this.direction: FlexDirection.horizontal,
     this.justifyContent: FlexJustifyContent.start,
     this.alignItems: FlexAlignItems.center,
@@ -424,12 +424,12 @@ class Flex extends MultiChildRenderObjectWrapper {
 }
 
 class Flexible extends ParentDataNode {
-  Flexible({ String key, int flex: 1, Widget child })
+  Flexible({ Key key, int flex: 1, Widget child })
     : super(child, new FlexBoxParentData()..flex = flex, key: key);
 }
 
 class Inline extends LeafRenderObjectWrapper {
-  Inline({ String key, this.text }) : super(key: key);
+  Inline({ Key key, this.text }) : super(key: key);
 
   final InlineBase text;
 
@@ -446,7 +446,7 @@ class StyledText extends Component {
   // elements ::= "string" | [<text-style> <elements>*]
   // Where "string" is text to display and text-style is an instance of
   // TextStyle. The text-style applies to all of the elements that follow.
-  StyledText({ this.elements, String key }) : super(key: key);
+  StyledText({ this.elements, Key key }) : super(key: key);
 
   final dynamic elements;
 
@@ -464,7 +464,7 @@ class StyledText extends Component {
 }
 
 class Text extends Component {
-  Text(this.data, { String key, TextStyle this.style }) : super(key: key);
+  Text(this.data, { Key key, TextStyle this.style }) : super(key: key);
 
   final String data;
   final TextStyle style;
@@ -488,9 +488,7 @@ class Text extends Component {
 }
 
 class Image extends LeafRenderObjectWrapper {
-  Image({ sky.Image image, this.width, this.height, this.colorFilter })
-    : image = image,
-      super(key: image.hashCode.toString()); // TODO(ianh): Find a way to uniquely identify the sky.Image rather than using hashCode, which could collide
+  Image({ Key key, this.image, this.width, this.height, this.colorFilter }) : super(key: key);
 
   final sky.Image image;
   final double width;
@@ -510,8 +508,7 @@ class Image extends LeafRenderObjectWrapper {
 }
 
 class FutureImage extends StatefulComponent {
-  FutureImage({ String key, this.image, this.width, this.height, this.colorFilter })
-    : super(key: key);
+  FutureImage({ Key key, this.image, this.width, this.height, this.colorFilter }) : super(key: key);
 
   Future<sky.Image> image;
   double width;
@@ -555,8 +552,7 @@ class FutureImage extends StatefulComponent {
 }
 
 class NetworkImage extends Component {
-  NetworkImage({ String src, this.width, this.height, this.colorFilter })
-    : src = src, super(key: src);
+  NetworkImage({ Key key, this.src, this.width, this.height, this.colorFilter }) : super(key: key);
 
   final String src;
   final double width;
@@ -574,9 +570,7 @@ class NetworkImage extends Component {
 }
 
 class AssetImage extends Component {
-  AssetImage({ String name, this.bundle, this.width, this.height, this.colorFilter })
-    : name = name,
-      super(key: name);
+  AssetImage({ Key key, this.name, this.bundle, this.width, this.height, this.colorFilter }) : super(key: key);
 
   final String name;
   final AssetBundle bundle;
@@ -597,7 +591,7 @@ class AssetImage extends Component {
 class WidgetToRenderBoxAdapter extends LeafRenderObjectWrapper {
   WidgetToRenderBoxAdapter(RenderBox renderBox)
     : renderBox = renderBox,
-      super(key: renderBox.hashCode.toString()); // TODO(ianh): Find a way to uniquely identify the RenderBox rather than using hashCode, which could collide
+      super(key: new Key.fromObjectIdentity(renderBox));
 
   final RenderBox renderBox;
 

packages/flutter/lib/widgets/block_viewport.dart

@@ -16,7 +16,7 @@ class _Key {
   const _Key(this.type, this.key);
   factory _Key.fromWidget(Widget widget) => new _Key(widget.runtimeType, widget.key);
   final Type type;
-  final String key;
+  final Key key;
   bool operator ==(other) => other is _Key && other.type == type && other.key == key;
   int get hashCode => 373 * 37 * type.hashCode + key.hashCode;
   String toString() => "_Key(type: $type, key: $key)";
@@ -78,7 +78,7 @@ class BlockViewportLayoutState {
 }
 
 class BlockViewport extends RenderObjectWrapper {
-  BlockViewport({ this.builder, this.startOffset, this.token, this.layoutState, String key })
+  BlockViewport({ this.builder, this.startOffset, this.token, this.layoutState, Key key })
     : super(key: key) {
     assert(this.layoutState != null);
   }

packages/flutter/lib/widgets/button_base.dart

@@ -6,7 +6,7 @@ import 'package:sky/widgets/basic.dart';
 
 abstract class ButtonBase extends StatefulComponent {
 
-  ButtonBase({ String key, this.highlight: false }) : super(key: key);
+  ButtonBase({ Key key, this.highlight: false }) : super(key: key);
 
   bool highlight;
 

packages/flutter/lib/widgets/card.dart

@@ -11,7 +11,7 @@ const EdgeDims kCardMargins = const EdgeDims.all(4.0);
 ///
 /// <https://www.google.com/design/spec/components/cards.html>
 class Card extends Component {
-  Card({ String key, this.child, this.color }) : super(key: key);
+  Card({ Key key, this.child, this.color }) : super(key: key);
 
   final Widget child;
   final Color color;

packages/flutter/lib/widgets/checkbox.dart

@@ -32,7 +32,7 @@ class Checkbox extends Toggleable {
   /// * `value` determines whether the checkbox is checked.
   /// * `onChanged` is called whenever the state of the checkbox should change.
   Checkbox({
-    String key,
+    Key key,
     bool value,
     ValueChanged onChanged
   }) : super(key: key, value: value, onChanged: onChanged);

packages/flutter/lib/widgets/default_text_style.dart

@@ -9,7 +9,7 @@ import 'package:sky/widgets/widget.dart';
 class DefaultTextStyle extends Inherited {
 
   DefaultTextStyle({
-    String key,
+    Key key,
     this.style,
     Widget child
   }) : super(key: key, child: child) {

packages/flutter/lib/widgets/dialog.dart

@@ -14,7 +14,7 @@ import 'package:sky/widgets/theme.dart';
 /// <https://www.google.com/design/spec/components/dialogs.html>
 class Dialog extends Component {
   Dialog({
-    String key,
+    Key key,
     this.title,
     this.content,
     this.actions,

packages/flutter/lib/widgets/dismissable.dart

@@ -22,7 +22,7 @@ typedef void DismissedCallback();
 class Dismissable extends AnimatedComponent {
 
   Dismissable({
-    String key,
+    Key key,
     this.child,
     this.onDismissed
     // TODO(hansmuller): direction

packages/flutter/lib/widgets/drawer.dart

@@ -46,7 +46,7 @@ typedef void DrawerStatusChangedCallback(DrawerStatus status);
 
 class Drawer extends AnimatedComponent {
   Drawer({
-    String key,
+    Key key,
     this.children,
     this.showing: false,
     this.level: 0,

packages/flutter/lib/widgets/drawer_divider.dart

@@ -6,7 +6,7 @@ import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/theme.dart';
 
 class DrawerDivider extends Component {
-  DrawerDivider({ String key }) : super(key: key);
+  DrawerDivider({ Key key }) : super(key: key);
 
   Widget build() {
     return new Container(

packages/flutter/lib/widgets/drawer_header.dart

@@ -12,7 +12,7 @@ import 'package:sky/widgets/theme.dart';
 
 class DrawerHeader extends Component {
 
-  DrawerHeader({ String key, this.children }) : super(key: key);
+  DrawerHeader({ Key key, this.children }) : super(key: key);
 
   final List<Widget> children;
 

packages/flutter/lib/widgets/drawer_item.dart

@@ -15,7 +15,7 @@ import 'package:sky/widgets/theme.dart';
 import 'package:sky/widgets/widget.dart';
 
 class DrawerItem extends ButtonBase {
-  DrawerItem({ String key, this.icon, this.children, this.onPressed, this.selected: false })
+  DrawerItem({ Key key, this.icon, this.children, this.onPressed, this.selected: false })
     : super(key: key);
 
   String icon;

packages/flutter/lib/widgets/fixed_height_scrollable.dart

@@ -10,7 +10,7 @@ import 'package:sky/widgets/scrollable.dart';
 
 abstract class FixedHeightScrollable extends Scrollable {
 
-  FixedHeightScrollable({ String key, this.itemHeight, this.padding })
+  FixedHeightScrollable({ Key key, this.itemHeight, this.padding })
       : super(key: key) {
     assert(itemHeight != null);
   }

packages/flutter/lib/widgets/flat_button.dart

@@ -9,7 +9,7 @@ import 'package:sky/widgets/theme.dart';
 
 class FlatButton extends MaterialButton {
   FlatButton({
-    String key,
+    Key key,
     Widget child,
     bool enabled: true,
     Function onPressed

packages/flutter/lib/widgets/floating_action_button.dart

@@ -16,7 +16,7 @@ const double _kSize = 56.0;
 class FloatingActionButton extends ButtonBase {
 
   FloatingActionButton({
-    String key,
+    Key key,
     this.child,
     this.backgroundColor,
     this.onPressed

packages/flutter/lib/widgets/icon.dart

@@ -19,7 +19,7 @@ class IconThemeData {
 class IconTheme extends Inherited {
 
   IconTheme({
-    String key,
+    Key key,
     this.data,
     Widget child
   }) : super(key: key, child: child) {
@@ -49,7 +49,7 @@ final AssetBundle _iconBundle = _initIconBundle();
 
 class Icon extends Component {
   Icon({
-    String key,
+    Key key,
     this.size,
     this.type: '',
     this.color,

packages/flutter/lib/widgets/icon_button.dart

@@ -11,8 +11,7 @@ import 'package:sky/widgets/widget.dart';
 
 class IconButton extends Component {
 
-  IconButton({ String icon: '', this.onPressed, this.color })
-    : super(key: icon), icon = icon;
+  IconButton({ Key key, this.icon, this.onPressed, this.color }) : super(key: key);
 
   final String icon;
   final Function onPressed;

packages/flutter/lib/widgets/ink_well.dart

@@ -126,7 +126,7 @@ class RenderInkWell extends RenderProxyBox {
 }
 
 class InkWell extends OneChildRenderObjectWrapper {
-  InkWell({ String key, Widget child })
+  InkWell({ Key key, Widget child })
     : super(key: key, child: child);
 
   RenderInkWell get root => super.root;

packages/flutter/lib/widgets/material.dart

@@ -20,7 +20,7 @@ const Map<MaterialType, double> edges = const {
 
 class Material extends Component {
   Material({
-    String key,
+    Key key,
     this.child,
     this.type: MaterialType.card,
     this.level: 0,
@@ -49,7 +49,7 @@ class Material extends Component {
 
   Widget build() {
     return new AnimatedContainer(
-      duration: const Duration(milliseconds: 1000),
+      duration: const Duration(milliseconds: 200),
       decoration: new BoxDecoration(
         backgroundColor: _backgroundColor,
         borderRadius: edges[type],

packages/flutter/lib/widgets/material_button.dart

@@ -11,7 +11,7 @@ import 'package:sky/widgets/material.dart';
 abstract class MaterialButton extends ButtonBase {
 
   MaterialButton({
-    String key,
+    Key key,
     this.child,
     this.enabled: true,
     this.onPressed

packages/flutter/lib/widgets/modal_overlay.dart

@@ -7,7 +7,7 @@ import 'package:sky/widgets/widget.dart';
 
 class ModalOverlay extends Component {
 
-  ModalOverlay({ String key, this.children, this.onDismiss }) : super(key: key);
+  ModalOverlay({ Key key, this.children, this.onDismiss }) : super(key: key);
 
   final List<Widget> children;
   final Function onDismiss;

packages/flutter/lib/widgets/navigator.dart

@@ -46,7 +46,7 @@ const Point _kTransitionStartPoint = const Point(0.0, 75.0);
 enum TransitionDirection { forward, reverse }
 class Transition extends AnimatedComponent {
   Transition({
-    String key,
+    Key key,
     this.content,
     this.direction,
     this.onDismissed,
@@ -190,7 +190,7 @@ class NavigationState {
 
 class Navigator extends StatefulComponent {
 
-  Navigator(this.state, { String key }) : super(key: key);
+  Navigator(this.state, { Key key }) : super(key: key);
 
   NavigationState state;
 
@@ -242,7 +242,7 @@ class Navigator extends StatefulComponent {
       if (content == null)
         continue;
       Transition transition = new Transition(
-        key: historyEntry.hashCode.toString(), // TODO(ianh): make it not collide
+        key: new Key.fromObjectIdentity(historyEntry),
         content: content,
         direction: (i <= state.historyIndex) ? TransitionDirection.forward : TransitionDirection.reverse,
         interactive: (i == state.historyIndex),

packages/flutter/lib/widgets/popup_menu.dart

@@ -35,7 +35,7 @@ typedef void PopupMenuStatusChangedCallback(PopupMenuStatus status);
 class PopupMenu extends AnimatedComponent {
 
   PopupMenu({
-    String key,
+    Key key,
     this.showing,
     this.onStatusChanged,
     this.items,

packages/flutter/lib/widgets/popup_menu_item.dart

@@ -13,7 +13,7 @@ const double kBaselineOffsetFromBottom = 20.0;
 
 class PopupMenuItem extends Component {
   PopupMenuItem({
-    String key,
+    Key key,
     this.onPressed,
     this.child
   }) : super(key: key);

packages/flutter/lib/widgets/radio.dart

@@ -17,7 +17,7 @@ typedef void ValueChanged(value);
 class Radio extends ButtonBase {
 
   Radio({
-    String key,
+    Key key,
     this.value,
     this.groupValue,
     this.onChanged

packages/flutter/lib/widgets/raised_button.dart

@@ -10,7 +10,7 @@ import 'package:sky/widgets/theme.dart';
 class RaisedButton extends MaterialButton {
 
   RaisedButton({
-    String key,
+    Key key,
     Widget child,
     bool enabled: true,
     Function onPressed

packages/flutter/lib/widgets/scaffold.dart

@@ -173,7 +173,7 @@ class RenderScaffold extends RenderBox {
 class Scaffold extends RenderObjectWrapper {
 
   Scaffold({
-    String key,
+    Key key,
     Widget body,
     Widget statusBar,
     Widget toolbar,

packages/flutter/lib/widgets/scrollable.dart

@@ -27,7 +27,7 @@ enum ScrollDirection { vertical, horizontal }
 abstract class Scrollable extends StatefulComponent {
 
   Scrollable({
-    String key,
+    Key key,
     this.direction: ScrollDirection.vertical
   }) : super(key: key);
 

packages/flutter/lib/widgets/scrollable_list.dart

@@ -11,7 +11,7 @@ typedef Widget ItemBuilder<T>(T item);
 
 class ScrollableList<T> extends FixedHeightScrollable {
   ScrollableList({
-    String key,
+    Key key,
     this.items,
     this.itemBuilder,
     double itemHeight,

packages/flutter/lib/widgets/scrollable_viewport.dart

@@ -8,7 +8,7 @@ import 'package:sky/widgets/scrollable.dart';
 
 class ScrollableViewport extends Scrollable {
 
-  ScrollableViewport({ String key, this.child }) : super(key: key);
+  ScrollableViewport({ Key key, this.child }) : super(key: key);
 
   Widget child;
 
@@ -54,7 +54,7 @@ class ScrollableViewport extends Scrollable {
 
 class ScrollableBlock extends Component {
 
-  ScrollableBlock(this.children, { String key }) : super(key: key);
+  ScrollableBlock(this.children, { Key key }) : super(key: key);
 
   final List<Widget> children;
 

packages/flutter/lib/widgets/snack_bar.dart

@@ -2,15 +2,29 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'package:sky/animation/animated_value.dart';
+import 'package:sky/animation/animation_performance.dart';
 import 'package:sky/painting/text_style.dart';
 import 'package:sky/theme/typography.dart' as typography;
+import 'package:sky/widgets/animated_component.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/default_text_style.dart';
 import 'package:sky/widgets/material.dart';
 import 'package:sky/widgets/theme.dart';
 
+import 'package:vector_math/vector_math.dart';
+
+enum SnackBarStatus {
+  active,
+  inactive,
+}
+
+typedef void SnackBarStatusChangedCallback(SnackBarStatus status);
+
+const Duration _kSlideInDuration = const Duration(milliseconds: 200);
+
 class SnackBarAction extends Component {
-  SnackBarAction({String key, this.label, this.onPressed }) : super(key: key) {
+  SnackBarAction({Key key, this.label, this.onPressed }) : super(key: key) {
     assert(label != null);
   }
 
@@ -29,18 +43,64 @@ class SnackBarAction extends Component {
   }
 }
 
-class SnackBar extends Component {
+class SnackBar extends AnimatedComponent {
 
   SnackBar({
-    String key,
+    Key key,
     this.content,
-    this.actions
+    this.actions,
+    this.showing,
+    this.onStatusChanged
   }) : super(key: key) {
     assert(content != null);
   }
 
-  final Widget content;
-  final List<SnackBarAction> actions;
+  Widget content;
+  List<SnackBarAction> actions;
+  bool showing;
+  SnackBarStatusChangedCallback onStatusChanged;
+
+  void syncFields(SnackBar source) {
+    content = source.content;
+    actions = source.actions;
+    onStatusChanged = source.onStatusChanged;
+    if (showing != source.showing) {
+      showing = source.showing;
+      showing ? _show() : _hide();
+    }
+  }
+
+  AnimatedValue<Point> _position;
+  AnimationPerformance _performance;
+
+  void initState() {
+    _position = new AnimatedValue<Point>(new Point(0.0, 50.0), end: Point.origin);
+    _performance = new AnimationPerformance()
+      ..duration = _kSlideInDuration
+      ..variable = _position
+      ..addListener(_checkStatusChanged);
+    watch(_performance);
+    if (showing)
+      _show();
+  }
+
+  void _show() {
+    _performance.play();
+  }
+
+  void _hide() {
+    _performance.reverse();
+  }
+
+  SnackBarStatus _lastStatus;
+  void _checkStatusChanged() {
+    SnackBarStatus status = _status;
+    if (_lastStatus != null && status != _lastStatus && onStatusChanged != null)
+      onStatusChanged(status);
+    _lastStatus = status;
+  }
+
+  SnackBarStatus get _status => _performance.isDismissed ? SnackBarStatus.inactive : SnackBarStatus.active;
 
   Widget build() {
     List<Widget> children = [
@@ -53,18 +113,22 @@ class SnackBar extends Component {
           )
         )
       )
-    ];
-    if (actions != null)
-      children.addAll(actions);
-    return new Material(
-      level: 2,
-      color: const Color(0xFF323232),
-      type: MaterialType.canvas,
-      child: new Container(
-        margin: const EdgeDims.symmetric(horizontal: 24.0),
-        child: new DefaultTextStyle(
-          style: new TextStyle(color: Theme.of(this).accentColor),
-          child: new Flex(children)
+    ]..addAll(actions);
+
+    Matrix4 transform = new Matrix4.identity();
+    transform.translate(_position.value.x, _position.value.y);
+    return new Transform(
+       transform: transform,
+       child: new Material(
+        level: 2,
+        color: const Color(0xFF323232),
+        type: MaterialType.canvas,
+        child: new Container(
+          margin: const EdgeDims.symmetric(horizontal: 24.0),
+          child: new DefaultTextStyle(
+            style: new TextStyle(color: Theme.of(this).accentColor),
+            child: new Flex(children)
+          )
         )
       )
     );

packages/flutter/lib/widgets/switch.dart

@@ -26,7 +26,7 @@ class Switch extends Toggleable {
   // TODO(jackson): Hit-test the switch so that it can respond to both taps and swipe gestures
 
   Switch({
-    String key,
+    Key key,
     bool value,
     ValueChanged onChanged
   }) : super(key: key, value: value, onChanged: onChanged);

packages/flutter/lib/widgets/tabs.dart

@@ -249,14 +249,14 @@ class RenderTabBar extends RenderBox with
 
 class TabBarWrapper extends MultiChildRenderObjectWrapper {
   TabBarWrapper({
+    Key key,
     List<Widget> children,
     this.selectedIndex,
     this.backgroundColor,
     this.indicatorColor,
     this.textAndIcons,
     this.scrollable: false,
-    this.onLayoutChanged,
-    String key
+    this.onLayoutChanged
   }) : super(key: key, children: children);
 
   final int selectedIndex;
@@ -289,7 +289,7 @@ class TabLabel {
 
 class Tab extends Component {
   Tab({
-    String key,
+    Key key,
     this.label,
     this.selected: false
   }) : super(key: key) {
@@ -347,7 +347,7 @@ class Tab extends Component {
 
 class TabBar extends Scrollable {
   TabBar({
-    String key,
+    Key key,
     this.labels,
     this.selectedIndex: 0,
     this.onChanged,
@@ -378,13 +378,11 @@ class TabBar extends Scrollable {
   }
 
   Widget _toTab(TabLabel label, int tabIndex) {
-    Tab tab = new Tab(
-      label: label,
-      selected: tabIndex == selectedIndex,
-      key: label.text == null ? label.icon : label.text
-    );
     return new Listener(
-      child: tab,
+      child: new Tab(
+        label: label,
+        selected: tabIndex == selectedIndex
+      ),
       onGestureTap: (_) => _handleTap(tabIndex)
     );
   }
@@ -472,7 +470,7 @@ class TabNavigatorView {
 
 class TabNavigator extends Component {
   TabNavigator({
-    String key,
+    Key key,
     this.views,
     this.selectedIndex: 0,
     this.onChanged,

packages/flutter/lib/widgets/theme.dart

@@ -11,7 +11,7 @@ export 'package:sky/theme/theme_data.dart' show ThemeData, ThemeBrightness;
 class Theme extends Inherited {
 
   Theme({
-    String key,
+    Key key,
     this.data,
     Widget child
   }) : super(key: key, child: child) {

packages/flutter/lib/widgets/toggleable.dart

@@ -17,7 +17,7 @@ const Duration _kCheckDuration = const Duration(milliseconds: 200);
 abstract class Toggleable extends AnimatedComponent {
 
   Toggleable({
-    String key,
+    Key key,
     this.value,
     this.onChanged
   }) : super(key: key);

packages/flutter/lib/widgets/tool_bar.dart

@@ -16,7 +16,7 @@ import 'package:sky/widgets/icon.dart';
 class ToolBar extends Component {
 
   ToolBar({
-    String key,
+    Key key,
     this.left,
     this.center,
     this.right,

packages/flutter/lib/widgets/variable_height_scrollable.dart

@@ -12,7 +12,7 @@ export 'package:sky/widgets/block_viewport.dart' show BlockViewportLayoutState;
 
 class VariableHeightScrollable extends Scrollable {
   VariableHeightScrollable({
-    String key,
+    Key key,
     this.builder,
     this.token,
     this.layoutState

packages/flutter/lib/widgets/widget.dart

@@ -21,22 +21,54 @@ final bool _shouldLogRenderDuration = false;
 typedef Widget Builder();
 typedef void WidgetTreeWalker(Widget);
 
+abstract class KeyBase {
+}
+
+abstract class Key extends KeyBase {
+  Key.constructor(); // so that subclasses can call us, since the Key() factory constructor shadows the implicit constructor
+  factory Key(String value) => new StringKey(value);
+  factory Key.stringify(Object value) => new StringKey(value.toString());
+  factory Key.fromObjectIdentity(Object value) => new ObjectKey(value);
+  factory Key.unique() => new UniqueKey();
+}
+
+class StringKey extends Key {
+  StringKey(this.value) : super.constructor();
+  final String value;
+  String toString() => value;
+  bool operator==(other) => other is StringKey && other.value == value;
+  int get hashCode => value.hashCode;
+}
+
+class ObjectKey extends Key {
+  ObjectKey(this.value) : super.constructor();
+  final Object value;
+  String toString() => '[Instance of ${value.runtimeType}]';
+  bool operator==(other) => other is ObjectKey && identical(other.value, value);
+  int get hashCode => identityHashCode(value);
+}
+
+class UniqueKey extends Key {
+  UniqueKey() : super.constructor();
+  String toString() => '[$hashCode]';
+}
+
 /// A base class for elements of the widget tree
 abstract class Widget {
 
-  Widget({ String key }) : _key = key {
+  Widget({ Key key }) : _key = key {
     assert(_isConstructedDuringBuild());
   }
 
   // TODO(jackson): Remove this workaround for limitation of Dart mixins
-  Widget._withKey(String key) : _key = key {
+  Widget._withKey(Key key) : _key = key {
     assert(_isConstructedDuringBuild());
   }
 
   // you should not build the UI tree ahead of time, build it only during build()
   bool _isConstructedDuringBuild() => this is AbstractWidgetRoot || this is App || _inRenderDirtyComponents || _inLayoutCallbackBuilder > 0;
 
-  String _key;
+  Key _key;
 
   /// A semantic identifer for this widget
   ///
@@ -46,7 +78,7 @@ abstract class Widget {
   /// Assigning a key to a widget can improve performance by causing the
   /// framework to sync widgets that share a lot of common structure and can
   /// help match stateful components semantically rather than positionally.
-  String get key => _key;
+  Key get key => _key;
 
   Widget _parent;
 
@@ -243,11 +275,11 @@ abstract class Widget {
 // stylistic information, etc.
 abstract class TagNode extends Widget {
 
-  TagNode(Widget child, { String key })
+  TagNode(Widget child, { Key key })
     : this.child = child, super(key: key);
 
   // TODO(jackson): Remove this workaround for limitation of Dart mixins
-  TagNode._withKey(Widget child, String key)
+  TagNode._withKey(Widget child, Key key)
     : this.child = child, super._withKey(key);
 
   Widget child;
@@ -284,14 +316,14 @@ abstract class TagNode extends Widget {
 }
 
 class ParentDataNode extends TagNode {
-  ParentDataNode(Widget child, this.parentData, { String key })
+  ParentDataNode(Widget child, this.parentData, { Key key })
     : super(child, key: key);
   final ParentData parentData;
 }
 
 abstract class Inherited extends TagNode {
 
-  Inherited({ String key, Widget child }) : super._withKey(child, key);
+  Inherited({ Key key, Widget child }) : super._withKey(child, key);
 
   void _sync(Widget old, dynamic slot) {
     if (old != null && syncShouldNotify(old)) {
@@ -320,7 +352,7 @@ typedef void EventListener(sky.Event e);
 class Listener extends TagNode  {
 
   Listener({
-    String key,
+    Key key,
     Widget child,
     EventListener onWheel,
     GestureEventListener onGestureFlingCancel,
@@ -407,7 +439,7 @@ class Listener extends TagNode  {
 
 abstract class Component extends Widget {
 
-  Component({ String key })
+  Component({ Key key })
       : _order = _currentOrder + 1,
         super._withKey(key);
 
@@ -524,7 +556,7 @@ abstract class Component extends Widget {
 
 abstract class StatefulComponent extends Component {
 
-  StatefulComponent({ String key }) : super(key: key);
+  StatefulComponent({ Key key }) : super(key: key);
 
   bool _disqualifiedFromEverAppearingAgain = false;
   bool _isStateInitialized = false;
@@ -599,11 +631,13 @@ int _inLayoutCallbackBuilder = 0;
 
 class LayoutCallbackBuilderHandle { bool _active = true; }
 LayoutCallbackBuilderHandle enterLayoutCallbackBuilder() {
+  LayoutCallbackBuilderHandle result;
   assert(() {
     _inLayoutCallbackBuilder += 1;
+    result = new LayoutCallbackBuilderHandle();
     return true;
   });
-  return new LayoutCallbackBuilderHandle();
+  return result;
 }
 void exitLayoutCallbackBuilder(LayoutCallbackBuilderHandle handle) {
   assert(() {
@@ -682,7 +716,7 @@ void _scheduleComponentForRender(Component c) {
 // become stateful.
 abstract class RenderObjectWrapper extends Widget {
 
-  RenderObjectWrapper({ String key }) : super(key: key);
+  RenderObjectWrapper({ Key key }) : super(key: key);
 
   RenderObject createNode();
 
@@ -766,7 +800,7 @@ abstract class RenderObjectWrapper extends Widget {
 
 abstract class LeafRenderObjectWrapper extends RenderObjectWrapper {
 
-  LeafRenderObjectWrapper({ String key }) : super(key: key);
+  LeafRenderObjectWrapper({ Key key }) : super(key: key);
 
   void insertChildRoot(RenderObjectWrapper child, dynamic slot) {
     assert(false);
@@ -780,7 +814,7 @@ abstract class LeafRenderObjectWrapper extends RenderObjectWrapper {
 
 abstract class OneChildRenderObjectWrapper extends RenderObjectWrapper {
 
-  OneChildRenderObjectWrapper({ String key, Widget child })
+  OneChildRenderObjectWrapper({ Key key, Widget child })
     : _child = child, super(key: key);
 
   Widget _child;
@@ -828,7 +862,7 @@ abstract class MultiChildRenderObjectWrapper extends RenderObjectWrapper {
   // In MultiChildRenderObjectWrapper subclasses, slots are RenderObject nodes
   // to use as the "insert before" sibling in ContainerRenderObjectMixin.add() calls
 
-  MultiChildRenderObjectWrapper({ String key, List<Widget> children })
+  MultiChildRenderObjectWrapper({ Key key, List<Widget> children })
     : this.children = children == null ? const [] : children,
       super(key: key) {
     assert(!_debugHasDuplicateIds());
@@ -867,7 +901,7 @@ abstract class MultiChildRenderObjectWrapper extends RenderObjectWrapper {
   }
 
   bool _debugHasDuplicateIds() {
-    var idSet = new HashSet<String>();
+    var idSet = new HashSet<Key>();
     for (var child in children) {
       assert(child != null);
       if (child.key == null)
@@ -922,9 +956,9 @@ abstract class MultiChildRenderObjectWrapper extends RenderObjectWrapper {
       nextSibling = children[endIndex].root;
     }
 
-    HashMap<String, Widget> oldNodeIdMap = null;
+    HashMap<Key, Widget> oldNodeIdMap = null;
 
-    bool oldNodeReordered(String key) {
+    bool oldNodeReordered(Key key) {
       return oldNodeIdMap != null &&
              oldNodeIdMap.containsKey(key) &&
              oldNodeIdMap[key] == null;
@@ -942,7 +976,7 @@ abstract class MultiChildRenderObjectWrapper extends RenderObjectWrapper {
       if (oldNodeIdMap != null)
         return;
 
-      oldNodeIdMap = new HashMap<String, Widget>();
+      oldNodeIdMap = new HashMap<Key, Widget>();
       for (int i = oldStartIndex; i < oldEndIndex; i++) {
         var node = oldChildren[i];
         if (node.key != null)
@@ -1047,7 +1081,7 @@ class WidgetSkyBinding extends SkyBinding {
 
 abstract class App extends StatefulComponent {
 
-  App({ String key }) : super(key: key);
+  App({ Key key }) : super(key: key);
 
   void _handleEvent(sky.Event event) {
     if (event.type == 'back')
@@ -1095,7 +1129,7 @@ abstract class AbstractWidgetRoot extends StatefulComponent {
 }
 
 class RenderViewWrapper extends OneChildRenderObjectWrapper {
-  RenderViewWrapper({ String key, Widget child }) : super(key: key, child: child);
+  RenderViewWrapper({ Key key, Widget child }) : super(key: key, child: child);
   RenderView get root => super.root;
   RenderView createNode() => SkyBinding.instance.renderView;
 }