Make the search box in the stocks app show a search field

The search field doesn't do anything, but it's there.

R=eseidel@chromium.org

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

examples/stocks-fn/stocks.sky

 #!mojo mojo:sky_viewer
 <sky>
+<import src="/sky/framework/debug/shake-to-reload.sky" />
 <script>
 import 'stocksapp.dart';
 main() {

examples/stocks-fn/stocksapp.dart

@@ -6,6 +6,7 @@ import '../../framework/components/drawer_header.dart';
 import '../../framework/components/fixed_height_scrollable.dart';
 import '../../framework/components/floating_action_button.dart';
 import '../../framework/components/icon.dart';
+import '../../framework/components/input.dart';
 import '../../framework/components/material.dart';
 import '../../framework/components/menu_divider.dart';
 import '../../framework/components/menu_item.dart';
@@ -40,12 +41,19 @@ class StocksApp extends App {
   );
 
   List<Stock> _sortedStocks;
+  bool _isSearching = false;
 
   StocksApp() : super() {
     _sortedStocks = oracle.stocks;
     _sortedStocks.sort((a, b) => a.symbol.compareTo(b.symbol));
   }
 
+  void _handleSearchClick(_) {
+    setState(() {
+      _isSearching = !_isSearching;
+    });
+  }
+
   Node build() {
     var drawer = new Drawer(
       animation: _drawerAnimation,
@@ -78,6 +86,9 @@ class StocksApp extends App {
       ]
     );
 
+    Node title = _isSearching ?
+        new Input(focused: true) : new Text('I am a stocks app');
+
     var toolbar = new Toolbar(
       children: [
         new Icon(key: 'menu', style: _iconStyle,
@@ -86,11 +97,12 @@ class StocksApp extends App {
           ..events.listen('click', _drawerAnimation.toggle),
         new Container(
           style: _titleStyle,
-          children: [new Text('I am a stocks app')]
+          children: [title]
         ),
         new Icon(key: 'search', style: _iconStyle,
             size: 24,
-            type: 'action/search_white'),
+            type: 'action/search_white')
+          ..events.listen('click', _handleSearchClick),
         new Icon(key: 'more_white', style: _iconStyle,
             size: 24,
             type: 'navigation/more_vert_white')