在显示图像的 gridview 上添加手势检测器的位置

Question

我已经在 gridView() 中成功显示图像但现在，我想要每张图片 clickable/tappable，我曾尝试将手势检测器放入儿童体内，但它似乎不起作用，请帮助。

        import 'package:flutter/foundation.dart';
        import 'package:flutter/material.dart';
        import 'package:flutter/material.dart';
        import 'package:cached_network_image/cached_network_image.dart';

        class SearchTiles extends StatefulWidget {
          final String Image1 ="https://www.image1.png";
          final String Image2 ="https://www.image2.png";
          final String Image3 = "https://www.image3.png";
          final String Image3 = "https://www.image4.png";


          @override
          _SearchTilesState createState() => _SearchTilesState();
        }

        class _SearchTilesState extends State<SearchTiles> {
          @override
          Widget build(BuildContext context) {
            final title = 'Pick a Store';

            return MaterialApp(
              title: title,
              home: Scaffold(
                appBar: AppBar(
                  title: Text(title),
                ),
                body: GridView.count(
                    crossAxisCount: 2,
                    children: <String>[
                      widget.image1,
                      widget.image2,
                      widget.image3,
                      widget.image4
                    ].map((String url) {
                      return GridTile(
                        child: Image.network(
                          url,
                        ),
                      );
                    }).toList()),
              ),
            );
          }
        }

Answer 1

Try this, It's work for me :-)

return GridTile(
  child: InkWell(
    onTap: () {
      //here get image tap callback
    },
    child: Image.network(
      url,
    ),
  ),
);

Answer 2

用 GestureDetector 包裹 GridTile，这样每个 GridTile 都可以点击

在显示图像的 gridview 上添加手势检测器的位置

where to add gesture detector on gridview displaying images

flutter

dart

gridview

gesture