Flutter - AppBar 相关介绍

AppBar属性介绍

AppBar({
    Key key,
    this.leading,//导航条左侧需要展示的Widget
    this.automaticallyImplyLeading = true,
    this.title,//导航条的标题
    this.actions,//导航条右侧要展示的一组widgets
    this.flexibleSpace,
    this.bottom,导航条底部需要展示的widget
    this.elevation,
    this.shape,//导航条样式
    this.backgroundColor,//导航条背景色
    this.brightness,//设置导航条上面的状态栏的dark、light状态
    this.iconTheme,//导航条上的图标主题
    this.actionsIconTheme,//导航条上右侧widgets主题
    this.textTheme,//导航条上文字主题
    this.primary = true,//为false的时候会影响leading，actions、titile组件，导致向上偏移
    this.centerTitle,//导航条表示是否居中展示
    this.titleSpacing = NavigationToolbar.kMiddleSpacing,
    this.toolbarOpacity = 1.0,
    this.bottomOpacity = 1.0,
  })

自定义 AppBar 的代码

@override
Widget build(BuildContext context) 
return PreferredSize(
  preferredSize: Size.fromHeight(45),
  child: AppBar(
    centerTitle: true,
    title: Column(
      children: <Widget>[
        Text(pageName,
          style: TextStyle(
              fontSize: pageNameFontSize
          ),
        ),
        SizedBox(
          height: 8,
        )
      ],
    ),
    actions: <Widget>[
      Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: <Widget>[
          SizedBox(
            height: 6,
          ),
          Row(
            children: <Widget>[
              AppBarClock(
                style: TextStyle(
                    fontSize: 20
                ),
              ),
              SizedBox(
                width: 5,
              )
            ],
          ),
          Row(
            children: <Widget>[
              Text(this.trailText,
                textAlign: TextAlign.right,
              ),
              SizedBox(
                width: 5,
              )
            ],
          ),
        ],
      )
    ],
  ),
);

两个坑
appbar高度计算问题
primary 默认true套了一层SafeArea，顶部会有个标题栏高度，false就会整体向上偏移，计算高度是还有默认高度