CODEWITHSUNDEEP
flutterdartwebviewgesture
kmignt
kmignt

Reputation: 97

Flutter InAppWebView - webview does not accept gestures

I have a questionnaire build with office forms and I want to present the form inside flutter app. So far so good, but when the user tries to tap on an input field from the form the page refreshes itself. The only gestures that can be performed are scrolling and marking a radio button.

I spend a lot of time trying to figure out how to enable the other gestures but it seems that is no way. I found a parameter gestureRecognizer from the docs but I cannot figure out how to pass the gestures and what kind of gestures are required. Any help will be appreciated. Thanks!

Here is some example code with google.com


class QuestionnaireScreen extends StatelessWidget {
  final GlobalKey<ScaffoldState> _quizScaffoldKey = GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    InAppWebViewController _webViewController;
    return Scaffold(
      key: _quizScaffoldKey,
      appBar: AppBar(
        title: Text('Questionnaire'),
      ),
      body: Container(
        child: InAppWebView(
          initialUrl: 'https://google.com',
          initialOptions: InAppWebViewGroupOptions(
              crossPlatform: InAppWebViewOptions(
                useShouldOverrideUrlLoading: false,
                mediaPlaybackRequiresUserGesture: false,
              ),
              android: AndroidInAppWebViewOptions(
                useShouldInterceptRequest: true,
              ),
              ios: IOSInAppWebViewOptions(
                allowsInlineMediaPlayback: true,
              )),
          // gestureRecognizers: <Factory<OneSequenceGestureRecognizer>>{}..add(Factory<OneSequenceGestureRecognizer>() => TapGestureRecognizer()), - this gives an error: The argument type 'TapGestureRecognizer Function<OneSequenceGestureRecognizer>()' can't be assigned to the parameter type 'Factory<OneSequenceGestureRecognizer>'
          onWebViewCreated: (InAppWebViewController vc) {
            _webViewController = vc;
          },
        ),
      ),
    );
  }
}

UPDATE: I managed to make it work but with webview_flutter plugin with WebController

Here is the code:

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class QuestionnaireScreen extends StatefulWidget {
  @override
  _QuestionnaireScreenState createState() => _QuestionnaireScreenState();
}

class _QuestionnaireScreenState extends State<QuestionnaireScreen> {
  final GlobalKey<ScaffoldState> _quizScaffoldKey = GlobalKey<ScaffoldState>();

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    WebViewController _webViewController;
    return Scaffold(
      key: _quizScaffoldKey,
      appBar: AppBar(
        title: Text('Questionnaire'),
      ),
      body: Container(
        child: WebView(
          initialUrl: '/url here/',
          javascriptMode: JavascriptMode.unrestricted,
          onWebViewCreated: (WebViewController vc) {
            _webViewController = vc;
          },
        ),
      ),
    );
  }
}

Upvotes: 1

Views: 4364

Answers (1)

Charles Major
Charles Major

Reputation: 31

I was able to use the approach here

to do the following:

InAppWebView(
                gestureRecognizers: [
                  new Factory<OneSequenceGestureRecognizer>(
                    () => new EagerGestureRecognizer(),
                  ),
                ].toSet(),

Upvotes: 3

Related Questions