How would I code this up?

Fast forward to 1:30
https://www.youtube.com/watch?v=ZhX-NO0qHP0&t=90

Notice the scratch ticket on the right hand side. I’ve seen a few other tutorials but they are old and essentially just place a bunch of images on top of each other and as you touch them remove them. This video doesn’t look like that’s what is going on though. Any insight would be much appreciated. 

Thanks

I didn’t feel like waiting so I just messed around with a lot of different things. I found that his code works the best for what I was trying to achieve. I’ll throw it out there for anyone who much be looking to do the same.

 

local scratchTicketX = 200 local scratchTicketY = 200 local scratchTicketWidth = 500 local scratchTicketHeight = 500 local image = display.newImage("bg.png") image.x = display.contentCenterX image.y = display.contentCenterY -- Create snapshot group to house the masks local maskSnapshotGroup = display.newSnapshot(scratchTicketWidth, scratchTicketWidth) maskSnapshotGroup.x = scratchTicketX maskSnapshotGroup.y = scratchTicketY maskSnapshotGroup.anchorX = 0 maskSnapshotGroup.anchorY = 0 --Create scratch ticket "foil" local scratchTicketFoil = display.newRect(maskSnapshotGroup.canvas, 0, 0, maskSnapshotGroup.width, maskSnapshotGroup.height) scratchTicketFoil:setFillColor(0.5, 0.5, 0.5) --Insert scratch ticket "foil" over the background maskSnapshotGroup:invalidate("canvas") -- Mask Size local maskSize = 20 local function refreshMask(destX, destY) -- add transparent mask local mask = display.newCircle(maskSnapshotGroup.canvas, destX, destY, maskSize) mask.fill.blendMode = { srcColor = "zero", dstColor="oneMinusSrcAlpha" } -- blur masked image maskSnapshotGroup.fill.effect = "filter.blurGaussian" maskSnapshotGroup.fill.effect.horizontal.blurSize = maskSize maskSnapshotGroup.fill.effect.vertical.blurSize = maskSize -- refresh snapshot maskSnapshotGroup:invalidate("canvas") end local function foilTouched(event) if(event.phase == "moved") then -- Update the mask local contentX, contentY = event.x, event.y local localX, localY = event.target:contentToLocal(contentX, contentY) refreshMask(localX, localY) end end maskSnapshotGroup:addEventListener("touch", foilTouched)

I didn’t feel like waiting so I just messed around with a lot of different things. I found that his code works the best for what I was trying to achieve. I’ll throw it out there for anyone who much be looking to do the same.

 

local scratchTicketX = 200 local scratchTicketY = 200 local scratchTicketWidth = 500 local scratchTicketHeight = 500 local image = display.newImage("bg.png") image.x = display.contentCenterX image.y = display.contentCenterY -- Create snapshot group to house the masks local maskSnapshotGroup = display.newSnapshot(scratchTicketWidth, scratchTicketWidth) maskSnapshotGroup.x = scratchTicketX maskSnapshotGroup.y = scratchTicketY maskSnapshotGroup.anchorX = 0 maskSnapshotGroup.anchorY = 0 --Create scratch ticket "foil" local scratchTicketFoil = display.newRect(maskSnapshotGroup.canvas, 0, 0, maskSnapshotGroup.width, maskSnapshotGroup.height) scratchTicketFoil:setFillColor(0.5, 0.5, 0.5) --Insert scratch ticket "foil" over the background maskSnapshotGroup:invalidate("canvas") -- Mask Size local maskSize = 20 local function refreshMask(destX, destY) -- add transparent mask local mask = display.newCircle(maskSnapshotGroup.canvas, destX, destY, maskSize) mask.fill.blendMode = { srcColor = "zero", dstColor="oneMinusSrcAlpha" } -- blur masked image maskSnapshotGroup.fill.effect = "filter.blurGaussian" maskSnapshotGroup.fill.effect.horizontal.blurSize = maskSize maskSnapshotGroup.fill.effect.vertical.blurSize = maskSize -- refresh snapshot maskSnapshotGroup:invalidate("canvas") end local function foilTouched(event) if(event.phase == "moved") then -- Update the mask local contentX, contentY = event.x, event.y local localX, localY = event.target:contentToLocal(contentX, contentY) refreshMask(localX, localY) end end maskSnapshotGroup:addEventListener("touch", foilTouched)