需要初学者帮助 - BottomNavBar

问题描述

我只是在学习,无法理解某些东西。

我正在构建一个简单的应用程序,但该应用程序需要显示的第一件事是某种启动画面。 点击 SplashScreen 上唯一的按钮后,理想情况下它会加载应用程序的其余部分,但我也希望我的应用程序在底部导航栏周围工作。

我自己完成了底部导航栏,它可以工作,所以我可以在我的页面之间循环,但我的 main.dart 指向我的 Splash_Screen。在我使用的 Nav 模型中,主要指向 Nav.dart 文件

如何让我的应用按以下顺序启动:Splash_Screen --> 当点击按钮时 --> 进入底部导航栏将导致其各自 3 个页面的位置。

提前致谢。

编辑:代码

main.dart
import 'package:Flutter/material.dart';
import 'package:offroad/screens/splash_screen.dart';


void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,home: SplashScreen(),);
  }
}

SplashScreen.dart

import 'package:Flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:offroad/screens/home_screen.dart';

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreenState createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  Color mainColor = Color(0xFFF1330A);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: Boxdecoration(
          image: decorationImage(
            image: Assetimage('images/splash.jpg'),fit: BoxFit.cover,),child: Container(
          color: Colors.black54,child: Stack(
            children: <Widget>[
              Container(),Positioned(
                bottom: 90,child: Container(
                  width: MediaQuery.of(context).size.width,child: GestureDetector(
                    onTap: () {
                      Navigator.push(
                        context,MaterialPageRoute(
                          builder: (_) => Home(),);
                    },child: Container(
                      margin: EdgeInsets.symmetric(horizontal: 80),height: 80,decoration: Boxdecoration(
                        borderRadius: BorderRadius.circular(20),color: mainColor,child: Center(
                        child: Text(
                          'Entrar',style: TextStyle(
                            fontSize: 25,color: Colors.white,fontWeight: FontWeight.bold,Positioned(
                bottom: 230,child: Text(
                    'Tu mundo 4x4\n empieza aqui!',style: GoogleFonts.amiri(
                      height: 1.2,textStyle: TextStyle(
                        color: Colors.white,fontSize: 40,textAlign: TextAlign.center,],);
  }
}

一旦我的启动页面加载并点击按钮,我希望它现在进入并加载它,这是我单独工作但main.dart指向“nav.dart”

enter image description here

解决方法

不确定您要实现的确切目标,但您应该使用 MaterialApp 中的路由或 onGenerateRoute 来定义您的路由。
在这种情况下,您可以摆脱 home 并将初始路由设置为 Splash Screen 并将默认路由设置为导航。
然后,您可以使用在您的路由或 onGenerateRoute 中定义的命名路由导航到您的选项卡组件。