Skip to main content

Falling leaves with Corona SDK and transition2

The latest addition to my transition2 library for Corona is the convenience function fallingLeaf().

I was working on my iOS game Ice Trap, trying to create a "confetti cannon" effect when the player completes a level and achieves three stars. While playing around with the existing transition functions I managed to reach a quite decent result by combining several different transitions. It took me a while to get there, so I realized that it would probably be nice to turn that combination of transitions into its own convencience function.

At its simplest use, you only need a few lines of code to create a leaf that falls smoothly towards the bottom of the screen following a seemingly random pattern:


local transition2 = require("transition2")

local leaf = display.newImageRect("leaf-64px.png", 64, 64)
leaf.x, leaf.y = display.contentCenterX, 0
transition2.fallingLeaf(leaf, {})

Simplest possible use of fallingLeaf()
Ok, so that looks quite nice, but you probably want to be able to tweak the speed, cycle length, rotation, shading etcetera. Here's a slightly more complex example where most parameters are demonstrated:


for i = 1, 100 do
    local leaf = display.newImageRect("leaf-64px.png", 64, 64)
    leaf.x, leaf.y = math.random(0, display.contentWidth), -50
    leaf.rotation = math.random(0, 360)
    
    local colors = {
        {1, 1, 0, 1},
        {1, 0.6, 0, 1},
    }
    leaf:setFillColor(unpack(colors[math.random(1,#colors)]))
    
    transition2.fallingLeaf(leaf, {
        delay = math.random(0, 5000),
        speed = 0.35,
        verticalIntensity = 0.4,
        horizontalIntensity = 0.5,
        rotationIntensity = 0.25,
        horizontalDirection = "random",
        randomness = 0.75,
        zRotateParams = {
            shadingDarknessIntensity = 0.5,
            shadingBrightnessIntensity = 0.25,
        },
        cancelWhen = function()
            return (not leaf.y) or (leaf.y > display.contentHeight)
        end,
        onCancel = function(target)
            transition.fadeOut(target, {
                time = 1000,
                onComplete = function(target)
                    target:removeSelf()
                end
            })
        end,
    })
end

More complex use of transition2.fallingLeaf()
Regarding the confetti cannon effect for Ice Trap, it worked out really well and ended up looking like this:


Read more about transition2 and get the full source code from https://github.com/rannerboy/corona-transition2. Cheers!

Comments