On Nov 17, 3:27 am, naugem <nau...@gmail.com> wrote: > Hello, > > I have a simple web app that consists of a circle moving around. When > I do a swipe, the app freezes and the circle stops moving, and I have > to do another swipe/tap to set it in motion again. This only happens > in Andoid 2.2 devices (2.3 works OK). Does anyone know why this > happens? How can I avoid this? > > Here's the code: > > <!doctype html> > <html> > <head> > <meta charset="UTF-8" /> > <title>Canvas Test</title> > <script type="text/javascript" src="touch.js"></script> > </head> > <body> > <section> > <div> > <canvas id="canvas" width="400" height="300"> > This text is displayed if your browser > does not support HTML5 Canvas. > </canvas> > <canvas id="canvas2" width="400" height="300"> > This text is displayed if your browser > does not support HTML5 Canvas. > </canvas> > </div> > > <script type="text/javascript"> > var canvas; > var ctx; > var x = 400; > var y = 300; > var dx = 2; > var dy = 4; > var WIDTH = 400; > var HEIGHT = 300; > > function circle(x,y,r) { > ctx.beginPath(); > ctx.arc(x, y, r, 0, Math.PI*2, true); > ctx.fill(); > } > > function rect(x,y,w,h) { > ctx.beginPath(); > ctx.rect(x,y,w,h); > ctx.closePath(); > ctx.fill(); > } > > function clear() { > ctx.clearRect(0, 0, WIDTH, HEIGHT); > } > > function init() { > > > document.getElementById('canvas').addEventListener('touchstart', > touchStart); > > document.getElementById('canvas').addEventListener('touchmove', > touchMove); > document.getElementById('canvas').addEventListener('touchend', > touchEnd); > > canvas = document.getElementById("canvas"); > ctx = canvas.getContext("2d"); > return setInterval(draw, 10); > } > > function draw() { > clear(); > ctx.fillStyle = "#FAF7F8"; > rect(0,0,WIDTH,HEIGHT); > ctx.fillStyle = "#444444"; > circle(x, y, 10); > > if (x + dx > WIDTH || x + dx < 0) > dx = -dx; > if (y + dy > HEIGHT || y + dy < 0) > dy = -dy; > > x += dx; > y += dy; > } > > init(); > </script> > </section> > </body> > </html> > > <<--- touch.js --->> > > var triggerElementID = null; > var fingerCount = 0; > var startXPosition = 0; > var startYPosition = 0; > var currentXPosition = 0; > var currentYPosition = 0; > var minLength = 72; > var swipeLength = 0; > var swipeDirection = null; > > function touchStart(event,passedName) { > event.preventDefault(); > fingerCount = event.touches.length; > > if (fingerCount == 1 ) { > startXPosition = event.touches[0].pageX; > startYPosition = event.touches[0].pageY; > triggerElementID = passedName ? passedName : this.id; > } else { > touchCancel(event); > } > > } > > function touchMove(event) { > event.preventDefault(); > > if (event.touches.length == 1 ) { > currentXPosition = event.touches[0].pageX; > currentYPosition = event.touches[0].pageY; > } else { > touchCancel(event); > } > > } > > function touchEnd(event) { > try { > event.preventDefault(); > if ( fingerCount == 1 && currentXPosition != 0 ) { > currentXPosition = event.touches[0].pageX; > currentYPosition = event.touches[0].pageY; > > swipeLength = > Math.round(Math.sqrt(Math.pow(currentXPosition - > startXPosition,2) + Math.pow(currentYPosition - startYPosition,2))); > > if ( swipeLength >= minLength ) { > caluculateAngle(); > } > } > } finally { > touchCancel(event); > } > > } > > function touchCancel(event) { > fingerCount = 0; > startXPosition = 0; > startYPosition = 0; > currentXPosition = 0; > currentYPosition = 0; > swipeLength = 0; > swipeDirection = null; > triggerElementID = null; > > } > > Thanks!
-- You received this message because you are subscribed to the Google Groups "Android Developers" group. To post to this group, send email to android-developers@googlegroups.com To unsubscribe from this group, send email to android-developers+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/android-developers?hl=en