examples/flutter_gallery/lib/demo/tabs_fab_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';

const String _explanatoryText =
  "When the Scaffold's floating action button changes, the new button fades and "
  "turns into view. In this demo, changing tabs can cause the app to be rebuilt "
  "with a FloatingActionButton that the Scaffold distinguishes from the others "
  "by its key.";

class _Page {
  _Page({ this.label, this.colors, this.icon });

  final String label;
  final Map<int, Color> colors;
  final IconData icon;

  Color get labelColor => colors != null ? colors[300] : Colors.grey[300];
  bool get fabDefined => colors != null && icon != null;
  Color get fabColor => colors[400];
  Icon get fabIcon => new Icon(icon);
  Key get fabKey => new ValueKey<Color>(fabColor);
}

final List<_Page> _allPages = <_Page>[
  new _Page(label: 'Blue', colors: Colors.indigo, icon: Icons.add),
  new _Page(label: 'Eco', colors: Colors.green, icon: Icons.create),
  new _Page(label: 'No'),
  new _Page(label: 'Teal', colors: Colors.teal, icon: Icons.add),
  new _Page(label: 'Red', colors: Colors.red, icon: Icons.create),
];

class TabsFabDemo extends StatefulWidget {
  static const String routeName = '/tabs-fab';

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

class _TabsFabDemoState extends State<TabsFabDemo> with SingleTickerProviderStateMixin {
  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  TabController _controller;
  _Page _selectedPage;

  @override
  void initState() {
    super.initState();
    _controller = new TabController(vsync: this, length: _allPages.length);
    _controller.addListener(_handleTabSelection);
    _selectedPage = _allPages[0];
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _handleTabSelection() {
    setState(() {
      _selectedPage = _allPages[_controller.index];
    });
  }

  void _showExplanatoryText() {
    _scaffoldKey.currentState.showBottomSheet<Null>((BuildContext context) {
      return new Container(
        decoration: new BoxDecoration(
          border: new Border(top: new BorderSide(color: Theme.of(context).dividerColor))
        ),
        child: new Padding(
          padding: const EdgeInsets.all(32.0),
          child: new Text(_explanatoryText, style: Theme.of(context).textTheme.subhead)
        )
      );
    });
  }

  Widget buildTabView(_Page page) {
    return new Builder(
      builder: (BuildContext context) {
        return new Container(
          key: new ValueKey<String>(page.label),
          padding: const EdgeInsets.fromLTRB(48.0, 48.0, 48.0, 96.0),
          child: new Card(
            child: new Center(
              child: new Text(page.label,
                style: new TextStyle(
                  color: page.labelColor,
                  fontSize: 32.0
                ),
                textAlign: TextAlign.center
              )
            )
          )
        );
      }
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      key: _scaffoldKey,
      appBar: new AppBar(
        title: new Text('FAB per tab'),
        bottom: new TabBar(
          controller: _controller,
          tabs: _allPages.map((_Page page) => new Tab(text: page.label.toUpperCase())).toList(),
        )
      ),
      floatingActionButton: !_selectedPage.fabDefined ? null : new FloatingActionButton(
        key: _selectedPage.fabKey,
        tooltip: 'Show explanation',
        backgroundColor: _selectedPage.fabColor,
        child: _selectedPage.fabIcon,
        onPressed: _showExplanatoryText
      ),
      body: new TabBarView(
        controller: _controller,
        children: _allPages.map(buildTabView).toList()
      ),
    );
  }
}