0

我的flutter应用程序中有一个gridmodel列表视图,我为gridview中存在的每个项目创建了dart文件,但我不知道如何在gridmodel列表视图上提供onpress功能,以便它将导航到下一页

 class GridItem extends StatelessWidget {
GridModel gridModel;

  GridItem(this.gridModel);

   @override
    Widget build(BuildContext context) {
    return Padding(
  padding: const EdgeInsets.all(1 / 2),
  child: Container(
   color: Colors.white,
      child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.center,
    children: <Widget>[
      Image.asset(
        gridModel.imagePath,
        width: 30,
        height: 30,
        color: gridModel.color,),
      Padding(
        padding: const EdgeInsets.only(top: 5),
        child: Text(gridModel.title, textAlign: TextAlign.center,
          style: TextStyle(fontSize: 12),)
        ,),

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

当我单击列表中的“移动”项目时,它应该将我重定向到我创建的“移动页面”,“航班”和“电影”也是如此

4

2 回答 2

0

你不能直接这样做。为此,您必须使用inkwell 或GestureDetector,否则您可以选择IconButtons。用 inkwell 或 GestureDetector 包装你的代码,如下所示:

InkWell(
onTap: (){ print("Card Clicked"); }
child: Padding(
 padding: const EdgeInsets.all(1 / 2),
 child: Container(
  color: Colors.white,
   child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    crossAxisAlignment: CrossAxisAlignment.center,
    children: <Widget>[
     Image.asset(
     gridModel.imagePath,
     width: 30,
     height: 30,
     color: gridModel.color,),
    Padding(
     padding: const EdgeInsets.only(top: 5),
     child: Text(gridModel.title, textAlign: TextAlign.center,
       style: TextStyle(fontSize: 12),)
    ,),

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

希望能帮助到你!快乐编码:)

于 2020-07-26T06:44:58.320 回答
0

我认为您可以像下面的代码一样重定向:-

  Widget _buildProductItem(BuildContext context, int index) {
    return InkWell(
      child: Card(
          child: Text(list[index].name,
              style: TextStyle(color: Colors.deepPurple))),
      onTap: () {
        GridModel gridModel = list[index];
        //"name" replace to your gridModel Variable.
        if(gridModel.name.toString().toLowerCase() == 'mobile'){
          //here you can redirect mobile page
        } else if(gridModel.name.toString().toLowerCase() == 'flights'){
          //here you can redirect flights page
        } else if(gridModel.name.toString().toLowerCase() == 'movie'){
          //here you can redirect movie page
        }
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return ListView.builder(
      itemBuilder: _buildProductItem,
      itemCount: list.length,
    );
  }
于 2019-08-15T11:14:59.973 回答