dart - How to disable multi-touch in mobile application using flutter

Question

This question is purely based on GestureDetector flutter.

For Example: In Application, GestureDetector class is implemented so here by-default it support multi-touch, now need to disable this multi-touch so what could be the best way of a solution.

GestureDetector reference link: https://docs.flutter.io/flutter/widgets/GestureDetector-class.html

Answer 1

Create instance of OnlyOnePointerRecognizerWidget widget and pass any Widget as child to it. OnlyOnePointerRecognizerWidget will recognize only one pointer.

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

class OnlyOnePointerRecognizer extends OneSequenceGestureRecognizer {
  int _p = 0;
  @override
  void addPointer(PointerDownEvent event) {
    startTrackingPointer(event.pointer);
    if (_p == 0) {
      resolve(GestureDisposition.rejected);
      _p = event.pointer;
    } else {
      resolve(GestureDisposition.accepted);
    }
  }

  @override
  String get debugDescription => 'only one pointer recognizer';

  @override
  void didStopTrackingLastPointer(int pointer) {}

  @override
  void handleEvent(PointerEvent event) {
    if (!event.down && event.pointer == _p) {
      _p = 0;
    }
  }
}

class OnlyOnePointerRecognizerWidget extends StatelessWidget {
  final Widget child;
  OnlyOnePointerRecognizerWidget({this.child});
  @override
  Widget build(BuildContext context) {
    return RawGestureDetector(
      gestures: <Type, GestureRecognizerFactory>{
        OnlyOnePointerRecognizer: GestureRecognizerFactoryWithHandlers<OnlyOnePointerRecognizer>(
          () => OnlyOnePointerRecognizer(),
          (OnlyOnePointerRecognizer instance) {},
        ),
      },
      child: child,
    );
  }
}