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 地址
网友评论