zoukankan      html  css  js  c++  java
  • BottomNavigationBar

    该Widget通常在Material design风格的页面框架Widget Scaffold中使用,作为Scaffold的一个bottomNavigationBar属性值。具体使用方法如下:

    int selectedIndex = 1;
      final widgetOptions = [
        Text('This is Home Page'),
        Text('This is Product Page'),
        Text('This is More Page'),
      ];
     
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar( //应用栏
            title: Text(widget.title),
          ),
          body: widgetOptions[selectedIndex], //页面内容
          bottomNavigationBar: BottomNavigationBar( //底部导航栏
            items: <BottomNavigationBarItem>[ //导航栏选项集合
              BottomNavigationBarItem( //底部单个导航栏选项
                icon: Icon(Icons.home), //图标
                title: Text('首页'), //标题
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.list),
                title: Text('产品'),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.more_horiz),
                title: Text('更多'),
              ),
            ],
            currentIndex: selectedIndex, //当前导航栏选中的索引
            fixedColor: Colors.redAccent, //选中项的标题颜色
            onTap: (index) { //导航栏项点击后的处理方法
              setState(() {
                selectedIndex = index;
              });
            },
          ),
        );
      }
  • 相关阅读:
    lighting
    移动端
    SVN常见问题
    前四章知识点小结
    如何不运用第三方变量实现两个数的交换
    awk
    sort
    cut
    sed
    30道Linux面试题
  • 原文地址:https://www.cnblogs.com/timba1322/p/12487051.html
Copyright © 2011-2022 走看看