examples/flutter_gallery/lib/demo/scrollable_tabs_demo.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:flutter/material.dart';

enum TabsDemoStyle {
  iconsAndText,
  iconsOnly,
  textOnly
}

class ScrollableTabsDemo extends StatefulWidget {
  static const String routeName = '/scrollable-tabs';

  @override
  ScrollableTabsDemoState createState() => new ScrollableTabsDemoState();
}

class ScrollableTabsDemoState extends State<ScrollableTabsDemo> {
  final List<IconData> icons = <IconData>[
    Icons.event,
    Icons.home,
    Icons.android,
    Icons.alarm,
    Icons.face,
    Icons.language,
  ];

  final Map<IconData, String> labels = <IconData, String>{
    Icons.event: 'EVENT',
    Icons.home: 'HOME',
    Icons.android: 'ANDROID',
    Icons.alarm: 'ALARM',
    Icons.face: 'FACE',
    Icons.language: 'LANGUAGE',
  };

  TabsDemoStyle _demoStyle = TabsDemoStyle.iconsAndText;

  void changeDemoStyle(TabsDemoStyle style) {
    setState(() {
      _demoStyle = style;
    });
  }

  @override
  Widget build(BuildContext context) {
    final Color iconColor = Theme.of(context).accentColor;
    return new TabBarSelection<IconData>(
      values: icons,
      child: new Scaffold(
        appBar: new AppBar(
          title: new Text('Scrollable tabs'),
          actions: <Widget>[
            new PopupMenuButton<TabsDemoStyle>(
              onSelected: changeDemoStyle,
              itemBuilder: (BuildContext context) => <PopupMenuItem<TabsDemoStyle>>[
                new PopupMenuItem<TabsDemoStyle>(
                  value: TabsDemoStyle.iconsAndText,
                  child: new Text('Icons and text')
                ),
                new PopupMenuItem<TabsDemoStyle>(
                  value: TabsDemoStyle.iconsOnly,
                  child: new Text('Icons only')
                ),
                new PopupMenuItem<TabsDemoStyle>(
                  value: TabsDemoStyle.textOnly,
                  child: new Text('Text only')
                ),
              ]
            )
          ],
          bottom: new TabBar<IconData>(
            isScrollable: true,
            labels: new Map<IconData, TabLabel>.fromIterable(
              icons,
              value: (IconData icon) {
                switch(_demoStyle) {
                  case TabsDemoStyle.iconsAndText:
                    return new TabLabel(text: labels[icon], icon: new Icon(icon));
                  case TabsDemoStyle.iconsOnly:
                    return new TabLabel(icon: new Icon(icon));
                  case TabsDemoStyle.textOnly:
                    return new TabLabel(text: labels[icon]);
                }
              }
            )
          )
        ),
        body: new TabBarView<IconData>(
          children: icons.map((IconData icon) {
            return new Container(
              key: new ObjectKey(icon),
              padding: const EdgeInsets.all(12.0),
              child:new Card(
                child: new Center(
                  child: new Icon(
                    icon,
                    color: iconColor,
                    size: 128.0
                  )
                )
              )
            );
          }).toList()
        )
      )
    );
  }
}