Shaders aren’t necessary here, nor is looping. What you need is an alpha mask. These are really easy to implement using blendMode
. We need three images: a source image, a mask image, and a scratch image to hold the resultant picture. We first put the source image onto the scratch one (actually, first we blank the scratch image to fully transparent). Then we apply blendMode(ZERO,ONE,DST_ALPHA,ZERO)
before we overlay the alpha mask on top. This has the effect of only allowing through those parts of the image that the mask allows.
What this does is:
final colour = 0 * mask colour + 1 * image colour = image colour
final alpha = (image alpha) * (mask alpha) + 0 * (image alpha)
so the final colour is that of the image, but the alpha is the product of the alpha of the image with that of the mask. So setting the alpha on the mask to 0 sets the alpha on the final image to 0, whilst setting the alpha on the mask to 1 sets the alpha on the final image to that of the source image.
We need the premultiplied
flag to be false.
function setup()
mask = image(WIDTH,HEIGHT)
setContext(mask)
background(0,0,0,0)
setContext()
canvas = image(WIDTH,HEIGHT)
parameter.number("radius",1,50,20)
fps = {}
nfps = 20
for k=1,nfps do
table.insert(fps,1/60)
end
parameter.watch("math.floor(nfps/afps)")
end
function draw()
table.remove(fps,1)
table.insert(fps,DeltaTime)
afps = 0
for k,v in ipairs(fps) do
afps = afps + v
end
background(37, 147, 155, 255)
spriteMode(CORNER)
pushStyle()
setContext(canvas)
background(0,0,0,0)
sprite("Cargo Bot:Codea Icon",0,0,WIDTH,HEIGHT)
blendMode(ZERO,ONE,DST_ALPHA,ZERO)
sprite(mask,0,0)
setContext()
canvas.premultiplied = false
popStyle()
sprite(canvas,0,0)
end
function touched(touch)
setContext(mask)
noStroke()
fill(0,0,0, 255)
ellipse(touch.x,touch.y,radius)
setContext()
end