Flutter: игнорировать события касания на виджете

Я хочу, чтобы поверх других моих виджетов было размытое изображение, однако при этом я не могу взаимодействовать с виджетами под ним.

Ответы

Ответ 1

Решение

Вы можете решить проблему взаимодействия (не имея возможности взаимодействовать с Widget под размытым изображением), окружив свой BackdropFilter IgnorePointer.

Это означает, что IgnorePointer является решением здесь, потому что он будет игнорировать все сенсорные события для Widget переданного как его дочерний IgnorePointer.

IgnorePointer(child: BackdropFilter(...),)

Вы можете настроить этот атрибут, изменив значение bool ignoring:

IgnorePointer(ignoring: false, ...)

Это включит все сенсорные события снова.

поглощающий

Что-то интересное, но не связанное с проблемой, - это Widget AbsorbPointer, который можно использовать для отражения всех событий касания, которые происходят с его дочерним AbsorbPointer, на себя.

Ответ 2

Вы можете использовать IgnorePointer или AbsorbPointer.

Пример (IgnorePointer)

IgnorePointer(
  child: RaisedButton(
    onPressed: () {},
    child: Text("Unclickable button"),
  ),
);

Пример (AbsorbPointer)

AbsorbPointer(
  child: RaisedButton(
    onPressed: () {},
    child: Text("Unclickable button"),
  ),
);

Какая разница?

Если под вашим основным виджетом есть виджет, который также способен принимать события щелчка, и вы используете IgnorePointer в родительском виджете, дочерний виджет все равно будет получать события щелчка.

Но использование AbsorbPointer на главном виджете не позволит другому виджету (ниже основного виджета) получать события щелчка.

Пример, показывающий разницу.

@override
Widget build(BuildContext context) {
  return SizedBox(
    width: double.infinity,
    child: Stack(
      children: <Widget>[
        Positioned(
          left: 0,
          width: 250,
          child: RaisedButton(
            color: Colors.red,
            onPressed: () => print("Button 1"),
            child: Text("Button 1"),
          ),
        ),
        Positioned(
          right: 0,
          width: 250,
          child: IgnorePointer( // replace this with AbsorbPointer and button 1 won't receive click
            child: RaisedButton(
              onPressed: () => print("Button 2"),
              child: Text("Button 2"),
            ),
          ),
        ),
      ],
    ),
  );
}