72 votos

Forma más sencilla de detectar una pizca

Esta es una APLICACIÓN WEB no es una aplicación nativa. Por favor, no Objective-C NS comandos.

Así que se necesitan para detectar 'pizca' de los eventos en iOS. El problema es que cada plugin o método que ver para hacer gestos o multi-touch de eventos, es (en general), con jQuery y es un conjunto adicional pluggin para cada gesto bajo el sol. Mi aplicación es enorme, y yo soy muy sensible a la madera muerta en mi código. Todo lo que necesito es detectar una pizca, y el uso de algo como jGesture es sólo a modo hinchado para mis necesidades sencillas.

Además, tengo una comprensión limitada de cómo detectar una pizca de forma manual. Puedo obtener la posición de los dedos, parece que no puede obtener la mezcla correcta para detectar esto. ¿Alguien tiene un simple trozo de código que SÓLO detecta pizca?

116voto

Jeffrey Sweeney Puntos 3052

Piensa en qué es lo pinch evento se: dos dedos en un elemento, moviendo hacia o lejos el uno del otro. Los eventos de gestos son, a mi entender, bastante un nuevo estándar, por lo que probablemente la manera más segura acerca de esto es el uso de eventos de toque de este modo:

(ontouchstart evento)

if(e.touches.length == 2) {
    scaling = true;
    pinchStart(e);
}

(ontouchmove evento)

if(scaling) {
    pinchMove(e);
}

(ontouchend evento)

if(scaling) {
    pinchEnd(e);
    scaling = false;
}

Para obtener la distancia entre los dos dedos, utilice el teorema de pitágoras:

var dist =
Math.sqrt(
    (e.touches[0].x-e.touches[1].x) * (e.touches[0].x-e.touches[1].x) +
    (e.touches[0].y-e.touches[1].y) * (e.touches[0].y-e.touches[1].y));

67voto

Dan Herbert Puntos 38336

Desea utilizar el gesturestart, gesturechangey gestureend eventos. Estos activar en cualquier momento 2 o más dedos, toque la pantalla.

Dependiendo de lo que usted necesita hacer con el gesto de pellizcar, su enfoque debe ser ajustada. El scale multiplicador puede ser examinado para determinar cómo dramático del usuario gesto de pellizcar fue. Ver Apple TouchEvent la documentación para más detalles acerca de cómo la scale de la propiedad se comportan.

node.addEventListener('gestureend', function(e) {
    if (e.scale < 1.0) {
        // User moved fingers closer together
    } else if (e.scale > 1.0) {
        // User moved fingers further apart
    }
}, false);

Usted también podría interceptar la gesturechange de eventos para detectar una pizca sucede si usted necesita para hacer que tu aplicación se sienten más sensibles.

27voto

Bruno Puntos 886

Hammer.js en todo el camino! Se encarga de "transforma" (pellizcos). http://eightmedia.github.com/hammer.js/

Pero si usted desea aplicarlo a ti mismo, creo que Jeffrey la respuesta es bastante sólido.

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by:

X