Flutter天气应用Navbar不显示且navbar.dart导入未使用如何修复

• 你虽然导入了NavBar组件，但没有在Scaffold的drawer参数中挂载该组件，组件从未被渲染，自然会出现「导入包未使用」的提示，导航栏也不会显示
• 当前你的Scaffold没有配置顶部AppBar，就算配置了抽屉组件，普通用户也很难知晓可以从侧边滑动呼出导航栏，没有直观的触发入口

仅需要修改main.dart中Scaffold的配置，新增两个参数即可，原有业务代码无需改动：

1. 给Scaffold添加drawer参数，值为NavBar()，挂载你写的导航栏组件
2. 给Scaffold添加appBar参数，配置顶部导航栏显示汉堡菜单按钮，方便用户点击呼出侧边导航

修改后的完整build方法代码如下：

@override
Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      // 新增顶部导航栏配置，可根据需求调整标题和样式
      appBar: AppBar(
        title: const Text('天气应用'),
        backgroundColor: Colors.blue,
      ),
      // 新增抽屉参数，挂载你编写的NavBar组件
      drawer: const NavBar(),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            if (_response != null)
              Column(
                children: [
                  Image.network(_response!.iconUrl),
                  Text(
                    '${_response!.tempInfo.temperature}°',
                    style: TextStyle(fontSize: 40),
                  ),
                  Text(_response!.weatherInfo.description)
                ],
              ),
            Padding(
              padding: EdgeInsets.symmetric(vertical: 50),
              child: SizedBox(
                width: 150,
                child: TextField(
                    controller: _cityTextController,
                    decoration: InputDecoration(labelText: 'Voer een stad in:'),
                    textAlign: TextAlign.center),
              ),
            ),
            ElevatedButton(onPressed: _search, child: Text('Toon temparatuur'))
          ],
        ),
      ),
    ));
}

修改后重新运行项目，顶部会出现蓝色导航栏，点击左侧汉堡按钮即可呼出你写的侧边导航栏，IDE的未使用导入警告也会自动消失。如果你不需要显示顶部AppBar，也可以只保留drawer参数，后续通过从屏幕左侧边缘向右滑动的手势也能呼出导航栏。

内容的提问来源于stack exchange，提问作者MollyDuty