passing data from homepage to detail page with firestore flutter - flutter

Question

I want to display a group of books on the main page (this is working fine!), but right now I want to navigate to a dynamic detail page if I click on the book, but I don't know how to do it properly. Can anyone explain how to navigate to a detail page with firestore data ?
models
class Buecher {
String autor;
String buchtitel;
String bild;
int id;
Buecher({
required this.autor,
required this.id,
required this.buchtitel,
required this.bild,
});
}
getting data from firestore
Buecher _bouksListFromSnapshot(DocumentSnapshot snapshot) {
return Buecher(
autor: snapshot.get('author') ?? '',
buchtitel: snapshot.get('buchtitel') ?? '',
bild: snapshot.get('bild') ?? '',
id: snapshot.get('id') ?? '0',
);
}
Stream<Buecher> get bouks {
return brewCollection.doc().snapshots()
.map(_bouksListFromSnapshot);
}
}
main page
class BrewList extends StatefulWidget {
#override
_BrewListState createState() => _BrewListState();
}
class _BrewListState extends State<BrewList> {
#override
Widget build(BuildContext context) {
final buecher = Provider.of<List<Buecher>>(context);
//print(brews.documents);
return SizedBox(
height: 50,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: buecher.length,
itemBuilder: (context, index) {
return BrewTile(
buecher: buecher[index],
);
},
),
);
}
}
class BrewTile extends StatelessWidget {
final Buecher buecher;
BrewTile({required this.buecher});
#override
Widget build(BuildContext context) {
return GestureDetector(
child: Row(children: [
InkWell(
child: ElevatedButton(
style: ElevatedButton.styleFrom(
primary: AppColors.backColor,
elevation: 0.0,
shadowColor: Colors.transparent,
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => DetailForm(buech:buecher),
));
},
child: Container(
margin: EdgeInsets.fromLTRB(10, 0, 0, 5),
height: 320,
width: 170,
child: Column(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(15.0),
child: Image.asset(
"${buecher.bild}",
width: 170.0,
height: 230.0,
fit: BoxFit.cover,
),
),
Expanded(
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
BigText(
height: 1.5,
text: buecher.buchtitel,
size: 17,
color: AppColors.mainColor,
),
SmallText(
text: buecher.autor,
size: 16,
color: AppColors.FontColor,
),
],
)),
),
],
),
),
),
),
]));
}
}
detail page
class DetailForm extends StatelessWidget {
Buecher buech;
DetailForm({
Key? key, required this.buech
}) : super(key: key);
#override
Widget build(BuildContext context) {
return StreamBuilder<Buecher>(
stream: DatabaseService().bouks,
builder: (context, snapshot) {
if (snapshot.hasData) {
Buecher? buecherData = snapshot.data;
return MaterialApp(
home: Scaffold(
backgroundColor: AppColors.backColor,
appBar: AppBar(
backgroundColor: AppColors.backColor,
elevation: 0,
centerTitle: true,
leading: IconButton(
icon: Icon(FeatherIcons.chevronLeft),
color: AppColors.mainColor,
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => Profil()),
);
},
),
leadingWidth: 50,
title: BigText(
text: '${buecherData!.autor}',
),
),
body: SingleChildScrollView(
child: Column(
children: [
SizedBox(
height: 340,
child: Center(
child: Column(
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
children: [
BuchContainer(
bild: "assets/image/GG.jpeg",
height: 260,
width: 200),
BigText(
text: '${buech.autor}',
color: AppColors.FontColor),
],
),
),
),
Container(
height: 70,
width: 360,
decoration: BoxDecoration(
color: AppColors.backColor2,
borderRadius: BorderRadius.circular(25.0)),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
children: [
Icon(Icons.star),
BigText(text: '4.8'),
SmallText(
text: '/5', color: AppColors.FontColor),
SmallText(
text: '|',
color: AppColors.FontColor,
size: 20),
BigText(text: '4.2k'),
SmallText(
text: 'Read', color: AppColors.FontColor),
SmallText(
text: '|',
color: AppColors.FontColor,
size: 20),
BigText(text: '120'),
SmallText(
text: 'pages',
color: AppColors.FontColor),
],
)),
Container(
margin: EdgeInsets.symmetric(horizontal: 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(height: 10),
BigText(text: 'Synopsis'),
SizedBox(height: 20),
Text(
'The story of the mysteriously wealthy Jay Gatsby and his love for the beautiful Daisy Buchanan, of lavish parties on Long Island at a time when The New York Times noted “gin was the national drink and sex the national obsession,” it is an exquisitely crafted tale of America in the 1920s.',
style: TextStyle(
height: 1.5,
fontSize: 16,
),
)
],
)),
],
),
)));
} else {
return Text('error');
}
});
}
}