iOS: CAEmitter Layer and EmitterCell Flips Image on iOS 6

Question

Was playing around with CAEmitterLayer and discovered something really weird.

I set up the CAEmitterLayer at the lower left corner, positioned at 45 degree (pointing towards the top right corner) and tried to shoot some arrows toward the top right corner.

Everything worked, except the image that I set via the content property of the cell.

Here is the original image on iOS 7 device:

When run on iOS 6, it becomes like this:

Has anyone experienced this and do you know why this is so? Having two sets of images and check whether the device is iOS 6 or iOS 7 and set the image up accordingly is not a problem for me, but my curiosity urges me to find out why this is so. Thanks in advance.

I am using Xcode 5.

Answer 1

This is normal behaviour in CAEmitterLayer. It uses a different coordinate system than the rest of iOS. As it was a technology derived from MacOS its origin (0,0) is located at the bottom left, while in iOS the origin is located at the top left. When the picture gets drawn it causes the image to get flipped. CAEmitterLayer was not really designed to use images like that, mostly made for particle systems that do not require a specific orientation.

The simplest solution to this would be to flip the image yourself so when CAEmitterLayer flips it again it will appear like you want it. This might have gotten changes in iOS7 so you would have to do a version check and apply the correct image.

You could also flip it in code if you wanted. This is a short code that does it:

UIImage *flippedPicture = [UIImage imageWithCGImage:picture.CGImage scale:1.0 orientation:UIImageOrientationLeftMirrored];

Source: http://www.vigorouscoding.com/2013/02/particle-image-gets-mirrored-by-uikit-particle-system/