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

Posted 2023-02-23

【中文标题】如何调用另一个包含的文件或 main.dart 文件包含函数内部的`MyApp()

【英文标题】：How to call another file included or main.dart file include function insider the `the 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()。

【参考方案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呢？