1 BottomNavigationBar

BottomNavigationBar即是底部导航栏控件,显示在页面底部的设计控件,用于在试图切换,底部导航栏包含多个标签、图标或者两者搭配的形式,简而言之提供了顶级视图之间的快速导航。

2 构造函数 

BottomNavigationBar({Key key, @required List<BottomNavigationBarItemitems, ValueChanged<intonTap, int currentIndex: 0, double elevation: 8.0, BottomNavigationBarType type, Color fixedColor, Color backgroundColor, double iconSize: 24.0, Color selectedItemColor, Color unselectedItemColor, double selectedFontSize: 14.0, double unselectedFontSize: 12.0, bool showSelectedLabels: true, bool showUnselectedLabels
})

3 常用属性 

3.1 backgroundColor:背景颜色

backgroundColor: Colors.white,

3.2 currentIndex:项目索引

currentIndex:0,

3.3 elevation :底部导航栏的Z坐标

elevation:8.0,

3.4 fixedColor:选中项目颜色的值(只读) 

fixedColor:Colors.green,

3.5 iconSize:所有BottomNavigationBarItem图标的大小

iconSize: 24.0,

3.6 items:定义在底部导航栏中排列的按钮项的外观

items: [BottomNavigationBarItem(icon: Icon(Icons.home),title: Text('首页'),),BottomNavigationBarItem(icon: Icon(Icons.category),title: Text('分类'),),BottomNavigationBarItem(icon: Icon(Icons.settings),title: Text('设置'),),
],

3.7 selectedFontSize:选中时BottomNavigationBarItem标签的字体大小

selectedFontSize: 24.0,

3.8 selectedItemColor:选中时BottomNavigationBarItem.icon和BottomNavigationBarItem.label的颜色

selectedItemColor: Colors.green,

3.9 showSelectedLabels:是否为未选择的BottomNavigationBarItems显示标签

showSelectedLabels: true,

3.10 showUnselectedLabels:是否为选定的BottomNavigationBarItem显示标签

showUnselectedLabels: true,

3.11 unselectedFontSize:未选中BottomNavigationBarItem标签的字体大小

unselectedFontSize: 12.0,

3.12 unselectedItemColor:未选中的BottomNavigationBarItem.icon和BottomNavigationBarItem.labels的颜色

unselectedItemColor: Colors.green,

flutter之BottomNavigationBar相关推荐

  1. Flutter:bottomNavigationBar图标白色的解决办法

       Flutter中,如果底部的Item超过三个,我们就需要为BottomNavigationBar设置一个type属性为:BottomNavigationBarType.fixed,否则图标就会变 ...

  2. 在 Flutter 中使用 NavigationRail 和 BottomNavigationBar

    在 Flutter 中使用 NavigationRail 和 BottomNavigationBar 作者:坚果 公众号:"大前端之旅" 华为云享专家,InfoQ签约作者,阿里云专 ...

  3. Flutter学习日记之底部导航栏BottomNavigationBar组件的使用

    本文地址:https://blog.csdn.net/qq_40785165/article/details/116953235,转载需附上此地址 大家好,我是小黑,一个还没秃头的程序员~~~ 空袋子 ...

  4. 谷歌亲儿子Flutter记录!不可错过的个人小知识点!

    组件 输入框 加背景颜色:decoration: InputDecoration( fillColor: Colors.white, filled: true,修改宽高:修改TextField的高度可 ...

  5. Flutter(一):用BottomNavigationBar实现常规的底部导航

    常规底部导航 现在随便打开一个APP 上面都会在屏幕最下方有一排的按钮,点击不同的按钮可以进入不同的界面.就是说在界面的底部会有一排的按钮导航. 效果图如下: 接下来开始撸代码了: 1. 首先创建fl ...

  6. 【Flutter】底部导航栏页面框架 ( BottomNavigationBar 底部导航栏 | PageView 滑动页面 | 底部导航与滑动页面关联操作 )

    文章目录 一.BottomNavigationBar 底部导航栏 二.PageView 滑动页面 三.BottomNavigationBar 与 PageView 关联 四.完整代码示例 1.核心导航 ...

  7. 【Flutter】底部导航栏实现 ( BottomNavigationBar 底部导航栏 | BottomNavigationBarItem 导航栏条目 | PageView )

    文章目录 一.Scaffold 组件 二.底部导航栏整体架构 三.BottomNavigationBar 底部导航栏 四.BottomNavigationBarItem 导航栏条目 五.PageVie ...

  8. 【Flutter】StatefulWidget 组件 ( 底部导航栏组件 | BottomNavigationBar 组件 | BottomNavigationBarItem 组件 | 选项卡切换 )

    文章目录 一.BottomNavigationBar 组件 二.BottomNavigationBarItem 组件 三.BottomNavigationBar 底部导航栏代码示例 四.BottomN ...

  9. Flutter 底部导航——BottomNavigationBar | 掘金技术征文

    前言 Google推出flutter这样一个新的高性能跨平台(Android,ios)快速开发框架之后,被业界许多开发者所关注.我在接触了flutter之后发现这个确实是一个好东西,好东西当然要和大家 ...

最新文章

  1. 商汤招股书详解:40名教授250+博士3593位工程师,AI收入亚洲第一,一年15亿研发工资支出...
  2. 垂直柱状图(洛谷-P1598 )
  3. 数据库实验一(MySQL基本操作命令总结)
  4. elasticsearch配置优化
  5. aws waf sql注入_适用于快速SQL Server Always On部署的AWS启动向导
  6. vue 父组件给子组件传值
  7. Appium自动化测试(Java版)
  8. Java高级工程师常见面试题(答案)
  9. newifi3 高恪魔改_newifi新路由3一键刷breed刷机教程及高恪固件 | 小闻网
  10. dreamweaver php网站模板,用DreamWeaver模板工具批量制作网页
  11. 天才少年:稚晖君放弃华为百万年薪,投身机器人!有何“玄机”?
  12. 音频编码方案之间音质比较(AAC,MP3,WMA等)
  13. 线程同步与线程同步的必要性
  14. 高等代数----最小多项式的矩阵表示
  15. Html:小技巧:自动提交表单的实现方法
  16. 唐纳德·A·诺曼《设计心理学2 与复杂共处 修订版》(高清带目录)pdf下载
  17. WebRTC 实现P2P音视频通话——原生IOS端使用WebRTC实现一对一音视频通话
  18. Spring boot 配置文件yml的用法
  19. Python笔记_84_我的订单_使用celery完成订单超时_视频播放_使用保利威视频加密
  20. 2016c语言模拟试卷A,2016C语言模拟试卷(程序填空).doc

热门文章

  1. iTunes Connect app 属性
  2. 微服务之Hystrix(一):结合Eureka实现服务降级-服务熔断器处理
  3. 【实体识别】深入浅出讲解命名实体识别(介绍、常用算法)
  4. vi编辑器操作方法——退出、保存、另存
  5. [IT 男人帮 -11-08] 刘强东:自主经营B2C将在5年内超过淘宝
  6. 关于《Python 从入门到实践》Django 创建学习主页 网站响应出现“Template-loader postmortem”的解决方法
  7. 互相关法对时序信号时域对齐(python实现)
  8. 使用robot-upstart开机自启动ROS程序
  9. About.com 2012最受欢迎浏览器评选揭晓
  10. 第62讲:Python编程案例之谁在说谎