Flutter- GestureDetector not working with containers in stack

I have two containers in a stack and both containers have GestureDetector.The OnTap for the first container is working fine but it's not working with another container. The first container is the image and the second one is the green background aligned partially over the first container.

new Stack(
            alignment: Alignment(0.0, 1.44),
            children: <Widget>[
              GestureDetector(
                onTap: () => _openImage(context),
                child: Container(
                  width: 340.0,
                  foregroundDecoration: new BoxDecoration(
                      color: Color.fromRGBO(155, 85, 250, 0.55)),
                  height: 240.0,
                  child: FadeInImage.assetNetwork(
                    placeholder: 'assets/dimlight.png',
                    image: post.imageUrl,
                    fit: BoxFit.cover,
                  ),
                ),
              ),
              new GestureDetector(
                child: new Container(
                  color: Colors.green,
                  child: Row(
                    mainAxisSize: MainAxisSize.max,
                    children: <Widget>[
                      SizedBox(width: 7.0),
                      CircleAvatar(
                        backgroundImage: 
                           new AssetImage("assets/boy.png")
                        radius: 30.0,
                      ),
                      SizedBox(
                        width: 7.0,
                      ),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          new SizedBox(
                            height: 20.0,
                          ),
                          Text(
                            post.user.name,
                            style: TextStyle(fontWeight: FontWeight.bold),
                          ),
                          Text(
                            getTimeString(post.timestamp.toString()),
                            style: TextStyle(
                                color: Colors.grey, fontSize: 10.0),
                          ),
                        ],
                      ),
                      SizedBox(
                        width: 20.0,
                      ),
                    ],
                  ),
                ),
                onTap: () => _navigateToDetails(context),
              )
            ],
          )

Layout Screenshot

Try setting the behavior property of GestureDetector to HitTestBehavior.translucent.

Using InkWell instead of GestureDetector solved my problem.

For me it was an issue with items overflowing outside a Stack, with clipBehavior: Clip.none.

In that case the item is visible but not touchable. So I updated my layout to remove the clipBehavior: Clip.none on my Stack and the GestureDetector started working. 🎉

You should try wrap your Container with an AbsorbPointer.

GestureDetector(
   child: AbsorbPointer(
      child: Container(...)
   )
)

In my case I had a CustomPainter inside the stack. Nothing of the above was working, until I gave the CustomerPainter a size. It was showing without explicitly giving a size, but no tap events were triggered:

Container(
      child: CustomPaint(
    size: Size(30, 30),
    painter: RecordingButton(30),
  ))