如果我使用带home属性的material应用程序，如何使用navigator在flutter中的屏幕之间导航

Question

我想在flutter中的两个不同的dart文件之间导航和传输数据，但当我在另一个stackerflow问题中读到时，我无法做到这一点，因为我在主页文件中使用了home属性，但我知道如何更改程序而不使用home，或者如何在没有路由的情况下实现它。第一文件镖

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'fillpage.dart';
void main() {
runApp(Glavpage());
}
class Glavpage extends StatefulWidget {
const Glavpage({Key? key}) : super(key: key);
@override
_GlavpageState createState() => _GlavpageState();
}
class _GlavpageState extends State<Glavpage> {
var dList = [];
@override
void initState() {
for (int i = 0; i < 5; i++) {
dList.add("kek");
}
super.initState();
}
@override
Widget build(BuildContext context) {
return  MaterialApp(
initialRoute: '/',
routes: <String,WidgetBuilder>{
'/': (BuildContext context) => new Glavpage(),
'/fillpage': (BuildContext context) => new zmist(),
},
title: 'NoteApplication',
home: Scaffold(
appBar: PreferredSize(
child: AppBar(
automaticallyImplyLeading: false,
),
preferredSize: Size.fromHeight(0.0)),
body: Container(
color: Color.fromRGBO(23, 34, 59, 1),
child: Column(
children: <Widget>[
// SizedBox(height: 50),
Container(
color: Color.fromRGBO(23, 34, 59, 1),
child: Row(
children: <Widget>[
Container(
child: Text(
"Notes",
style: TextStyle(
color: Color.fromRGBO(107, 119, 141, 1),
fontSize: 72,
),
),
),
Container(
margin: EdgeInsets.only(top: 50),
child: Text(
"Never Settle",
style: TextStyle(
fontSize: 12,
color: Color.fromRGBO(107, 119, 141, 0.25),
),
),
),
SizedBox(width: 20),
Container(
child: Icon(Icons.search, size: 40,
color: Color.fromRGBO(107, 119, 141, 1)),
),
SizedBox(width: 30),
Container(
child: Icon(Icons.menu, size: 40,
color:Color.fromRGBO(107, 119, 141, 1)),
),
],
),
),
Divider(
height:1,
color: Color.fromRGBO(107, 119, 141, 1),
),
Expanded(
child: Container(
margin:EdgeInsets.only(top:5,),
color: Color.fromRGBO(23, 34, 59, 1),
child: ListView.separated(
separatorBuilder: (BuildContext context, int index) =>
const Divider(),
itemCount: dList.length,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 0, 8),
child: Container(
height: 60,
decoration: BoxDecoration(
border: Border.all(
color: Color.fromRGBO(107, 119, 141, 1)
.withOpacity(0.2)),
borderRadius:
BorderRadius.all(Radius.circular(20))),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
dList[index],
style: TextStyle(
fontSize: 25,
color: Color.fromRGBO(107, 119, 141, 1),
),
),
),
),
);
},
),
),
),
],
),
),
floatingActionButton:
FloatingActionButton(onPressed: () {
Navigator.pushNamed(context, '/fillpage');
},
backgroundColor: Color.fromRGBO(23, 34, 59, 1),
shape: RoundedRectangleBorder(side: BorderSide(
color: Color.fromRGBO(255, 103, 104, 1),
width: 2,
style: BorderStyle.solid
), borderRadius: BorderRadius.circular(50)),
child: Icon(
Icons.add, color: Color.fromRGBO(255, 103, 104, 1),)),
));
}
}

第二锉镖

import 'package:flutter/material.dart';
void main() {
runApp(zmist());
}
class zmist extends StatefulWidget {
const zmist({Key? key}) : super(key: key);
@override
_zmistState createState() => _zmistState();
}
class _zmistState extends State<zmist> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: new Scaffold(
appBar: PreferredSize(
child: AppBar(
automaticallyImplyLeading: false,
),
preferredSize: Size.fromHeight(0.0)),
backgroundColor: Color.fromRGBO(23, 34, 59, 1),
body: Container(
child: Column(
children: <Widget>[
Container(
child: Row(
children: <Widget>[
Container(
child: Icon(Icons.arrow_back_ios_sharp,
size: 40, color: Color.fromRGBO(107, 119, 141, 1)),
),
SizedBox(width: 230),
Container(
child:Icon(Icons.check,
size: 40, color: Color.fromRGBO(107, 119, 141, 1)),
),
Container(
child:Icon(Icons.share,
size: 40, color: Color.fromRGBO(107, 119, 141, 1)),
),
Container(
child:Icon(Icons.menu,
size: 40, color: Color.fromRGBO(107, 119, 141, 1)),
),

],
),
),
],
),
),
),
);
}
}

Answer 1

如果您想从Glavepage导航到Zmist，请在Glavepage中添加一个按钮并编写以下代码-

FloatingActionButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => zmist()),
})

并从第二个文件中删除以下行-

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