Flutter如何通过平台视图将触摸事件传递给另一个

时间:2020-01-09 03:58:14

标签: flutter dart

我有一个具有两个平台视图的应用程序,其中一个是Doodle视图,另一个是webview,下面是我的代码

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('test'),
      ),
      body: BlocProvider<CourseDocBloc>(
        create: (context) => CourseDocBloc(),
        child: Container(
          height: double.infinity,
          child: Stack(
            children: <Widget>[
              Listener(
                child: WebView(
                  initialUrl: 'https://google.com',
                  javascriptMode: JavascriptMode.unrestricted,
                  onPageStarted: (url) {
                    print('start load');
                  },
                  onPageFinished: (url) {
                    print('load finished');
                  },
                ),
               onPointerDown: (e) => {print('web down')},
               onPointerUp: (e) => {print('web up')},
              ),
              UiKitView(
                viewType: 'GLView',
                hitTestBehavior: PlatformViewHitTestBehavior.transparent, 
                onPlatformViewCreated: (_) => created(),
              )
            ],
          ),
        ),
      ),
    );
  }

当我设置UiKitView hitTestBehavior: PlatformViewHitTestBehavior.transparent时,底部的Listener将打印web down, web up ...,但是WebView无法接收触摸事件,我无法输入然后单击html中的按钮。 GLView只是用于渲染Doodle的OpenGL视图。


flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.12.13+hotfix.5, on Mac OS X 10.14.6 18G2022, locale zh-Hans-CN)

[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses
[✓] Xcode - develop for iOS and macOS (Xcode 11.2.1)
[✓] Android Studio (version 3.5)
[!] IntelliJ IDEA Ultimate Edition (version 2019.1.2)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
[✓] VS Code (version 1.40.2)
[✓] Connected device (1 available)

! Doctor found issues in 2 categories.

1 个答案:

答案 0 :(得分:0)

检查一下 https://stackoverflow.com/a/55431380

使用IgnorePointer包装窗口小部件时,该窗口小部件的所有触摸事件都会传递到其下方的窗口小部件。

child: Stack(
            children: <Widget>[
              Listener(
                child: WebView(
                  initialUrl: 'https://google.com',
                  javascriptMode: JavascriptMode.unrestricted,
                  onPageStarted: (url) {
                    print('start load');
                  },
                  onPageFinished: (url) {
                    print('load finished');
                  },
                ),
               onPointerDown: (e) => {print('web down')},
               onPointerUp: (e) => {print('web up')},
              ),
              IgnorePointer(
                child: UiKitView(
                 viewType: 'GLView',
                 hitTestBehavior: PlatformViewHitTestBehavior.transparent, 
                 onPlatformViewCreated: (_) => created(),
               ),
             ),
            ],
          ),