Gesture detection broken with canvas.rotate canvas.translate

[morgano86]

Drawing an onTapDown shape before rotation or translation works ok, however; if you rotate or translate the canvas and then draw a shape - the shape does not register onTapDown. If I do not rotate or translate the canvas, the shape is drawn in the wrong location, but onTapDown now works.

I've tried attaching the canvas with touchyCanvas = TouchyCanvas(context, canvas) after the rotation events but this does not fix the onTapDown behaviour.

Is there a workaround for this?

[edit] I found the onTapDown gestures located at the side of the canvas layered on top of each other (clicking one activates them all). Ultimately, it appears the gestures are being inserted and tracked - but they are not attached to the shapes drawn using touchyCanvas that have been rotated.

[morgano86]

The red boxes are being drawn with touchyCanvas.drawRect on top of the text with onTapDown. The red boxes are clickable when the canvas is not rotated but obviously do not line up with the text anymore.

[morgano86]

Just for clarification of the order of processing:

var touchyCanvas = TouchyCanvas(context, canvas);
------------------calculations
canvas.save();
canvas.translate(x, x);
------------------calculations
canvas.rotate(x);
------------------calculations
canvas.rotate(x);
------------------calculations
------------------draw text individually by character
touchyCanvas.drawRect()*
canvas.restore();

*draws a rectangle around each character in the correct location - but onTapDown is not attached to the rectangle. The attached screenshot shows the touchyCanvas.drawRect() in red. onTapDown a rectangle overlaid on the text works fine if you do not rotate or translate the canvas.

[benhawkinsicon]

Same issue. I cannot perform any translations on the canvas, as they are not applied to the gesture detection areas.

[SyedAhkam]

Any updates on this?