颤动中ListView.builder中的不同页面导航?

问题描述

onTap: () {
  Navigator.push(
      context,MaterialPageRoute(builder: (context) => Animals()));
},

我正在尝试在 Inkwell Insider 中添加不同的页面路由导航 我尝试了一些不同的方法但它不起作用

我的列表视图名称

List title = [
   'Animals','Birds','Body Parts','Country','Fish','Plants','Vehicle','Works',];

我希望这个导航到 List route = [Animals(),Birds(),BodyParts(),Country(),Fish(),Plant(),Vehicle(),Works(),];

解决方法

你可以这样做:

List pages = [['Animals',Animals()],['Birds',Birds()],['Body Parts',BodyParts()],['Country',Country()],['Fish',Fish()],['Vehicle',Vehicle()],['Plants',Plants()],['Works',Works()]];

现在:

ListView.builder(
      itemCount: pages.length,itemBuilder: (context,index) {
        return GestureDetector(
          child: ListTile(title:Text(pages[index][0])),onTap: () {
           Navigator.push(context,MaterialpageRoute(builder:(context)=>pages[index][1])));
          },);
      },)
,

你可以这样实现

ListView.builder(
          itemCount: title.length,index) {
            return TextButton(
              onPressed: () {
                //YOUR NAVIGATION CODE
              },child: Text('${title[index]}'),);
          },)
,

您有这些列表:

List<String> title = ['Animals','Birds','Body Parts','Country','Fish','Plants','Vehicle','Works'];

List<Widget> route = [Animals(),Birds(),BodyParts(),Country(),Fish(),Plant(),Vehicle(),Works()];

现在,您可以使用 ListView.builder 中的索引简单地映射小部件

ListView.builder(
    itemCount: title.length,index) {
        return ListTile(
            title: title[index],onTap: () => Navigator.push(context,MaterialPageRoute(builder: (context) => route[index]))
        );
    }
)