Flutter-AppBar
1.1 简介
AppBar “应用栏”
- 应用栏由工具栏组成,或者是工具栏和其他 widget 组合形成,例如 TabBar和FlexibleSpaceBar;
- 应用栏通常用于 Scaffold.appBar 属性,该属性将应用栏放置在屏幕顶部的固定高度小部件中;
- 对于可滚动的应用栏,请参阅SliverAppBar,它将AppBar嵌入 sliver 中以便在CustomScrollView中使用;
1.2 基本用法
AppBar 主要属性:
- leading:
如果省略了 leading ,但 AppBar 在带有 Drawer 的 Scaffold 中,则会插入一个 button 以打开 Drawer。如果没有Drawer , 默认的是个返回箭头,可以通过设置来关闭automaticallyImplyLeading 为false , - automaticallyImplyLeading = true:
如果有 leading 这个不会管用 ; 如果没有leading ,当有侧边栏的时候, false:不会显示默认的图片,true 会显示 默认图片,并响应打开侧边栏的事件 - title: 标题
- actions,右边的icon, 一般的是icon 或者是文字
- flexibleSpace, 在title上面的一个东西,一般无用
- bottom, 一般就是tabbar , 也可以是别的
- elevation, Z轴高度,也就是阴影 默认是1 默认就是有高度 阴影的
- backgroundColor,导航栏的颜色 默认是 ThemeData 的颜色
- brightness,状态栏的深度 有白色和黑色两种主题
- iconTheme,
- centerTitle, title是否居中
- titleSpacing flexibleSpace 和 title 的距离 默认是重合的
- NavigationToolbar.kMiddleSpacing,
- toolbarOpacity = 1.0 导航栏的透明度
- bottomOpacity = 1.0 bottom的透明度
Flutter-AppBar的更多相关文章
- Flutter AppBar 自定义顶部导航按钮 图标、颜色 以及 TabBar 定义顶部 Tab 切换
Flutter AppBar 自定义顶部按钮图 标.颜色 属性 描述 leading 在标题前面显示的一个控件,在首页通常显示应用 的 logo;在其他界面通常显示为返回按钮 title 标题,通常显 ...
- Flutter——AppBar组件(顶部导航组件)
AppBar组件的常用属性如下: 属性 描述 leading 在标题前面显示的一个控件,在首页通常显示应用的 logo:在其他界面通常显示为返回按钮 title 标题,通常显示为当前界面的标题文字,可 ...
- 19 Flutter 自定义AppBar 定义顶部Tab切换 底部Tab结合顶部Tab实现类似头条页面布局(27分36秒)
Flutter AppBar自定义顶部导航按钮图标.颜色以及TabBar定义顶部Tab切换. leading:在标题前面显示的一个控件,在首页通常显示应用的logo:在其他界面通常显示为付汇按钮. t ...
- AppBar 自定义顶部导航按钮 图标、颜色 以及 TabBar 定义顶部 Tab 切换
一.Flutter AppBar 自定义顶部按钮图标.颜色 leading 在标题前面显示的一个控件,在首页通常显示应用的 logo:在其他界面通常显示为返回按钮 title 标题,通常显示为当 ...
- Flutter 控件之 AppBar 和 SliverAppBar
AppBar 和 SliverAppBar 是纸墨设计中的 App Bar,也就是 Android 中的 Toolbar,关于 Toolbar 的设计指南请参考纸墨设计中 Toolbar 的内容. A ...
- 【Flutter学习】基本组件之AppBar顶部导航栏
一,概述 AppBar 显示在app的顶部.AppBar包含5大部分,如下图: 二,构造函数及参数含义 构造函数 AppBar({ Key key, this.leading, //在标题前面显示的一 ...
- Flutter学习笔记(16)--Scaffold脚手架、AppBar组件、BottomNavigationBar组件
如需转载,请注明出处:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解 今天的内容是Scaffold脚手架.AppBar组件.BottomNavigationBa ...
- Flutter布局--appbar导航栏和状态栏
MaterialApp 先看下上图的具体用法:1. title:标题2. actions:表示右侧的按钮的动作3. leading:表示左侧的按钮的动作4. flexibleSpace:5. back ...
- flutter stack嵌套,appbar透明,Container设置背景图片并且图片在appbar之下
stack嵌套 一般情况下 stack是无法嵌套,出现stack嵌套,布局就会出乱 解决方式:就是第二个stack需要确定宽高 appbar透明 AppBar( backgroundColor: Co ...
- flutter 中的AppBar
在flutter中的很多页面中,都会有下面这段代码: 对应就是下图中的红色线框区域,被称作AppBar顶部导航. 项目准备 在使用AppBar之前,我们先新建一个tabBar的项目: 然后在pages ...
随机推荐
- JLRoutes笔记
1.在info.plist中添加 <key>CFBundleURLTypes</key> <array> <dict> <key>CFBun ...
- MySQL修改密码方法汇总
本文给大家汇总介绍了MySQL修改密码的方法,分为MySQL5.7版本之前以及MySQL5.7版本之后的修改方法,有需要的小伙伴可以参考下 MySQL5.7版本之前修改密码的方法: 方法1: 用SET ...
- PHP实现跨服务器session共享的方法教程
今天带来PHP实现跨服务器session共享的方法教程. 本文实例讲述了PHP实现cookie跨域session共享的方法.分享给大家供大家参考,具体如下: 做过web开发的小伙伴们都了解cookie ...
- 2018 ACM-ICPC 中国大学生程序设计竞赛线上赛 I. Reversion Count (java大数)
Description: There is a positive integer X, X's reversion count is Y. For example, X=123, Y=321; X=1 ...
- POJ 3660 Cow Contest ( 最短路松弛思想应用 && Floyd求传递闭包 )
题意 : 给出 N 头奶牛在比赛的结果,问你最多的能根据给出结果确定其名次的奶牛头数.结果给出的形式为 A B 代表在比赛当中 A 战胜了 B 分析 : 对于一头奶牛来说,如果我们能确定其他 N - ...
- 20180712-Java Character类
char ch = 'a';// Unicode for uppercase Greek omega characterchar uniChar = '\u039A';//字符数组char[] cha ...
- macOS 10.15 Catalina Apache设置:多个PHP版本
第1部分:macOS 10.15 Catalina Web开发环境 在macOS上开发Web应用程序真是令人高兴.有许多设置开发环境的选项,包括广受欢迎的MAMP Pro,它在Apache,PHP和M ...
- form submission
https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms This module provides a series of articles ...
- loj#500 「LibreOJ β Round」ZQC 的拼图
分析 二分倍数 然后考虑dp[i][j]表示选到第i个x轴覆盖到j的情况y轴最多覆盖多少 贡献柿子可以画图然后相似三角形得到 代码 #include<bits/stdc++.h> usin ...
- Oracle_管理控制文件和日志文件
控制文件: 控制文件在数据库创建时被自动创建,并在数据库发生物理变化时更新.控制文件被不断更新,并且在任何时候都要保证控制文件是可用的.只有Oracle进程才能安全地更新控制文件的内容,所以,任何时候 ...