底部导航栏未显示

Question

我正在创建 flutter 应用程序，但存在一个问题，我创建了底部导航栏，但它没有显示在屏幕上 我已经全面检查过了。不存在图像（图标）路径问题，也没有任何错误或 yaml 文件问题。一切都好。

如果有人能以经验告诉我这个问题，请指导我。 两天前还显示过，但现在不显示了。我尝试了很多方法，但还是不行。

我已将源代码上传到Github。 github.com/cogniqube/full_app

import 'package:flutter/material.dart';
// import 'package:flutter_svg/flutter_svg.dart';
import 'package:full_app/pages/Profile%20Page.dart';
import 'package:full_app/pages/home.dart';

class MainPage extends StatefulWidget {
  const MainPage({super.key});

  @override
  State<MainPage> createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  int currentIndex = 0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: pages[currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(icon: Image.asset('assets/svg/home.png', height: 24, width: 24,), label:'Home'),
          BottomNavigationBarItem(icon: Image.asset('assets/svg/heart.png', height: 24, width: 24,), label:'fav'),
          BottomNavigationBarItem(icon: Image.asset('assets/svg/add.png', height: 24, width: 24,), label:'add'),
          BottomNavigationBarItem(icon: Image.asset('assets/svg/speech-bubble.png', height: 24, width: 24,), label:'message'),
          BottomNavigationBarItem(icon: Image.asset('assets/svg/person.png', height: 24, width: 24,), label:'profile'),

        ],
        currentIndex: currentIndex,
        onTap: (index) {
          setState(() {
            currentIndex = index;
          });
        },
        type: BottomNavigationBarType.fixed,
        showSelectedLabels: false,
        showUnselectedLabels: true,
      ),
    );
  }

  final pages = [
    HomePage(),
    Center(child: Text('Favorite'),),
    Center(child: Text('Add Post'),),
    Center(child: Text('Message'),),
    ProfilePage(),
  ];
}

Answer 1

您的“登录”按钮正在路由到构建主页小部件的“/home”，该小部件没有有底部导航栏。如果您改为路由到“/main”来构建具有 BottomNavigationBar 的 MainPage 小部件，您将看到它呈现出来。

在 LoginPage 小部件的第 86 行，对 ElevatedButton 小部件进行以下更改：

ElevatedButton(
                  onPressed: () {
                    // ! You are already pushing the named route below so you can delete this first navigation
                    // Navigator.of(context).push(
                    //   MaterialPageRoute(
                    //     builder: (context) {
                    //       return HomePage();
                    //     },
                    //   ),
                    // );

                    // ! This named route has been changed to /main to return the MainPage widget which has the BottomNavigationBar
                    Navigator.of(context).pushNamed('/main');
                  }