Eventi Touch

È possibile scrivere applicazioni consapevoli dei touch che funzionano su molti dispositivi mobili I browser desktop consapevoli dei touch sono quasi arrivati; preparatevi ora Apparsi per la prima volta in Mobile Safari per iOS 2.0 Quattro eventi di base: touchstart touchmove touchend touchcancel Campi dell’oggetto Event: touches targetTouches changedTouches tasti modificatori (shift, alt, ctrl, meta) Campi dell’oggetto Touch: identifier clientX/Y pageX/Y screenX/Y Ora è una Bozza di Lavoro W3C Esistono ancora molte differenze tra i vari fornitori: touchenter / touchleave ( Firefox , Blackberry ) gesturestart / gesturechange / gestureend (Mobile Safari) MSPointer* / MSGesture* (IE10) Comportamento nativo Dispositivi con metodi di input alternativi Il multi-touch FF6+ supporta gli eventi touch in stile W3C IE10 dispone di MSPointer* / MSGesture* Nessun supporto ancora in WebKit Disabilitare la gestione standard dei gesti (panoramica / zoom / scorrimento) e document.body.addEventListener(‘touchmove’, function(event) { event.preventDefault(); }, false); Disabilitare la gestione standard dei gesti (panoramica / zoom / scorrimento) Gestire il rendering in un ciclo: var touches = [], // qui si potrebbe usare anche requestAnimationFrame() renderLoop = setInterval(function() { draw(touches); // chiama la nostra funzione di disegno }, 15); myElement.addEventListener(‘touchmove’, function(e) { touches = e.touches; }, false); Disabilitare la gestione standard dei gesti (panoramica / zoom / scorrimento) Gestire il rendering in un ciclo Supporto per dispositivi a touch singolo (ad es. telefoni Android) Disabilitare la gestione standard dei gesti (panoramica / zoom / scorrimento) Gestire il rendering in un ciclo Supporto per dispositivi a touch singolo (ad es. telefoni Android) Gestire gli eventi del mouse per: Telefoni con hardware puntatore fisico (ad es. molti handset Android) Telefoni senza eventi touch (ad es. Windows Phone 7) Browser desktop senza supporto touch (ad es. Chrome) Disabilitare la gestione standard dei gesti (panoramica / zoom / scorrimento) Gestire il rendering in un ciclo Supporto per dispositivi a touch singolo (ad es. telefoni Android) Gestire gli eventi del mouse Supporto per browser desktop abilitati al touch: Firefox (eventi touch in stile W3C) IE10 (MSPointer*) @ @ggoodale