Home > Back-end >  How to make Gridview list clickable in Flutter
How to make Gridview list clickable in Flutter

Time:09-09

How to make Gridview list clikable when i click. i try to use InkWell inside gridview like this. but, it doesn't work. does anyone have a solution?

Container(
  child: GridView.count(
    mainAxisSpacing: 10,
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
    crossAxisCount: 4,
    children: List.generate(ppobList.length, (index) {
      return InkWell(
        onTap: () {
          print("tab ppob");
        },
        child: PpobItem(
            title: ppobList[index].name,
            icon: ppobList[index].icon),
      );
    }),
  ),
);

this is my PPobItem class, there is problem with my code?. please help, i don't have any idea

class PpobItem extends StatelessWidget {
  const PpobItem({
        Key? key,
        required this.title,
        required this.icon,
      }) : super(key: key);

  final String title;
  final String icon;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: 70,
          width: 70,
          child: Column(
            children: [
              Image.asset(
                'assets/icon/ppob/$icon.png',
                height: 30,
              ),
              Text(title),
            ],
          ),
        ),
      ],
    );
  }
}

CodePudding user response:

Container(
  child: GridView.count(
    mainAxisSpacing: 10,
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
    crossAxisCount: 4,
    children: List.generate(ppobList.length, (index) {
     return GestureDetector(
     onTap: (){
        print('tapped');
     },
     child: PpobItem(
            title: ppobList[index].name,
            icon: ppobList[index].icon,
            color: ppobList[index].color
      ),
     );
    }),
  ),
);

CodePudding user response:

child: new GridView.builder(
          itemCount: 20,
          gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2),
          itemBuilder: (BuildContext context, int index) {
            return new Card(
              child: new InkResponse(
                 child: Image.asset('assets/whats-best-for-your-app-objective-cswift.jpg'),
                onTap: (){
                  print(index);
                },
              ),
            );
          }),

try this.

  • Related