These events let you listen for the two-finger pinch and rotation actions on a pinchable layer. But the layer doesn’t actually have to be pinchable, the events will work on any layer.
Pinch, Scale and Rotate
|Two fingers started panning or moving on the layer (or one finger was already on the layer and a second finger was added to the screen)|
|The fingers moved (can be outside of the layer at this point)|
|At least one of the fingers stopped touching the screen|
The three types of events, pinch, scale and rotate, are interchangeable. When making a two-finger gesture, all three will be triggered simultaneously. The separate events were created just for your convenience.
Two fingers only
- Only gestures with two fingers will trigger these events. Gestures that starts with three or more fingers are ignored (the third digit doesn’t even need to be on the layer in question).
- But fingers can be added once the gesture has already started, this will not break the stream of
- When there’s only one finger remaining on the screen,
onRotateEnd) will be called.
These events are used in the example:
onPinchStartshows the scale and rotation labels
onScaleupdates the current scale factor in the label
onRotateupdates the degrees of rotation in the label
onPinchEndsnaps the layer back to its original position and size, resets the scale and rotation labels, and fades them out
layerA.onPinchStart -> labelScale.opacity = 1 labelRotate.opacity = 1
layerA.onScale -> labelScale.html = "Scale: #"
layerA.onRotate -> labelRotate.html = "Rotation: # º"
# Snap back to original state layerA.onPinchEnd -> layerA.animate rotation: 0 scale: .5 Utils.delay .5, -> labelScale.html = "Scale: -.-" labelRotate.html = "Rotation: -.- º" Utils.delay 1, -> labelScale.opacity = 0 labelRotate.opacity = 0
onRotate are interchangeable, we might as well have used only one of them to update both labels.