Gratuitous tabs example enhancement

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 cc35e75488c6e76f7c2a09cd3fb633e9a676eaa0..872a3e719152aea9be79dde986b5eeeafbfe5b54 100644
--- a/sky/sdk/example/widgets/tabs.dart
+++ b/sky/sdk/example/widgets/tabs.dart
@@ -3,17 +3,28 @@
 // found in the LICENSE file.
 
 import 'package:sky/painting/text_style.dart';
-import 'package:sky/theme/colors.dart' as colors;
 import 'package:sky/theme/typography.dart' as typography;
 import 'package:sky/widgets/basic.dart';
-import 'package:sky/widgets/material.dart';
+import 'package:sky/widgets/card.dart';
 import 'package:sky/widgets/scaffold.dart';
 import 'package:sky/widgets/tabs.dart';
+import 'package:sky/widgets/theme.dart';
 import 'package:sky/widgets/tool_bar.dart';
 import 'package:sky/widgets/widget.dart';
 
 class TabbedNavigatorApp extends App {
-  int selectedIndex = 0;
+  // The index of the selected tab for each of the TabNavigators constructed below.
+  List<int> selectedIndices = new List<int>.filled(4, 0);
+
+  TabNavigator _buildTabNavigator(int n, List<TabNavigatorView> views) {
+    return new TabNavigator(
+      views: views,
+      selectedIndex: selectedIndices[n],
+      onChanged: (tabIndex) {
+        setState(() { selectedIndices[n] = tabIndex; } );
+      }
+    );
+  }
 
   Widget _buildContent(String label) {
     return new Center(
@@ -21,7 +32,29 @@ class TabbedNavigatorApp extends App {
     );
   }
 
-  Widget build() {
+  TabNavigator _buildTextLabelsTabNavigator(int n) {
+    Iterable<TabNavigatorView> views = ["ONE", "TWO", "FREE", "FOUR"]
+      .map((text) {
+        return new TabNavigatorView(
+          label: new TabLabel(text: text),
+          builder: () => _buildContent(text)
+        );
+      });
+    return _buildTabNavigator(n, views.toList());
+  }
+
+  TabNavigator _buildIconLabelsTabNavigator(int n) {
+    Iterable<TabNavigatorView> views = ["event", "home", "android", "alarm", "face", "language"]
+      .map((icon_name) {
+        return new TabNavigatorView(
+          label: new TabLabel(icon: "action/${icon_name}_white"),
+          builder: () => _buildContent(icon_name)
+        );
+      });
+    return _buildTabNavigator(n, views.toList());
+  }
+
+  TabNavigator _buildTextAndIconLabelsTabNavigator(int n) {
     List<TabNavigatorView> views = <TabNavigatorView>[
       new TabNavigatorView(
         label: const TabLabel(text: 'STOCKS', icon: 'action/list_white'),
@@ -36,14 +69,34 @@ class TabbedNavigatorApp extends App {
         builder: () => _buildContent("Summary")
       )
     ];
+    return _buildTabNavigator(n, views);
+  }
 
-    TabNavigator tabNavigator = new TabNavigator(
-      views: views,
-      selectedIndex: selectedIndex,
-      onChanged: (tabIndex) {
-        setState(() { selectedIndex = tabIndex; } );
-      }
+  Container _buildCard(TabNavigator tabNavigator) {
+    return new Container(
+     child: new Card(child: tabNavigator),
+     padding: const EdgeDims.all(12.0),
+     decoration: new BoxDecoration(backgroundColor: Theme.of(this).primary[50])
     );
+  }
+
+  Widget build() {
+    List<TabNavigatorView> views = <TabNavigatorView>[
+      new TabNavigatorView(
+        label: const TabLabel(text: 'TEXT'),
+        builder: () => _buildCard(_buildTextLabelsTabNavigator(0))
+      ),
+      new TabNavigatorView(
+        label: const TabLabel(text: 'ICONS'),
+        builder: () => _buildCard(_buildIconLabelsTabNavigator(1))
+      ),
+      new TabNavigatorView(
+        label: const TabLabel(text: 'BOTH'),
+        builder: () => _buildCard(_buildTextAndIconLabelsTabNavigator(2))
+      )
+    ];
+
+    TabNavigator tabNavigator = _buildTabNavigator(3, views);
 
     ToolBar toolbar = new ToolBar(
       center: new Text('Tabbed Navigator', style: typography.white.title)
@@ -51,10 +104,7 @@ class TabbedNavigatorApp extends App {
 
     return new Scaffold(
       toolbar: toolbar,
-      body: new Material(
-        color: colors.Grey[50],
-        child: tabNavigator
-      )
+      body: tabNavigator
     );
   }
 }