tab_bar.1.dart 1.95 KB
Newer Older
1 2 3 4 5 6
// Copyright 2014 The Flutter 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';

7 8
/// Flutter code sample for [TabBar].

9
void main() => runApp(const TabBarApp());
10

11 12
class TabBarApp extends StatelessWidget {
  const TabBarApp({super.key});
13 14 15

  @override
  Widget build(BuildContext context) {
16 17 18
    return MaterialApp(
      theme: ThemeData(useMaterial3: true),
      home: const TabBarExample(),
19 20 21 22
    );
  }
}

23 24
class TabBarExample extends StatefulWidget {
  const TabBarExample({super.key});
25 26

  @override
27
  State<TabBarExample> createState() => _TabBarExampleState();
28 29
}

30 31
/// [AnimationController]s can be created with `vsync: this` because of
/// [TickerProviderStateMixin].
32 33
class _TabBarExampleState extends State<TabBarExample> with TickerProviderStateMixin {
  late final TabController _tabController;
34 35 36 37 38 39 40

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
  }

41 42 43 44 45 46
  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

47 48 49 50
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
51
        title: const Text('TabBar Sample'),
52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83
        bottom: TabBar(
          controller: _tabController,
          tabs: const <Widget>[
            Tab(
              icon: Icon(Icons.cloud_outlined),
            ),
            Tab(
              icon: Icon(Icons.beach_access_sharp),
            ),
            Tab(
              icon: Icon(Icons.brightness_5_sharp),
            ),
          ],
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: const <Widget>[
          Center(
            child: Text("It's cloudy here"),
          ),
          Center(
            child: Text("It's rainy here"),
          ),
          Center(
            child: Text("It's sunny here"),
          ),
        ],
      ),
    );
  }
}