Cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Transparent PNG background appears white

ANSWERED

The transparent png files for the LCD Clock Example appears correctly in the Ionic watch as transparent.  

 

However, any other transparent png file imported into the project has a white background.  Are there any documentation on how a transparent png file is supposed to be created?  

 

 

 

Best Answer
0 Votes
1 BEST ANSWER

Accepted Solutions

The LCD clock face uses 8-bit PNG with transparency. Then you can use a fill color to affect the white/grey areas of the image using grayscale magic.

 

$ file 1.png
PNG image data, 69 x 109, 8-bit gray+alpha, non-interlaced

 

 

 

I've used just a transparent PNG, without a fill:

 

$ file runner.png
runner.png: PNG image data, 348 x 250, 8-bit/color RGBA, non-interlaced

View best answer in original post

Best Answer
0 Votes
1 REPLY 1

The LCD clock face uses 8-bit PNG with transparency. Then you can use a fill color to affect the white/grey areas of the image using grayscale magic.

 

$ file 1.png
PNG image data, 69 x 109, 8-bit gray+alpha, non-interlaced

 

 

 

I've used just a transparent PNG, without a fill:

 

$ file runner.png
runner.png: PNG image data, 348 x 250, 8-bit/color RGBA, non-interlaced

Best Answer
0 Votes