import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Title of Application',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
              automaticallyImplyLeading: true, //AppBar的前导区域为空。
              bottom: const TabBar(
                tabs: [
                  Tab(icon: Icon(Icons.directions_car)),
                  Tab(icon: Icon(Icons.directions_transit)),
                  Tab(icon: Icon(Icons.directions_bike)),
                ],
              ),
              actions: <Widget>[
                IconButton(
                  icon: const Icon(Icons.file_upload),
                  // ignore: avoid_print
                  onPressed: () => {print("Click on upload button")},
                ),
                IconButton(
                    icon: const Icon(Icons.settings),
                    // ignore: avoid_print
                    onPressed: () => {print("Click on settings button")}),
                PopupMenuButton(
                  icon: const Icon(Icons.share),
                  itemBuilder: (context) => [
                    const PopupMenuItem(
                      value: 1,
                      child: Text("Facebook"),
                    ),
                    const PopupMenuItem(
                      value: 2,
                      child: Text("Instagram"),
                    ),
                  ],
                )
              ],
              title: const Align(
                  child: Text("AppBar Centered Title"),
                  alignment: Alignment.center),
              leading: IconButton(
                icon: const Icon(Icons.notifications_active),
                onPressed: () {
                  showAlert(context);
                },
              )),
          body: const TabBarView(
            children: [
              Center(child: Text("Car")),
              Center(child: Text("Transit")),
              Center(child: Text("Bike"))
            ],
          ),
          drawer: Drawer(
            child: ListView(
              children: const <Widget>[
                DrawerHeader(
                  decoration: BoxDecoration(
                    color: Colors.green,
                  ),
                  child: Text(
                    'My Drawer',
                    style: TextStyle(
                      color: Colors.green,
                      fontSize: 24,
                    ),
                  ),
                ),
                ListTile(
                  title: Text('Gallery'),
                ),
                ListTile(
                  title: Text('Slideshow'),
                ),
              ],
            ),
          ),
        ));
  }

  void showAlert(BuildContext context) {
    print('context:${context}');
    showDialog(
        context: context,
        builder: (context) => const AlertDialog(
              content: Text("Hi"),
            ));
  }
}
//更多请阅读：https://www.yiibai.com/flutter/flutter-appbar.html