flutter - 如何仅添加一个 BottomNavigationBarItem

Question

我有一个BottomNavigationBar，我只需要在里面添加一个集中按钮，但是我收到了这个错误:

'package:flutter/src/material/bottom_navigation_bar.dart': Failed assertion: line 191 pos 15: 'items.length >= 2': is not true.

这是合乎逻辑的，因为 flutter 的源代码具有以下条件:

//..
assert(items.length >= 2),

所以，这是我的代码，是否有使用 BottomNavigationBar 来保持代码干净的解决方法？

BottomNavigationBar(

   items: <BottomNavigationBarItem>[
      buildBottomNavigationBarItem(
         iconData: Icons.close,
      ),

// AN ERROR AFTER COMMENTING THIS:

//    buildBottomNavigationBarItem(
//       iconData: Icons.open,
//    ),
   ],
),


BottomNavigationBarItem buildBottomNavigationBarItem(
      {IconData iconData, String title = ''}
    ) {
    return BottomNavigationBarItem(
      icon: Icon(
        iconData,
        color: Theme.of(context).accentColor,
        size: 0.04 * _deviceHeight,
      ),
      title: Text(
        title,
      ),
    );
}

谢谢

Answer 1

您不能使用 BottomNavigationBar但是，您可以创建自己的小部件并将其传递给 bottomNavigationBar 来代替它。范围。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: Scaffold(
        body: SafeArea(
          child: Text('Hi'),
        ),
        bottomNavigationBar: Container(
          height: 60,
          color: Colors.black12,
          child: InkWell(
            onTap: () => print('tap on close'),
            child: Padding(
              padding: EdgeInsets.only(top: 8.0),
              child: Column(
                children: <Widget>[
                  Icon(
                    Icons.close,
                    color: Theme.of(context).accentColor,
                  ),
                  Text('close'),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

如果新的自定义底部导航栏与手机的操作系统 GUI 重叠，您可以将 InkWell 包裹起来。与 SafeArea小部件。