R102 - Crop transparent area issue

It's explained on the video.

[tube]http://www.youtube.com/watch?v=hKPRbnc3Xwk[/tube]

Thank you!

This is by design. It is to help soften the edges of sprites, and ensure edges are blended the same way as transparency inside the image. See this image:

<img src="http://www.scirra.com/images/crop1pxborder.png" border="0" />

The left images are cropped with no border, and the right images are cropped with a 1px transparent border. The top image is a tiny 6x6 sprite scaled up large, and the bottom image is just an ordinary 32x32 sprite rotated slightly.

Notice with no border two problems occur:

• top image: transparency inside the image blends smoothly, but the edges are hard, which is inconsistent. With the 1px transparent border it is treated the same way over the whole image.
• bottom image: edges appear 'hard'. With a 1px transparent border the image has 'soft' edges which looks better quality, because it allows the edges to linear blend to transparency.

When cropping the origin, image points and collision poly are also offset by 1px so it should realistically have no impact on the behavior of the game.

Does this really cause any practical difficulties? I think it's a nice tweak to ensure the best quality display of graphics, especially on rotated sprites.

Ashley, by learning it, I might ask: - The imported images with no transparent offsets would have the issue about blending?

Imported images don't have a 1px border added automatically so will display like the left column. I've had it on my todo list to auto-crop imported images so it always displays like the right column.

I hope that any sort of 1px auto-crop never comes to C2. If it means that when I import background picture of 256x256 it will be turned into 257x257 picture.

Ashley

I was playing with it, and when I did a small image with 2x2 pixels of size, and re-sized it to be a mask (with the transparent area around), but it blurred very much around the image. It maybe an issue if made automatically.

<img src="https://dl.dropbox.com/u/47035927/temp/blur.png" border="0" />

The blue horizontal mask is blurred, but it should appear like the vertical bar. And for tiled background, it will not happen, right?

Instead of using sprites I should used tiled background, but didn't because of the origin points issue of the R100.

Well, it's really hard to resolve, because it's very complex to make the engine place a frame around the images to blur, but if you place the image on the canvas and re-size, it will always blur proportional to the original size, re-sizing the transparent edge too.

It's not possible to make the transparent offsets only on the exported mosaics?

Also, thank you for the information, I'll workaround it by using tiled background if you make it automatic.

nemo - why is that a bad thing? Especially if it improves the quality of rotation?

I'll see about adding a ctrl+crop shortcut which does not add 1 px transparent border, so you can get it either way.

Thank you very much Ashley !!

Added Control+Crop in r103 to remove 1px border. Closing as hopefully this solves it now!