Add a TabNavigator to the Stocks demo

sky/sdk/example/stocks/lib/stock_home.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/editing/input.dart';
 import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/drawer.dart';
 import 'package:sky/widgets/drawer_header.dart';
 import 'package:sky/widgets/floating_action_button.dart';
 import 'package:sky/widgets/icon.dart';
 import 'package:sky/widgets/icon_button.dart';
 import 'package:sky/widgets/menu_divider.dart';
 import 'package:sky/widgets/menu_item.dart';
 import 'package:sky/widgets/modal_overlay.dart';
 import 'package:sky/widgets/navigator.dart';
 import 'package:sky/widgets/popup_menu.dart';
 import 'package:sky/widgets/radio.dart';
 import 'package:sky/widgets/scaffold.dart';
+import 'package:sky/widgets/tabs.dart';
 import 'package:sky/widgets/tool_bar.dart';
 import 'package:sky/widgets/widget.dart';
 
 import 'stock_data.dart';
 import 'stock_list.dart';
 import 'stock_menu.dart';
 import 'stock_types.dart';
 
 typedef void ModeUpdater(StockMode mode);
 
@@ skipping 123 matching lines @@
      ]
     );
   }
 
   void _handleOpenDrawer() {
     _drawerController.open();
     navigator.pushState("/drawer", (_) {
       _drawerController.close();
     });
   }
-
+  
   Widget buildToolBar() {
     return new ToolBar(
         left: new IconButton(
           icon: 'navigation/menu_white',
           onPressed: _handleOpenDrawer),
         center: new Text('Stocks'),
         right: [
           new IconButton(
             icon: 'action/search_white',
             onPressed: _handleSearchBegin),
           new IconButton(
             icon: 'navigation/more_vert_white',
             onPressed: _handleMenuShow)
         ]
       );
   }
 
+  int selectedTabIndex = 0;
+  List<String> portfolioSymbols = ["AAPL","FIZZ", "FIVE", "FLAT", "ZINC", "ZNGA"];
+
+  Widget buildPortfolioStocklist() {
+    return new Stocklist(
+     stocks: stocks.where((s) => portfolioSymbols.contains(s.symbol)).toList(), 
+     query: _searchQuery
+   );
+  }
+
+  Widget buildTabNavigator() {
+    List<TabNavigatorView> views = <TabNavigatorView>[
+      new TabNavigatorView(
+        label: const TabLabel(text: 'MARKET'),
+        builder: () => new Stocklist(stocks: stocks, query: _searchQuery)
+      ),
+      new TabNavigatorView(
+        label: const TabLabel(text: 'PORTFOLIO'),
+        builder: buildPortfolioStocklist
+      )
+    ];
+    return new TabNavigator(
+      views: views,
+      selectedIndex: selectedTabIndex,
+      onChanged: (tabIndex) {
+        setState(() { selectedTabIndex = tabIndex; } );
+      }
+    );
+  }
+
   // TODO(abarth): Should we factor this into a SearchBar in the framework?
   Widget buildSearchBar() {
     return new ToolBar(
       left: new IconButton(
         icon: 'navigation/arrow_back_grey600',
         onPressed: _handleSearchEnd),
       center: new Input(
         focused: true,
         placeholder: 'Search stocks',
         onChanged: _handleSearchQueryChanged),
@@ skipping 10 matching lines @@
         autorefresh: _autorefresh,
         onAutorefreshChanged: _handleAutorefreshChanged
       )],
       onDismiss: _handleMenuHide));
   }
 
   Widget build() {
     List<Widget> overlays = [
       new Scaffold(
         toolbar: _isSearching ? buildSearchBar() : buildToolBar(),
-        body: new Stocklist(stocks: stocks, query: _searchQuery),
+        body: buildTabNavigator(),
         floatingActionButton: new FloatingActionButton(
           child: new Icon(type: 'content/add_white', size: 24)
         ),
         drawer: _drawerShowing ? buildDrawer() : null
       ),
     ];
     addMenuToOverlays(overlays);
     return new Stack(overlays);
   }
 }