Get "details" on DoubleTap on Flutter GestureDetector

I’m developing and app where on double tap I need to perform some actions, but they require the position where that double tap was executed. That information is normally carried by the details in events like “onTapDown/Up”.

Now, I know you can call both “onTapDown” and “doubleTap” on a GestureDetector, but if you have a child that takes the “onTap” gesture the “onTapDown” won’t fire when a double tap occurs. In my case I have a WebView under the GestureDetector, so only “onDoubleTap” fires.

I’ve already commented in this request (https://github.com/flutter/flutter/issues/20000) to the Flutter team to add “details” to “onDoubleTap”, but it looks like it is going to take a while.

In that same thread they suggest a couple of solutions that I have already tried. 1st using this code:

var lastTapDown = 0;

onTapDown: (details) {
  var now = DateTime.now().millisecondsSinceEpoch;
  if (now - lastTapDown < 200) {
    print("Double Tap!")
  }
  lastTapDown = now;
},

This first solutions works, but I can’t use it as I need the “onTap” to be claimed by the WebView.

And the other using this plugin: https://github.com/tomwyr/positioned-tap-detector, which I did and it is great but it bumps into the same problem as me, “onTapDown” won’t fire if you have a child that wins “onTap” on the arena.

So if anyone can help me get that positions it would be much appreciated. :slight_smile:

Thanks.

Ok so currently, as of Flutter 1.20.2, there is no great solution. Not that I know of at least. Hopefully they release something soon, as I think it is crazy that we can’t get the details of a “doubleTap”, there are ways to get any other event but that one.

So what I came up with was using a “rawGestureDetector” to get the “onTapDown/up” events, but with a custom class so that it lets through the event for the “webView” to capture and a Gesture Detector as a child of the “rawGestureDetector” to get the “doubleTap” event.

Here is the code. Any question I’ll be happy to answer:

import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';

class CustomWebView extends StatelessWidget {
  final String url;
  final Function(InAppWebViewController) oncontrollerReady;

  const CustomWebView({
    Key key,
    this.oncontrollerReady,
    this.url,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {

    return RawGestureDetector(
      gestures: {
        CustomTapGestureRecognizer: GestureRecognizerFactoryWithHandlers<
            CustomTapGestureRecognizer>(
          () => CustomTapGestureRecognizer(),
          (CustomTapGestureRecognizer instance) {
            instance.onTapUp =
                (details) => print('TAP UP: ${details.globalPosition} ');
            instance.onTapDown =
                (details) => print('TAP DOWN: ${details.globalPosition} ');
          },
        )
      },
      behavior: HitTestBehavior.opaque,
      child: GestureDetector(
        onDoubleTap: () => print("Double Tap!"),
        child: InAppWebView(
          initialUrl: url,
          initialHeaders: {},
          initialOptions: InAppWebViewGroupOptions(
              crossPlatform: InAppWebViewOptions(
            debuggingEnabled: true,
          ),
         ),
        ),
      ),
    );
  }
}


class CustomTapGestureRecognizer extends TapGestureRecognizer {
  @override
  void rejectGesture(int pointer) {
    acceptGesture(pointer);
  }
 
 //? override as we don't need it and producess and error.
@override
 void handleTapDown({PointerDownEvent down}) {}
}

I posted the same question on StackOverflow at the same time (here: https://stackoverflow.com/questions/63228704/get-details-on-doubletap-on-flutter-gesturedetector), but I can’t answer yet because of my score.

So if someone would be so kind of copying and pasting the answer there I would appreciated so more people can find a temporal solution.

Thanks In advance!!

Unfortunately, there is not answer there yet.

Just for everyone looking in this thread, there is a new event waiting approval to get the details on DoubleTapDown/Up.

Done by an amazing guy that saw my request in another thread and did the job. Go an share some love to him if you can :slight_smile: => tvolkert

You can check the progress here, but it looks like it will be added soon :smiley:

3 Likes

:blue_heart: :blue_heart: :blue_heart: Lotta Love shared :smiley:

1 Like

This is great stuff!