Fading Out newImageRect() objects one by one when they are "tapped"?

Hello,

My question below has to parts to it:

Part I

I have 8-10 objects ( newImageRect) on my screen that I am trying to ‘Fade Out’ individually as they are “tapped”. 

Even though I defined individual functions for each of the newImageRect objects, and assigned an individual :addEventListener to each object, with the first tap on the screen, all objects fade out at once. 

Please advise?

Part II

Is it possible to make newImageRect() objects Draggable as well? Please advise?

All the ‘Draggable’ tutorials I found were only for  newRect or newCircle objects. 

Thanks,

1. Fading

-- not checked for typos -- -- local function onTouch( self, event ) if( event.phase == "ended" ) then self:removeEventListener("touch") transition.to( self, { alpha = 0, time = 1000, onComplete = display.remove } ) end return true end for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) tmp.touch = onTouch tmp:addEventListener("touch") end

2a. Dragging The Long Way

local function onDrag( self, event ) if( event.phase == "began") then self.isFocus = true display.currentStage:setFocus( self, event.id ) self.x0 = self.x self.y0 = self.y self:toFront() elseif( self.isFocus ) then if( event.phase == "ended" ) then self.isFocus = false display.currentStage:setFocus( self, nil ) end local dx = event.x - event.xStart local dy = event.y - event.yStart self.x = self.x0 + dx self.y = self.y0 + dy end return true end for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) tmp.touch = onDrag tmp:addEventListener("touch") end

 
2b. Dragging the easy way (with SSK2 smartDrag):
 

for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) ssk.misc.addSmartDrag( tmp, { toFront = true, retval = true } ) end

Thank you. Very helpful! 

The code for fading works. However; there is one more issue:

I have a series of images that I have put on top of one another in a certain order. They must be in the same exact location with respect to one another when the screen size changes (device). So what I did was, I created a series of TRANSPARENT Dots and Lines around each image (layer) and asked Corona to place all the layers in the center of the screen. This way, they all now line up properly. 

When I use the fading code, no matter what object or where in the screen I touch, I am basically touching the the top layer. Therefore, the objects on the top layer fade first. How can I have it so that when a certain area of the screen is tapped or touch, the object will fade?

 

1. Fading

-- not checked for typos -- -- local function onTouch( self, event ) if( event.phase == "ended" ) then self:removeEventListener("touch") transition.to( self, { alpha = 0, time = 1000, onComplete = display.remove } ) end return true end for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) tmp.touch = onTouch tmp:addEventListener("touch") end

2a. Dragging The Long Way

local function onDrag( self, event ) if( event.phase == "began") then self.isFocus = true display.currentStage:setFocus( self, event.id ) self.x0 = self.x self.y0 = self.y self:toFront() elseif( self.isFocus ) then if( event.phase == "ended" ) then self.isFocus = false display.currentStage:setFocus( self, nil ) end local dx = event.x - event.xStart local dy = event.y - event.yStart self.x = self.x0 + dx self.y = self.y0 + dy end return true end for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) tmp.touch = onDrag tmp:addEventListener("touch") end

 
2b. Dragging the easy way (with SSK2 smartDrag):
 

for i = 1, 10 do local tmp = display.newRect( 40 \* i , display.contentCenterY, 30, 30 ) ssk.misc.addSmartDrag( tmp, { toFront = true, retval = true } ) end

Thank you. Very helpful! 

The code for fading works. However; there is one more issue:

I have a series of images that I have put on top of one another in a certain order. They must be in the same exact location with respect to one another when the screen size changes (device). So what I did was, I created a series of TRANSPARENT Dots and Lines around each image (layer) and asked Corona to place all the layers in the center of the screen. This way, they all now line up properly. 

When I use the fading code, no matter what object or where in the screen I touch, I am basically touching the the top layer. Therefore, the objects on the top layer fade first. How can I have it so that when a certain area of the screen is tapped or touch, the object will fade?