the livecode lesson on pinching https://lessons.livecode.com/m/4069/l/1 ... nch-motion is often referenced but it is not producing a superuseful zoom, since the zoom focusses on the centre of the image and not on the area that is pinched. Below is my quick and dirty mod that produces a pinch & zoom and drag behaviour that I would expect on mobile. Feel free to make it more beautiful. This script doesn't do rotation, so I did not post it to the recent thread on pinch and rotate. If a moderator feels this topic should be merged, please do. Thanks to the original author of the lesson, it was very useful as a base. Best. Oliver
Code: Select all
local sTouchArray, sFRAMEWIDTH, sFRAMEHEIGHT
local tempimagex, tempimagey, focusx, focusy, pinchflag
on touchStart pId, pX, pY
put the width of image "ballotimage" into sFRAMEWIDTH
put the height of image "ballotimage" into sFRAMEHEIGHT
put item 1 of the loc of image "ballotimage" into tempimagex
put item 2 of the loc of image "ballotimage" into tempimagey
end touchStart
on touchEnd pId
if the number of lines of the keys of sTouchArray is 1 then
put false into pinchflag
end if
delete variable sTouchArray[pId]
end touchEnd
on touchMove pId, pX, pY
if sTouchArray[pId]["startloc"] is empty then
put (pX & comma & pY) into sTouchArray[pId]["startloc"]
end if
put (pX & comma & pY) into sTouchArray[pId]["currentloc"]
-- sxcript if user wants to move image around:
if the number of lines of the keys of sTouchArray is 1 then
--First lets get the data out of the array
put line 1 of the keys of sTouchArray into tPointOne
put sTouchArray[tPointOne]["startloc"] into tStartLoc
if tStartLoc1 is not empty then
put item 1 of tStartLoc into tempstartx
put item 2 of tStartLoc into tempstarty
put tempstartx-pX into tempdiffx
put tempstarty-pY into tempdiffy
put tempimagex-tempdiffx into tempimagecurrentx
put tempimagey-tempdiffy into tempimagecurrenty
if pinchflag is not true then
set the loc of image "ballotimage" to tempimagecurrentx, tempimagecurrenty
end if
end if
end if
-- script when user want to pinch and zoom:
if the number of lines of the keys of sTouchArray is 2 then
# First lets get the data out of the array
put line 1 of the keys of sTouchArray into tPointOne
put line 2 of the keys of sTouchArray into tPointTwo
# First lets calculate the size of the picture base on the distance
# between the two touch points
put sTouchArray[tPointOne]["startloc"] into tStartLoc1
put sTouchArray[tPointTwo]["startloc"] into tStartLoc2
if tStartLoc1 is not empty and tStartLoc2 is not empty then
put true into pinchflag -- to avoid a jump in location when 1 finger is removed
-- calculate the focus point of the zoom, it is located between the two starting touchpoints
put item 1 of tStartLoc1 into focusx1
put item 2 of tStartLoc1 into focusy1
put item 1 of tStartLoc2 into focusx2
put item 2 of tStartLoc2 into focusy2
put focusx1 + round ((focusx2-focusx1)/2) into focusx
put focusy1 + round ((focusy2-focusy1)/2) into focusy
put resizeDistance(tStartLoc1, tStartLoc2) into tStartDistance
put resizeDistance(sTouchArray[tPointOne]["currentloc"], sTouchArray[tPointTwo]["currentloc"]) into tCurrentDistance
resizeGraphic tStartDistance, tCurrentDistance
end if
end if
end touchMove
function resizeDistance pLoc1, pLoc2
local dy, dx, tDistance
put item 2 of pLoc1 - item 2 of pLoc2 into dy
put item 1 of pLoc1 - item 1 of pLoc2 into dx
put sqrt((dy*dy) + (dx*dx)) into tDistance
return tDistance
end resizeDistance
on resizeGraphic pStartDistance, pNewDistance
lock screen
# Work out the percentage change between the old and new image
put round((pNewDistance / pStartDistance) * 100) into tPercentage
# Calculate the new width and height
set the width of image "ballotimage" to round(sFRAMEWIDTH * (tPercentage / 100))
set the height of image "ballotimage" to round(sFRAMEHEIGHT * (tPercentage / 100))
-- first scale the coordinates of the focus point
put tempimagex + round((focusx-tempimagex) * (tPercentage / 100)) into focusxnew
put tempimagey + round((focusy-tempimagey) * (tPercentage / 100)) into focusynew
-- getting the difference between original and scaled focuspoint
put focusx - focusxnew into focusxdiff
put focusy - focusynew into focusydiff
-- calculate the new location of the graphic
put tempimagex + focusxdiff into locxnew
put tempimagey + focusydiff into locynew
set the loc of image "ballotimage" to locxnew,locynew
unlock screen
end resizeGraphic