Developing for iPhone/iPad/Android with Corona: Fade in and Fade out

Posted by Dr. Burton on July 9, 2010 in Android, Corona, iPad, iPhone, Mobile |

This tutorial will provide the basics of doing a simple object fade in and fade out using the alpha.

Alpha is commonly used in game environments to cause objects to be not visible or only partially visible.  At zero, an object is invisible, at one (or 100%), an object is fully visible.

To get started, we will use the code we finished with when we created our interactive Hello World project:

local textObj = display.newText(“Hello World!”, 50, 50, nil, 24)
textObj:setTextColor( 255, 255, 255)

local mybutton = display.newImage( “button.png” )
mybutton.x = display.contentWidth/2
mybutton.y = display.contentHeight-75

local h = textObj.height
local w = textObj.width

function mybutton:tap( event )
textObj.x = math.random(w/2, display.contentWidth – (w/2))
textObj.y = math.random(h/2, display.contentHeight -(100 + h/2))

mybutton:addEventListener( “tap”, mybutton )

We just need to add two lines to the mybutton function:
textObj.alpha =0
before changing the objects x and y, and
transition.to (textObj, {time=3000, alpha=1})
just before our ‘end’

When you run the new code, the text will disappear, then fade in at its new location.  The final function should look like this:
function mybutton:tap( event )
textObj.alpha =0
textObj.x = math.random(w/2, display.contentWidth – (w/2))
textObj.y = math.random(h/2, display.contentHeight -(100 + h/2))
transition.to (textObj, {time=3000, alpha=1})

Note: If you cut and past the above code into your editor of choice, you will need to replace the quotes with system quotes, else it will generate an error.

[tubepress video =AFr9dwZ6Ly8 ]

Note: I have changed display.stageWidth and display.stageWidth to display.contentWidth & display.contentHeight for version 2.0 of Corona.  As of 2.0 stageHeight & stageWidth have been depreciated.


  • Seth says:

    I couldn’t find the jdk for mac because “Mac OS X is the only major consumer operating system that comes complete with a fully configured and ready-to-use Java runtime and development environment.” Just thought I would share.

  • Dr. Burton says:

    Correct! Unfortunately, the Mac OS also tends to be a little slow in putting out the updates. It should fine though for everything that is being demonstrated.

  • Andorid/iPhone App Development with Corona: Fade In and Out | Dream Later says:

    […] Learn how to develop software for iPhone, iPad or Droid with Corona. In this tutorial Dr. Burton demonstrates how to fade in and out with the transition command. Very similar to Flash tweening, transition allows you to change any objects properties of a set period of time. The full tutorial can be viewed at http://www.burtonsmediagroup.com/blog… […]

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Copyright © 2010-2022 Burtons Media Group All rights reserved.
This site is using the Desk Mess Mirrored theme, v2.5, from BuyNowShop.com.