Flutter中AppBar组件详解

AppBar组件主要用于定义应用程序顶部区域，可以用来展示应用程序标题、搜索入口、下拉菜单、标签栏等信息。

常用的属性如下：

1. leading 标题前置控件。在首页通常显示应用程序的Logo，其它页面通常显示为返回按钮；

2. title 页面标题。通常显示当前页面的标题文字，可以放组件；

3. actions 标题后置控件。通常使用IconButton来表示，可以放按钮组；

4. bottom 底部控件。通常用tabBar来表示放置Tab标签栏；

5. backgroundColor 导航背景颜色；

6. iconTheme 图标样式；

7. textTheme 文字样式；

8. centerTitle 标题是否居中显示；

代码示例：

import 'package:flutter/material.dart';

class HomePage extends StatelessWidget {
    const HomePage({Key key}) : super(key: key);
    @override
    Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
                title:Text('Flutter App'),
                // 无论什么平台，标题都居中
                centerTitle: true,
                // 背景颜色
                backgroundColor: Colors.red,
                // 前置控件
                leading: IconButton(
                    icon:Icon(Icons.menu),
                    onPressed: (){

                    },
                ),
                // 后置控件
                actions: <Widget>[
                    // 按钮1
                    IconButton(
                        icon:Icon(Icons.search),
                        onPressed: (){

                        },
                    ),
                    // 按钮2
                    IconButton(
                        icon:Icon(Icons.settings),
                        onPressed: (){

                        },
                    )
                ],
            ),
            body:Center(
                child:Text('这是App主体')
            )
        );
    }
}

效果图如下：