使用 webview 时，如果堆栈列表视图中的添加 webview 不滚动，任何手势或鼠标事件都会被忽略，并且 webview 上的小部件将变得非交互式，就像我的示例中一样。
https://zapp.run/edit/flutter-zsm060nsn06?entry=lib/main.dart&file=lib/main.dart
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
void main(List<String> args) {
return runApp(const App());
}
class App extends StatelessWidget {
const App({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Stack(
children: [
webview(),
ListView.builder(
itemCount: 10,
itemBuilder: (context, index) {
return SizedBox(
height: 100,
child: Text('Item $index'),
);
},
),
],
),
),
);
}
Widget webview() {
final controller = WebViewController()..loadHtmlString('''
<!DOCTYPE html>
<html>
<body>
<h1>Hello World</h1>
</body>
</html>
''');
return WebViewWidget(
controller: controller,
);
}
}
即使将 WebView 放置在 Flutter 应用程序中，当点击按钮或列表停止工作时也可能会遇到这样的问题。发生这种情况是因为 WebView 在占据整个屏幕区域的平台相关层中工作，从而阻止触摸事件击中可能位于 WebView 上方或下方的其他小部件。因此，当使用 ListView.builder 等组件时，当它们位于 WebView 的右侧或下方时，应用程序可能会冻结。
为了解决这个问题，通常的方法是控制 WebView 与其他小部件的通信方式。还有一种方法是 WebView 不应占据屏幕的整个大小，这反过来又导致无法访问位于其下方的其他小部件。这可以通过将 WebView 的大小设置为屏幕的一小部分，同时使其他小部件再次可点击来完成。
另一种可能性是将 WebView 封装在忽略指针小部件中，该小部件给出一个指针，指示何时应该接受或拒绝触摸输入。通过这样做，您应该能够为其他组件提供特殊处理，同时允许触摸事件在需要时向下冒泡到其他目标。