Interact with widget in Stack with translucent widget covering it

user_3032936 0
Viewed 272

I have a Widget which I want to 'fade out' at the bottom, so I've put it into a Stack with a Container on top of it, with the appropriate gradient as the Container's background. However, the container seems to be consuming all touch events, so I can't interact with the Widget behind it, which is not desirable because the Widget is still mostly visible. Is there any way to change this behaviour?

flutter-layout flutter
3 Answers

Here is how to do that:

Code:

IgnorePointer(
  child: YourContainerWidget)

or, depending on your exact objective, you may want to try this:

AbsorbPointer(
  child: YourContainerWidget)

See more info here

user_147280300

Once the widget is fully transparent you can remove it from the UI tree with an if() or ternary, i.e: if(opacity != 0) YourWidget() or opacity == 0 ? SizedBox() : YourWidget()

You can also wrap it with an IgnorePointer() widget.

user_73652150

You can warp your widget with Visibility. This solution will not remove your widget from the tree, so You can easily reuse it later. However, you should consider if it will just not be better to remove it from the widget tree.

    Visibility(
      visible: _isVisible
      child: FooWidget(),
    )
user_169007230
Related