Este documento describe cómo usar JavaScript en aplicaciones web para iPad para incorporar funcionalidades de touch, gestos y acelerómetro. Explica eventos de touch como tap y swipe y cómo rastrear múltiples dedos. También cubre cómo agregar contexto geográfico usando GPS y detección de movimiento con el acelerómetro para mejorar la interactividad. Alienta a desarrollar aplicaciones web que aprovechen estas capacidades para ofrecer una experiencia de usuario nativa.
Desarrollo de aplicaciones web para iPad con Touch, Gestures, GPS y Acelerómetro usando JavaScript
1. Touch,
Gestures
y
Acelerómetro
con
JavaScript
para
aplicaciones
web
en
iPad.
@pacocuevas
2. Touch, Gestures,
´
y Acelerometro con
JavaScript para
aplicaciones web en iPad
@@pacocuevas
3. ´ ´
Que aprenderan en 50 mins ?
cuál es la justificación para apostar en las web app´s
que necesito saber y que herramientas tener
para desarrollar mi primer gran web app
conocer los detalles de web app´s en iPhone y iPad
Multi-touch, Gestures, GPS, Acelerómetro todo con
HTML5, CSS3 y JavaScript
5. el número de
búsquedas locales
esta creciendo
exponencialmente !
a un ritmo de 50% anual
Desktop
Mobile 50%
50%
la mitad de las conexiones
a internet son realizadas
desde móviles
22. JavaScript Touch Event Model
touchstart El dedo hace contacto en la pantalla
touchmove El dedo se mueve en la pantalla
touchend El dedo es retirado de la pantalla
touchcancel El contacto ha sido interrumpido
23. TouchEvent Object
tres dedos en contacto
element.addEventListener(‘touchstart’, handleTouchStart, false);
function handleTouchStart(touchEvent) { ...
TouchEvent
Touch (contacto)
TouchList touches
TouchList changedTouches
TouchList targetTouches
24. Touch Object
uno para cada dedo
Touch
unsigned long identi er
EventTarget target
Long screenX
Long screenY
Long pageX
Long pageY
25. Touch Object
ubicando el objeto
Touch
unsigned long identi er
EventTarget target
screenX
Long screenX screenY
Long screenY
Long pageX
Long pageY
41. Recapitulando
desarrolla Web Apps tomando ventaja de una UX
con eventos touch y gestures
agrega contexto geográfico a las funcionalidades
incorpora detección de movimiento para más
interactividad
continua confiando en los estándares (HTML5, CSS3,
JavaScript)