Game Development Reference
In-Depth Information
topRadius = 25
topOrigin = {
x = _W/2,
y = 30
}
function onDraw(index, xOrg, yOrg, xFlp, yFlp)
MOAIGfxDevice.setPenColor(1,0.64,0.1)
MOAIDraw.fillCircle(topOrigin.x,topOrigin.y,topRadius,100)
MOAIDraw.fillCircle(_W/2,bottomOriginY,bottomRadius,100)
MOAIDraw.fillFan(
topOrigin.x-currentTopRadius, topOrigin.y,
topOrigin.x+currentTopRadius, topOrigin.y,
topOrigin.x+bottomRadius, bottomOriginY,
topOrigin.x-bottomRadius, bottomOriginY
)
end
In our draw function, first we draw two circles, one on top and one at the bottom, as specified by
topOrigin.y
and
bottomOriginY
, with radii specified as
topRadius
and
bottomRadius
.
Next we draw a quadrangle from the middle of the upper circle to the middle of the lower circle, in
effect connecting the two. To make this look a bit more realistic, this could be a curve that arches
inward to give the impression of a droplet of slime expanding. However, for simplicity, we just use a
quadrangle that provides a similar look.
You can make this more realistic by adding another segment, but I'll leave that as an exercise for you.
We need to position the lower blob where the mouse currently is; that way, we can simulate the
effect of pulling the blob away from the larger blob.
function onMove(mx, my)
bottomOriginY = my
if bottomOriginY < 40 then bottomOriginY = 40 end
if bottomOriginY > 400 then bottonOriginY = 400 end
bottomRadius = 12 - ((my-currentTopRadius)/48)
end
MOAIInputMgr.device.pointe:setCallback(onMove)
In the mouse-move function; we first set
bottomOriginY
to the current y position of the mouse
pointer. We also ensure that
bottomOriginY
remains in the range of 40 to 400. We also set the radius
of the bottom circle to shrink or expand as it moves (see Figure
10-11
).