zoukankan      html  css  js  c++  java
  • CupertinoTabBar

    Cupertino风格的标签栏,通常与CupertinoTabScaffold一起使用,作为CupertinoTabScaffold的tabBar属性值。具体使用方法如下:

      final List<String> _titles = ['首页', '产品', '更多'];
      final List<Text> _pageContents = [Text('This is Home page'), Text('This is Product page'), Text('This is More page')];
      int _selectedIndex = 0;
     
      @override
      Widget build(BuildContext context) {
        return CupertinoTabScaffold(
          tabBar: CupertinoTabBar( //作为整个页面框架的底部标签栏
            currentIndex: _selectedIndex, //当前定位的索引
            onTap: (index) { //点击标签栏的事件监听方法
              setState(() {
                _selectedIndex = index;
              });
            },
            items: <BottomNavigationBarItem> [ //标签栏项集合
              BottomNavigationBarItem(
                icon: Icon(Icons.home),
                title: Text(_titles[0]),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.list),
                title: Text(_titles[1]),
              ),
              BottomNavigationBarItem(
                icon: Icon(Icons.more_horiz),
                title: Text(_titles[2]),
              ),
            ],
          ),
          tabBuilder: (BuildContext context, int index) { //标签栏对应的页面创建
            return CupertinoTabView(
              builder: (BuildContext context) {
                return CupertinoPageScaffold(
                  navigationBar: CupertinoNavigationBar(
                    middle: Text(_titles[index]),
                  ),
                  child: Center(
                    child: _pageContents[index],
                  ),
                );
              },
            );
          },
        );
      }
  • 相关阅读:
    html5全局属性
    net包之Lookup
    net包之dial拨号和listen监听
    net包之IPConn
    利用 RequireJS 进行依赖项管理
    canvas 学习资料
    net包之UDPConn
    LABjs、RequireJS、SeaJS 哪个最好用?为什么?
    WIA
    Mac OS 10.x.x安装在Vmware虚拟机上!
  • 原文地址:https://www.cnblogs.com/timba1322/p/12487141.html
Copyright © 2011-2022 走看看