Using RaisedButton widget inside Positioned widget issue

Viewed 1365

I got an issue with RaisedButton when using it inside a Positioned widget.

The problem is when I used RaisedButton inside Positioned widget, onPressed event didn't trigger when clicking on RaisedButton child, but when I clicked on another space of RaisedButton It worked.

Note that It works fine in normal situations and It happened when using RaisedButton inside Positioned widget.

here is my widget :

Positioned(
    child: Center(
        child: SizedBox(
            width: 80,
            height: 65,
            child: RaisedButton(
                padding: EdgeInsets.all(0),
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
                color: Colors.green,
                child: Icon(Icons.message, size: 50, color: Colors.white,), 
                // When I clicked on this icon, onPressed didn't triggered. but when I click on another space of button it triggered.
                onPressed: () {
                    print('Hello world from onPressed');
                },
            ),
        ),
    ),
    top: -30,
    left: 0,
    right: 0,
)

what's your idea to fix this problem ?

2 Answers

The short answer is:

Flutter doesn't trigger push events for items that overlap the bounds of the stack (this is what you do when you set top to -30).

The reason behind this could be found here: Document that widgets in the overflow of stack do not respond to gestures

A possible solution for you is to move all the other items for 30.0 lower, so you can place the button inside the stack.

A solution to this problem is by wrapping the stack in a gesture detector and add what do you want to add in onpressed of the raised button in the ontap property of the gesture detector

Related