Flutter学习之旅(八)基础控件AppBar

AppBar 作为每个app几乎都会用到的东西,他的属性同样也非常重要,这里就分析一下

AppBar({ Key key, //appbar左侧位置,在首页通常为app的icon或者用户头像,其他页面通常为 返回按钮 , //如果在Scaffold中设置了drawer 抽屉匣,也没有设置leading ,则leading 变为了 抽屉匣的三个横线 ///的图标,并且点击后打开drawer this.leading, ///是否显示leading 如果在appbar中设置了leading ,则这个值不起作用,如果没有设置,当他为true ///的时候时候显示 leading ,false则不显示 this.automaticallyImplyLeading =true, ///头部控件 Widget 自定义样式 this.title, this.actions,///右侧按钮,Widget[] 这样的lsit ////从网上看到是在 title下方的内容 ,但是我设置的时候显示和状态栏平行了,大部分人都说通常使 ///用在SliverAppBar 中使用,我会在介绍CustomScrollView 这个控件中介绍的 this.flexibleSpace, //// 类似爱奇艺顶部的滑动tabbar ,他的Widget 必须实现PreferredSizeWidget 这个widget this.bottom, ////z轴高度,这个没什么好说的,android中经常用到 this.elevation, ///形状和阴影, 当z轴高度大于0的时候才会显示阴影 this.shape, this.backgroundColor, ////状态栏颜色 如果不设置默认使用theme中的颜色, 手动设置可以用 ///Brightness.light Brightness.dark this.brightness, 。通常是用于应用程序栏图标的颜色、不透明度和大小 this.iconTheme, ///右侧action图标的theme this.actionsIconTheme, ///Appbar 上的文字样式 我尝试创建了一个TextTheme 里面一大堆 1 -6的命名 ///介绍也是用large ,verylarge ,very very large , ///简直没法看 ///但是我在里面找到了title这个废弃的变量,看了一下替代它的变量是headline6 , ///改变这个style 可以改变标题的状态 this.textTheme, ////高度是否从状态栏下面开始计算 this.primary =true, /////这个很关键,现在国内app的风格基本都是 title在屏幕最中间,给true就实现了, this.centerTitle, ////貌似看了一下网上的用力,这个表示是否将头部的文本解析成图片, ///如果解析成类似talkback什么的辅助软件是不能阅读的 this.excludeHeaderSemantics =false, ////title 的间距 this.titleSpacing = NavigationToolbar.kMiddleSpacing, ///toolbar 透明度 this.toolbarOpacity =1.0, ///bottom透明度 this.bottomOpacity =1.0, })

从网上找了一个他的结构图,

image

我学习flutter的整个过程都记录在里面了
https://www.jianshu.com/c/36554cb4c804

最后附上demo 地址

https://github.com/tsm19911014/tsm_flutter