Add TabNavigator

sky/sdk/example/widgets/tabs.dart

Index: sky/sdk/example/widgets/tabs.dart
diff --git a/sky/sdk/example/widgets/tabs.dart b/sky/sdk/example/widgets/tabs.dart
index 320b0fc57d858a63a41f3c2add80437bbbfbd510..9e5df5b37c75838670faf22eefdad3aeb4f97690 100644
--- a/sky/sdk/example/widgets/tabs.dart
+++ b/sky/sdk/example/widgets/tabs.dart
@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import 'package:sky/theme/colors.dart';
+import 'package:sky/painting/text_style.dart';
 import 'package:sky/theme/typography.dart';
 import 'package:sky/widgets/basic.dart';
 import 'package:sky/widgets/material.dart';
@@ -12,36 +12,37 @@ import 'package:sky/widgets/tool_bar.dart';
 import 'package:sky/widgets/widget.dart';
 
 class TabbedNavigatorApp extends App {
-  static Iterable<String> items = const <String>["ONE", "TWO", "FREE", "FOUR"];
-  final List<int> navigatorSelections = new List<int>.filled(items.length, 0);
-
-  Widget buildTabNavigator(Iterable<TabLabel> labels, int navigatorIndex) {
-    TabBar tabBar = new TabBar(
-      labels: labels.toList(),
-      selectedIndex: navigatorSelections[navigatorIndex],
-      onChanged: (selectionIndex) {
-        setState(() { 
-          navigatorSelections[navigatorIndex] = selectionIndex;
-        });
-      }
-    );
+  int selectedIndex = 0;
 
-    return new Container(child: tabBar, margin: new EdgeDims.only(bottom: 16.0));
+  Widget _buildContent(String label) {
+    return new Center(
+      child: new Text(label, style: const TextStyle(fontSize: 48.0, fontWeight: extraBold))
+    );
   }
 
   Widget build() {
-    Iterable<TabLabel> textLabels = items
-      .map((s) => new TabLabel(text: "ITEM " + s));
-
-    Iterable<TabLabel> iconLabels = items
-      .map((s) => new TabLabel(icon: 'action/search_white'));
-
-    Iterable<TabLabel> textAndIconLabels = items
-      .map((s) => new TabLabel(text: "ITEM " + s, icon: 'action/search_white'));
+    List<TabNavigatorView> views = <TabNavigatorView>[
+      new TabNavigatorView(
+        label: const TabLabel(text: 'STOCKS', icon: 'action/list_white'),
+        builder: () => _buildContent("Stocks")
+      ),
+      new TabNavigatorView(
+        label: const TabLabel(text: 'PORTFOLIO', icon: 'action/account_circle_white'),
+        builder: () => _buildContent("Portfolio")
+      ),
+      new TabNavigatorView(
+        label: const TabLabel(text: 'SUMMARY', icon: 'action/assessment_white'),
+        builder: () => _buildContent("Summary")
+      )
+    ];
 
-    var navigatorIndex = 0;
-    Iterable<Widget> tabNavigators = [textLabels, iconLabels, textAndIconLabels]
-      .map((labels) => buildTabNavigator(labels, navigatorIndex++));
+    TabNavigator tabNavigator = new TabNavigator(
+      views: views,
+      selectedIndex: selectedIndex,
+      onChanged: (tabIndex) {
+        setState(() { selectedIndex = tabIndex; } );
+      }
+    );
 
     ToolBar toolbar = new ToolBar(
       center: new Text('Tabbed Navigator', style: white.title)
@@ -49,10 +50,7 @@ class TabbedNavigatorApp extends App {
 
     return new Scaffold(
       toolbar: toolbar,
-      body: new Material(
-        child: new Center(child: new Block(tabNavigators.toList())),
-        color: Grey[500]
-      )
+      body: new Material(child: tabNavigator)
     );
   }
 }