Navbar flutter 应用程序不显示屏幕上的任何位置

Question

我正在尝试在我的移动应用程序中打印导航栏。 main.dart 的代码：未使用包 navbar.dart 的导入系统 says.the 导航栏完全没有显示。有谁知道如何解决这一问题？天气应用程序本身确实有效。但导航栏不打印。 PLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholderPLaceholder

import 'package:weerappflutter/data_service.dart';
import 'package:flutter/material.dart';
import 'package:weerappflutter/models.dart';
import 'package:weerappflutter/navbar.dart';


void main() {
  runApp(MyApp());

}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final _cityTextController = TextEditingController();
  final _dataService = DataService();

WeatherResponse? _response;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
          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'))
              ],
            ),
          ),
        ));
  }

  void _search() async {
    final response = await _dataService.getWeather(_cityTextController.text);
    setState(() => _response = response);
  }
}

代码navbar.dart

import 'package:flutter/material.dart';

class NavBar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        // Remove padding
        padding: EdgeInsets.zero,
        children: [
          UserAccountsDrawerHeader(
            accountName: Text('WeerBeving'),
            accountEmail: Text('WeerBeving.com'),
            currentAccountPicture: CircleAvatar(
              child: ClipOval(
                child: Image.network(
                  'https://oflutter.com/wp-content/uploads/2021/02/girl-profile.png',
                  fit: BoxFit.cover,
                  width: 90,
                  height: 90,
                ),
              ),
            ),
            decoration: BoxDecoration(
              color: Colors.blue,
              image: DecorationImage(
                  fit: BoxFit.fill,
                  image: NetworkImage(
                      'https://oflutter.com/wp-content/uploads/2021/02/profile-bg3.jpg')),
            ),
          ),
          ListTile(
            leading: Icon(Icons.favorite),
            title: Text('Weer'),
            onTap: () => null,
          ),
          ListTile(
            leading: Icon(Icons.person),
            title: Text('Aardbevingen Nederland'),
            onTap: () => null,
          ),
          ListTile(
            leading: Icon(Icons.share),
            title: Text('Aardbevingen wereldwijd'),
            onTap: () => null,
          ),

          Divider(),
          ListTile(
            title: Text('Exit'),
            leading: Icon(Icons.exit_to_app),
            onTap: () => null,
          ),
        ],
      ),
    );
  }
}

Answer 1

在 body 上面的脚手架里面写

drawer:NavBar(),

您只导入了包，但没有在 main.dart

的任何地方调用它

Answer 2

您已声明 NavBar 小部件，但您忘记将其放置到小部件树中。为此，请使用脚手架的抽屉字段 ... 脚手架（抽屉：导航栏（）， body: ... )

Navbar flutter 应用程序不显示屏幕上的任何位置

Navbar flutter app does not show any where on the screen

mobile

menu

flutter