flutter中键盘遮挡了webview_flutter中的输入框input解决办法

哈几油2024-04-10 10:40

iOS系统解决办法：（同时解决了闪屏问题，估计是iOS加入了IOKeyboardManager类库同时操作的问题）

参考flutter 中键盘遮挡了webview_flutter中的输入框input 解决办法 - 简书

只需要将resizeToAvoidBottomInset设置为 false

Dart 复制代码

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Builder(builder: (BuildContext context) {
        return WebView(
          initialUrl: 'https://www.baidu.com/',
        );
      }),
    );
  }

Android系统解决办法：

获取键盘状态，滚动webview

Dart 复制代码

// 假设你需要滚动到特定的元素
                    _controller.evaluateJavascript('document.getElementById("inputElementId").scrollIntoView();');

我的处理方法更简单一点，针对特定的网页，直接滚动到一个固定的值，代码写在方法

复制代码

Widget build(BuildContext context) {...}里面

Dart 复制代码

    if(Platform.isAndroid&&widget.url.contains("common/User_feedback.html")&&MediaQuery.of(context).viewInsets.bottom>0) {
      Future.delayed(Duration(milliseconds: 100), () {
        _controller.scrollTo(0, 500);
      });
    }