karfcz / grunt-sprite-packer

A grunt plugin that converts multiple png files into single sprite file using efficient packer algorithm.
MIT License
11 stars 5 forks source link

transparent pixels changing color #13

Open beejjorgensen opened 9 years ago

beejjorgensen commented 9 years ago

This appears to be an ImageMagick issue that I can't quite get a handle on. Since it's not technically your problem, I wouldn't blame you for wanting to fix upstream, but I think I have a workaround that's actually sensible at this level.

Imagine you have a single-pixel image that's rgba(255,255,255,0.5).

Some versions of IM will composite this on your canvas as rgba(255,255,255,0.5). And there was much rejoicing.

Some versions of IM will composite this on your canvas as rgba(127,127,127,0.5), which is boo.

I explicitly set the compositing mode to "copy", and that fixed the issue for me, sprite-packer.js:166:

var convertParams = ['-size', '', 'xc:' + this.options.background, '-strip', '-compose', 'copy'];

http://www.imagemagick.org/script/compose.php

This makes sense for me when I'm working with sprites with a transparent background. But maybe it doesn't make sense if the user specifies a background? Should it be conditional?

if (this.options.background === 'none') { // or transparent?
    convertParams = convertParams.concat(['-compose', 'copy']);
}

Anyway, if you wontfix, feel free to close this issue.

Cheers, -Beej

karfcz commented 9 years ago

Thanks for reporting. From what I see in the documentation you linked, the 'copy' mode should be safe even for solid background. It should have the same effect as the default 'over' mode because the sprites never overlay each other. So your fix makes sense but I have to find a time to test it.