display.rect won't resize while retaining its anchor

Solar2D General Questions/Discussion
#1

How do I resize a display.rect interactively while keeping its top left corner as an anchor?

Code below does not work – rect insists on being resized with a center anchor --, and neither does it when I uncommment the “setReferencePoint” calls:

local rect = display.newRect(0, 0, 1, 1)  
rect:setFillColor(128,128,128)  
rect:setReferencePoint(display.TopLeftReferencePoint)  
  
local screenTouched = function( event )  
 if event.phase == "began" then  
 -- rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.x = event.x  
 rect.y = event.y  
 elseif event.phase == "moved" then  
 if event.x \> event.xStart then  
 rect.width = event.x - event.xStart  
 else  
 -- rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.x = event.x  
 rect.width = event.xStart - event.x  
 end  
 if event.y \> event.yStart then  
 rect.height = event.y - event.yStart  
 else  
 -- rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.y = event.y  
 rect.height = event.yStart - event.y  
 end  
 elseif event.phase == "ended" then  
 rect.width = 1  
 rect.height = 1  
 -- rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.x = 0  
 rect.y = 0  
 return true  
 end  
end  
  
Runtime:addEventListener( "touch", screenTouched )

Alex
[import]uid: 3473 topic_id: 2277 reply_id: 302277[/import]

#2

My mistake. set x to event.x rather than event.xStart. No wonder things were looking wonky.

This works. May it help some.

local rect = display.newRect(0, 0, 1, 1)  
rect:setFillColor(128, 128, 128, 200)  
rect:setStrokeColor(64, 64, 64, 200)  
rect:setReferencePoint(display.TopLeftReferencePoint)  
  
local screenTouched = function( event )  
 if event.phase == "began" then  
 --rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.x = event.x  
 rect.y = event.y  
 elseif event.phase == "moved" then  
 if event.x \> event.xStart then  
 rect.width = event.x - event.xStart  
 else  
 rect.width = event.xStart - event.x  
 end  
 if event.y \> event.yStart then  
 rect.height = event.y - event.yStart  
 else  
 rect.height = event.yStart - event.y  
 end  
 rect:setReferencePoint(display.TopLeftReferencePoint)  
 if event.x \> event.xStart then  
 rect.x = event.xStart  
 else  
 rect.x = event.x  
 end  
 if event.y \> event.yStart then  
 rect.y = event.yStart  
 else  
 rect.y = event.y  
 end  
 elseif event.phase == "ended" then  
 rect.width = 1  
 rect.height = 1  
 rect:setReferencePoint(display.TopLeftReferencePoint)  
 rect.x = 0  
 rect.y = 0  
 return true  
 end  
end

Grrr.
Alex
[import]uid: 3473 topic_id: 2277 reply_id: 6853[/import]

#3

There is a known bug where object.width and object.height don’t respect object:setReferencePoint() and always change from the center. You need to use object:xScale and object:yScale to work correctly. The x/yScale requires calculating a percentage change from the original size (0.5 = 50%, 1.0 = 100%, 1.5 = 150%, etc.).

-Tom [import]uid: 7559 topic_id: 2277 reply_id: 7046[/import]