geste

MIP encapsule des gestes tels que le clic, le double-clic, le glissement, etc., qui peuvent être utilisés dans les composants

Exemple

var util = require('util');
var Gesture = util.Gesture;
var customEle = require('customElemenet').create();


var build = function () {
    var gesture = new Gesture(this.element);

    // on 可接受多个事件名做为参数，以空格分隔。如 gesture.on('tap swipe')
    gesture.on('tap', function (event, data) {
        // 原始事件。如tap事件是通过 touchend 触发，event为tap对应的touchend事件对象
        console.log(event);
        // gesture 计算后的数据。参数介绍见后面
        console.log(data.type); // "tap"
    });
};

Introduction aux paramètres d'initialisation

geste Lors de l'instanciation, le deuxième paramètre peut transmettre un objet en tant que configuration paramètre

Exemple :

   // 默认阻止纵向滑动事件
    var gesture = new Gesture(element, {
        preventY: true
    });

Introduction au paramètre spécifique :

preventDefault         是否阻止默认事件
preventX               是否阻止横向滑动时的默认事件
preventY               是否阻止纵向滑动时的默认事件
stopPropagation        是否阻止事件冒泡

Paramètres par défaut :

// 如果初始化时不传入配置参数，会使用下面的配置进行初始化
{
    preventDefault: false,
    stopPropagation: false,
    // 默认会阻止横滑的事件，考虑到浏览器横滑有很多默认操作，所以在这里默认阻止横滑
    preventX: true,
    preventY: false
}

geste Introduction à l'objet de données

L'objet de données est transmis comme deuxième paramètre de la fonction de traitement d'événement.

Exemple :

    gesture.on('tap', function (event, data) {
        console.log(data);
    });

Champs généraux :

angle              滑动角度，如横滑为0度
deltaTime          从开始到结束的时间间隔。单位是msdeltaX             横轴位移
deltaY             纵轴位移
direction          方向。0: 未变动   1: 上   2:右   3: 下   4: 左
distance           移动距离
pointers           触摸点
timeStamp          事件发生的时间戳
velocity           速度
velocityX          横向速度
velocityY          纵向速度
x                  触摸中心点坐标x
y                  触摸中心点坐标ytype               事件类型

Champs étendus :

Chaque geste peut étendre les champs à l'objet de données. Par exemple, le champ swipeDirection dans l'événement swipe, veuillez consulter l'introduction du module de reconnaissance de gestes pour plus de détails. Le module de reconnaissance de gestes peut recevoir des objets de données de gestes, reconnaître des gestes spécifiques et déclencher des événements de gestes spécifiques.

L'objet de reconnaissance de gestes est automatiquement créé lorsque l'utilisateur lie l'événement et est automatiquement détruit lorsque l'utilisateur dissocie l'événement.

Il existe actuellement trois outils de reconnaissance intégrés : tap, dobuletap, swipe

tap

Utilisation :

gesture.on('tap', function (event, data) {
    console.log('单击');
});

doubletap

Double clic Si tap et doubletap sont liés en même temps, l'événement tap sera déclenché avec. un délai de 300ms pour déterminer si le double clic est déclenché.

Comment utiliser :

gesture.on('tap', function (event, data) {
    console.log('双击');
});

swipe

Swipe

Comment utiliser :

// 使用方法1：
gesture.on('swipe', function (event, data) {
    console.log(data.type); // "swipe"
    console.log(data.swipeDirection); // "up" or "right" or "down" or "left"
});

// 使用方法2：
gesture.on('swipeup swipedown', function (event, data) {
    console.log(data.type) // "swipeup" or "swipedown"
    console.log(data.swipeDirection) // "up" or "down"
});