flutter之BottomNavigationBar

2023-11-16

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,
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

flutter之BottomNavigationBar 的相关文章

  • 如何使用XPath选择非空段落?

    我想要抓取的网页具有类似的结构 每个都有一个段落是一个问题 一个段落是一个答案 我想抓取每个问题和答案并将它们存储在两个项目中 问题是 在某些页面上 问题和答案分别是 xxx p 1 and xxx p 2 但在其他页面上 xxx p 1
  • 将 HTML 'label' 标签与单选按钮一起使用

    是否label标签与单选按钮一起使用吗 如果是这样 你如何使用它 我有一个显示如下的表单 First Name text field Hair Color color drop down Description text area Salu
  • 重新加载更新的 javascript> 代码而不完全重新加载 html 页面

    我正在开发一个单页 Web 应用程序 它具有许多不同的功能和形式 当开发一个深度 我的意思是主页上没有的 功能时 我会经历这个循环 开发代码 编辑类和函数 刷新整个页面 一路点击 直到到达我需要测试的部分 有时加起来大约一分钟 测试新代码
  • Bootstrap Affix Nav 导致下面的 Div 向上跳转

    我使用 Bootstrap 的 Affix 函数创建了一个 JSFiddle 以便在向下滚动并且标题移出视图时使导航保持在屏幕顶部 我遇到的问题是 当使用纯 HTML 时 导航下方的文本会过早地跳起来并隐藏在导航后面 查看有问题的代码her
  • 使用内联样式有哪些风险?

    A 内容安全政策 https developer mozilla org en US docs Web HTTP CSP with a default src or style src指令将阻止内联样式应用于
  • Bootstrap 5 是否删除了行之间的间距?

    我开始使用 bootstrap 5 并注意到行之间没有空格 我们是否必须明确使用spacing https getbootstrap com docs 5 0 utilities spacing 实用程序喜欢mb 3 or mb 2等等试图
  • LESS CSS 语法对现代化很有用

    通常我使用现代化 http modernizr com 了解浏览器的功能 同时 我用LESS CSS http lesscss org 使我的CSS更具可读性和可维护性 使用 LESS 嵌套规则的常见样式如下所示 header color
  • 如果一个设置多个html标签的id属性值相同,会发生什么?

    我最近看到一个html页面 我认为几个html标签的id是相同的 然后我意识到id是唯一的 但这提出了一个问题 如果页面实际上使用了多个标签 会发生什么 正如我听说每个 html 标签 如果有的话 的 id 属性必须是唯一的 现在我想知道如
  • Gmail 无法在电子邮件上正确呈现字体

    我已经建立了一个 html 电子邮件并使用了 Google 字体 我已使用以下方法将字体包含在 head 标签中 if mso endif 并使用字体 即我这样做了
  • CSS使背景图像使用字体字符

    我想使用字体字符 例如来自 font awesome 作为输入元素的背景图像
  • 如何在没有 JavaScript 的情况下预加载图像?

    在我的 HTML 页面之一上 当我将鼠标悬停在某些链接上时 会显示一些大图像 并且加载这些图像需要一些时间 我不想使用 JavaScript 来预加载图像 有什么好的解决办法吗 HTML5 有一种新方法可以做到这一点 即link prefe
  • 如何将 div 与其父级的顶部对齐,但保持其内联块行为?

    See http jsfiddle net b2BpB 1 http jsfiddle net b2BpB 1 问 如何让box1和box3对齐到父div的顶部boxContainer boxContainerContainer backg
  • 如何覆盖 bootstrap 表 td 样式?

    我正在使用 Bootstrap 3 3我有一个 HTML 代码如下 div table class table table striped tr td 03 td td 04 td td 05 td td 06 td td 07 td td
  • HTML5 支持命名空间吗?

    我们是否可以使用新标签来扩展 HTML5 例如
  • 如何在php中使用一张图像绘制形状

    我需要使用图像的一部分来创建帧图像 例如 用户将从后端上传图像片段 现在我需要根据前端用户的要求在前端创建一个框架 用户将选择框架的高度和宽度 然后他将选择该图像片段 如下所示 我没有办法做到这一点 我尝试通过 css 和 html can
  • Twitter bootstrap 3表单水平和单行多个输入列

    我需要将多列输入放在单行中 如下所示 我通过将多个输入分组为一个来做到这一点form group 但是这样我不能使用has error class div class form group div
  • 没有类的 CSS 选择器

    我正在使用选择器来选择不具有一个类的所有元素 list th not foo some rules 我怎样才能将其应用到多个班级 list th not foo list th not bar some rules 上面的 CSS 当然不会
  • 不使用控件时,视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时
  • 弹出窗口的动态高度取决于内容,可能吗?

    是否有可能获得一个宽度始终为 400px 的弹出窗口 但根据弹出窗口中的内容动态高度 我已经看到了这个 但不知道如何将其应用到弹出窗口 调整 iframe 的宽度高度以适应其中的内容 https stackoverflow com ques
  • 使用 VBA 通过 Access 导航网页/操作 IE

    你好 StackOverflow 社区 我有一个关于使用 Access VBA 操作 IE 的问题 本质上 我正在尝试编写代码 使用 IE 打开特定网页 在该页面中搜索特定链接 目标链接的名称将取决于用户的情况 通过以编程方式单击该链接导航

随机推荐