やりたいこと

InAppWebView(flutter_inappwebview)をほぼ全面に実装した画面で、go_routerのonExitを使ってページを離れてもいいか？のダイアログを出して、「キャンセル」ボタンと「離れる」ボタンを実装したい。

問題

InAppWebViewの上でダイアログが開くと、ダイアログ内のボタンが反応しない。ジェスチャーがInAppWebViewに持ってかれている感じ。

解決方法

PointerInterceptorでAlertDialogをラップして解決。

onExit: (context) async {
  final confirmed = await showDialog<bool>(
    context: context,
    builder: (context) => PointerInterceptor(
      child: AlertDialog(
        title: const Text('確認'),
        content: Text(
          'ページを離れてもよろしいですか？'
        ),
        actions: <Widget>[
          TextButton(
            onPressed: () => Navigator.of(context).pop(false),
            child: const Text('キャンセル'),
          ),
          TextButton(
            onPressed: () => Navigator.of(context).pop(true),
            child: const Text('離れる'),
          ),
        ],
      ),
    ),
  );
  return confirmed ?? false;
},

Flutter：3.16.3
flutter_inappwebview：6.0.0-beta.27
go_router：12.1.3