Background color get black when convert png transparent to jpg #13

Closed
markwu opened this Issue Nov 25, 2012 · 10 comments

Projects

None yet

2 participants

@markwu
markwu commented Nov 25, 2012

Hi maikeldaloo:

I just get a very weird issue.

When I convert from png to jpg, some png files with transparent color will become black background color in jpg file.

I have to change the following code, to make it get white color:

// Retain transparency for PNG and GIF files.
imagecolortransparent( $this->image_resized , imagecolorallocatealpha( $this->image_resized , 255 , 255 , 255 , 127 ) );
imagealphablending( $this->image_resized , true );
imagesavealpha( $this->image_resized , true );
imagefill($this->image_resized, 0, 0, IMG_COLOR_TRANSPARENT);

After the changes, the jpg will get white background. I also test these changes with png to png , it will maintain transparency color without any problems.

Mark

@maikeldaloo
Owner

Hi Mark,

Thanks for that update.
I'll add it to the source so that's it's available for others.

@markwu
markwu commented Nov 28, 2012

Hi maikeldaloo:

After some tests, I think this code fails with some resolution, it will get noise in the background. I have no idea why this happened. I will keep testing it, and let you know the result.

In the mean time, I will suggest you use the original code you have.

Regards, Mark

@markwu
markwu commented Nov 28, 2012

Hi maikeldaloo:

check the image files in the following repositories:

https://github.com/markwu/issue-attachment/tree/master/maikeldaloo-resizer-issue-13

There are 4 files:

Original file (256x256,png)
https://github.com/markwu/issue-attachment/blob/master/maikeldaloo-resizer-issue-13/bzLEjJIHYFehBns3Ca0fKz2k.png

Resized file with new method, it will generated some noise in the background (100x100,jpg)
https://github.com/markwu/issue-attachment/blob/master/maikeldaloo-resizer-issue-13/bzLEjJIHYFehBns3Ca0fKz2k.100x100.jpg

Resized file with new method, it will generated white background without problems (256x256,jpg)
https://github.com/markwu/issue-attachment/blob/master/maikeldaloo-resizer-issue-13/bzLEjJIHYFehBns3Ca0fKz2k.256x256.jpg

Resized file with previous method, it will generated black background (128x128,jpg)
https://github.com/markwu/issue-attachment/blob/master/maikeldaloo-resizer-issue-13/bzLEjJIHYFehBns3Ca0fKz2k.128x128.jpg

Really weird. :(

Mark

@markwu
markwu commented Nov 28, 2012

Okay, I think I found the solution, but not easy to solve in current code structure. Because there seems no way to know the resized/saved file type when doing resize.

If I can tell which type to save in resize function, then I can use different procedure to resize png. :(

@markwu
markwu commented Nov 28, 2012
// Resample - create image canvas of x, y size.
$this->image_resized    = imagecreatetruecolor( $optimal_width , $optimal_height );
$this->image_background = imagecreatetruecolor( $this->width , $this->height );
// Retain transparency for PNG and GIF files.
$white = imagecolorallocate($this->image_background,  255, 255, 255);
imagefilledrectangle($this->image_background, 0, 0,  $this->width , $this->height, $white);
imagecopy($this->image_background, $this->image, 0, 0, 0, 0,  $this->width , $this->height);
// Create the new image.
imagecopyresampled( $this->image_resized , $this->image_background , 0 , 0 , 0 , 0 , $optimal_width ,$optimal_height , $this->width , $this->height );

I can use code above to generate white background jpg when I convert from png.

@maikeldaloo
Owner

I've added that code to the develop branch until I can test it.
Have you tested it and found that it is working as needed?
Without any of the noise or jagged edges?

@markwu
markwu commented Nov 29, 2012

HI maikeldaloo:

The code above only works for png to jpg with white background, but it will lost transparent when convert from png/gif to png/gif.

Therefore, if there is a way can let me determine final type, then I can previous method to generate resize for png/gif, and use the above code to generate resize for jpg.

Mark

@maikeldaloo
Owner

Oh ok, then it's probably not worth keeping then.
On 29/11/2012 1:07 PM, "Mark Wu" notifications@github.com wrote:

HI maikeldaloo:

The code above only works for png to jpg with white background, but it
will lost transparent when convert from png/gif to png/gif.

Therefore, if there is a way can let me determine final type, then I can
previous method to generate resize for png/gif, and use the above code to
generate resize for jpg.

Mark


Reply to this email directly or view it on GitHubhttps://github.com/maikeldaloo/Resizer/issues/13#issuecomment-10832250.

@markwu
markwu commented Nov 29, 2012

SO, the code will looks like:

$this->image_resized    = imagecreatetruecolor( $optimal_width , $optimal_height );
if (FINAL_IMAGE_TYPE == PNG)
{
    // Retain transparency for PNG and GIF files.
    imagecolortransparent( $this->image_resized , imagecolorallocatealpha( $this->image_resized , 255 , 255 , 255 , 127 ) );
    imagealphablending( $this->image_resized , false );
    imagesavealpha( $this->image_resized , true );
    imagecopyresampled( $this->image_resized , $this->image , 0 , 0 , 0 , 0 , $optimal_width ,$optimal_height , $this->width , $this->height );
} else {
    // Resample - create image canvas of x, y size.
    $this->image_background = imagecreatetruecolor( $this->width , $this->height );
    // Retain transparency for PNG and GIF files.
    $white = imagecolorallocate($this->image_background,  255, 255, 255);
    imagefilledrectangle($this->image_background, 0, 0,  $this->width , $this->height, $white);
    imagecopy($this->image_background, $this->image, 0, 0, 0, 0,  $this->width , $this->height);
    // Create the new image.
    imagecopyresampled( $this->image_resized , $this->image_background , 0 , 0 , 0 , 0 , $optimal_width ,$optimal_height , $this->width , $this->height );
}

Does there any way to know the final saved image type in resize()?

Mark

@maikeldaloo
Owner

The issue with that bit of code is that I don't get to find out what the output extension is until the user calls the 'save' method.
But all that code goes into the 'resize' method when the user specifies sizes, etc.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment