How to show an image with transparent background in Corona

Getting Started Newbie Questions
#1

To load an image in corona i am using following code:

local nebula = display.newImage( "download.png" ) nebula.x, nebula.y = display.contentCenterX, display.contentCenterY 

However if the image has a transparent background it shows something like following:

 

A5WSB.png

 

If there any way to show just the cloud part? Shouldn’t images with transparent background do that automatically?

Thanks in advance.

#2

It’s very likely your image, while being a PNG file, does not have an alpha channel. This is what indicates what part of the image should be transparent.

Normally digital images are made up of three color channels (Red, Green and Blue or RGB) and each channel’s pixels are 8 bits each. In PNG lingo this would be a 24-bit image. But 3 channel images don’t have any way to say “this pixel should be transparent”. This requires a 4th channel called the “alpha” channel. It’s also 8 bits per pixel so now in PNG lingo this would be a 32-bit image.  Some formats like JPEG are not permitted to have an alpha channel. 

You should check your image in an image editor like Photoshop and when saving it, make sure it’s saved with an alpha channel.

On a side note, unless you have a specific reason to use display.newImage() (like not knowing the width and height of the image), you should be using display.newImageRect() instead.

Rob

#3

It’s very likely your image, while being a PNG file, does not have an alpha channel. This is what indicates what part of the image should be transparent.

Normally digital images are made up of three color channels (Red, Green and Blue or RGB) and each channel’s pixels are 8 bits each. In PNG lingo this would be a 24-bit image. But 3 channel images don’t have any way to say “this pixel should be transparent”. This requires a 4th channel called the “alpha” channel. It’s also 8 bits per pixel so now in PNG lingo this would be a 32-bit image.  Some formats like JPEG are not permitted to have an alpha channel. 

You should check your image in an image editor like Photoshop and when saving it, make sure it’s saved with an alpha channel.

On a side note, unless you have a specific reason to use display.newImage() (like not knowing the width and height of the image), you should be using display.newImageRect() instead.

Rob