GestureDetector est un widget qui sert à détecter les gestes. Les gestes sont tout type d’événement d’interaction : tapotements, glissements etc. En fait, nous utilisons ces gestes au quotidien pour interagir avec un téléphone mobile ou un appareil tactile.

Le constructeur de la classe GestureDetector contient de nombreux paramètres, nous allons donc aborder les plus basiques. En particulier, le paramètre child qui vous permet de définir un widget enfant cliquable.

Si GestureDetector ne possède pas de widget enfant, il occupera tout l’espace de son conteneur parent, rendant ainsi tout son espace cliquable.

Le constructeur GestureDetector fournit divers paramètres pour gérer tous les clics possibles. L’action d’un simple tapotement peut être définie à l’aide du paramètre onTap.

Le système gestuel de Flutter comporte deux couches indépendantes. La première couche est l’événement de pointeur d’origine, qui décrit la position et le mouvement du pointeur (le toucher, la souris et le stylet). La deuxième couche est constituée de gestes, qui décrivent des actions sémantiques composées d’un ou plusieurs mouvements, tels que le glissement, le zoom, le double-clic et l’appui long.

En fait, GestureDetector est un widget non visuel qui permet d’identifier le geste que vous utilisez avec un widget. Vous pouvez encapsuler le widget dans GestureDetector qui capturera le geste et enverra divers événements en fonction du geste.

Comment utiliser le widget GestureDetector ?

Nous devons avoir un Widget passé comme child et au moins une fonction de rappel selon les types de gestes que nous voulons gérer.

onTap : appelé lorsque l’écran est touché par l’utilisateur.

onTapUp : est appelé lorsque l’utilisateur cesse de toucher l’écran.

onTapDown : appelé lorsque l’utilisateur entre en contact avec l’écran.

onTapCancel : est appelé lorsque l’utilisateur touche l’écran mais ne termine pas le clique.

onDoubleTap : lorsque l’écran est touché deux fois rapidement.

onLongPress : est appelé lorsque l’utilisateur touche l’écran pendant plus de 500 millisecondes.

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: MyApp(),
  ));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GestureDetector'),
      ),
      body: Center(
        child: GestureDetector(
          child: FlutterLogo(
            size: 200.0,
          ),
          onTap: () {
            print("tap");
          },
        ),
      ),
    );
  }
}
GestureDetector

Catégories : Flutter

0 commentaire

Laisser un commentaire

Emplacement de l’avatar

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *