如何调用另一个包含的文件或 main.dart 文件包含函数内部的`MyApp()答案

【问题标题】：How to call another file included or main.dart file include function insider the `the MyApp()如何调用另一个包含的文件或 main.dart 文件包含函数内部的`MyApp()
【发布时间】：2020-09-23 00:00:35
【问题描述】：

main.dart文件源代码？？？但我想在bottom_navbar.dart 中调用bottomNavigationBar(); 函数

import 'package:flutter/material.dart';
import 'bottom_navbar.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "BookKeep",
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Color(0xFF212121),
          title: Center(
            child: Text("BookKeep"),
          ),
          leading: GestureDetector(
            onTap: (){},
            child: Icon(
              Icons.menu,
            ),
          ),
          actions: <Widget>[
            Padding(
              padding: EdgeInsets.only(right: 20.0),
              child: GestureDetector(
                onTap: (){},
                child: Icon(
                  Icons.search
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

bottom_navbar.dart文件????

import 'package:flutter/material.dart';

class bottomNavigationBar extends StatefulWidget {
  @override
  _bottomNavigationBarState createState() => _bottomNavigationBarState();
}

class _bottomNavigationBarState extends State<bottomNavigationBar> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold (
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            icon: new Icon(Icons.home),
            title: new Text("Home")
          ),
          BottomNavigationBarItem(
            icon: new Icon(Icons.favorite,),
            title: new Text("Favourites")
          ),
        ],
      ),
    );
  }
}

在我尝试过这样的事情之后？？？？

然后它正在执行一些这样的错误？？？？

【问题讨论】：

您是否需要带有主页选项卡的 MyApp 类 UI 和收藏夹选项卡的其他类？对吗？
关于你得到的错误，MaterialApp 小部件的 home 参数只能有单状态小部件。 bottomNavigationBar() 或 Scaffold()。

标签： android flutter dart flutter-layout flutter-web

【解决方案1】：

这是 main.dart：

import 'package:flutter/material.dart';
import 'bottom_navbar.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "BookKeep",
      home: Scaffold(
        bottomNavigationBar: BottomNavBar(),
        appBar: AppBar(
          backgroundColor: Color(0xFF212121),
          title: Center(
            child: Text("BookKeep"),
          ),
          leading: GestureDetector(
            onTap: (){},
            child: Icon(
              Icons.menu,
            ),
          ),
          actions: <Widget>[
            Padding(
              padding: EdgeInsets.only(right: 20.0),
              child: GestureDetector(
                onTap: (){},
                child: Icon(
                  Icons.search
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

这是bottom_navbar.dart：

import 'package:flutter/material.dart';

class BottomNavBar extends StatefulWidget {
  @override
  _BottomNavBarState createState() => _BottomNavBarState();
}

class _BottomNavBarState extends State<BottomNavBar> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold (
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            icon: new Icon(Icons.home),
            title: new Text("Home")
          ),
          BottomNavigationBarItem(
            icon: new Icon(Icons.favorite,),
            title: new Text("Favourites")
          ),
        ],
      ),
    );
  }
}

为避免混淆，我已将您在 bottom_navbar.dart 中的类名从 bottomNavigationBar 更改为 BottomNavBar 在底部_navbar.dart 中的快速提示，要初始化一个类，您必须在第一个字符中使用大写字母初始化您的类名。

所以，不是bottomNavBar，而是BottomNavBar

然后在main.dart文件中添加BottomNavBar函数，添加：bottomNavigationBar: BottomNavBar(),

注意：导航栏看起来很棒，伙计

【讨论】：

那为什么要隐藏AppBar呢？