How can I navigate using my list?
My list
class myHome extends StatelessWidget {
List<paralies> beaches = [
paralies(title: "Afandou Beach", photos: "rv_afandou_a.jpg", intent: "b_afandou"),
paralies(title: "Agathi Beach", photos: "b_afandou_b.jpg", intent: "b_agathi")
];
paralies.dart
class paralies {
String title; // Name
String photos; // Photos
String intent; // Pages
paralies({ this.title,this.photos,this.intent});
}
My onTap
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => GestureDetector(onTap:(){
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){return beaches[index].intent;})
); //Material
}, //onTap
Full Code:
class myHome extends StatelessWidget {
List<paralies> beaches = [
paralies(title: "Afandou Beach", photos: "rv_afandou_a.jpg", intent: "b_afandou"),
paralies(title: "Agathi Beach", photos: "b_afandou_b.jpg", intent: "b_agathi")
];
@override
Widget build(BuildContext context) {
return SafeArea(
child: Material(
child: CustomScrollView(
slivers: [
SliverPersistentHeader(
delegate: MySliverAppBar(expandedHeight: 200),
pinned: true,
),
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => GestureDetector(onTap:(){
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){return beaches[index].intent;})
); //Material
}, //onTap
child: Card(
child: Padding(
padding: const EdgeInsets.fromLTRB(15.0,0,15.0,0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Image.asset("assets/beaches/${beaches[index].photos}", width: 100.0,height:
100.0,),
SizedBox(width: 70.0),
Text(beaches[index].title,
style: TextStyle(
color: Colors.blue,
fontWeight: FontWeight.w800,
fontSize: 20,
), //TextStyle
), //Text
], //<Widget>[]
), //Row
), //Padding
), //Card
), //GestureDetector
childCount: beaches.length,
), //SliverChildBuilderDelegate
), //SliverList
], //Slivers
), //Custom ScrollView
), //Material
); //Safe Area
} //build
} //MyHome
SliverList( delegate: SliverChildBuilderDelegate( (context, index) => GestureDetector(onTap:(){ Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){return beaches[index].intent;}) ); //Material }, /
From what I understand you are attempting to navigate using the specific index of the list, what you should do is something like this:
Widget _intentToPage(String intent){
if(intent == "b_afandou"){
return B_AFANDOU_PAGE();
}
else if(intent == ...){
...
}
return Text("Page not found");
}
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => GestureDetector(onTap:(){
Navigator.push(context, MaterialPageRoute(builder: (context) => _intentToPage(beaches[index].intent));
},
With B_AFANDOU_PAGE()
being the ctor of the specific page for that intent.
Note: Code is not tested but I believe this approach should give you a basic idea to solve this.
I just used an if
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => GestureDetector(
child: Card(
child: Padding(
padding: const EdgeInsets.fromLTRB(15.0,0,15.0,0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Image.asset("assets/beaches/${beaches[index].photos}", width: 100.0,height:
100.0,),
SizedBox(width: 70.0),
Text(beaches[index].title,
style: TextStyle(
color: Colors.blue,
fontWeight: FontWeight.w800,
fontSize: 20,
), //TextStyle
), //Text
],
)
),
),
onTap:() {if (index==0)
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){return b_afandou();})
);
if (index==1)
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context){return b_agathi();})
);
}
),
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.