iPhone: CALayer + rotate in 3D + antialias?

Question

An iPhone SDK question: I'm drawing a UIImageView on the screen. I've rotated it in 3D and provided a bit of perspective, so the image looks like it's pointing into the screen at an angle. That all works fine. Now the problem is the edges of the resulting picture don't seem to be antialiased at all. Anybody know how to make it so?

Essentially, I'm implementing my own version of CoverFlow (yeah yeah, design patent blah blah) using quartz 3d transformations to do everything. It works fine, except that each cover isn't antialiased, and Apples version is.

I've tried messing around with the edgeAntialisingMask of the CALayer, but that didn't help - the defaults are that every edge should be antialiased...

thanks!

Answer 1

If you rotate only one image, than one trick will resolve the problem. Try to set

layer.shadowOpacity = 0.01;

After that picture will look smoother after 3D Rotation

Answer 2

You can try this

Method: Using layer.shouldRasterize

1. Create a superlayer/superview which is 1 pixel bigger in all 4 directions
2. Do the transform on the superlayer/superview
3. Enable layer.shouldRasterize on the original layer/view

---

Method: Drawing to a UIImage

• Draw your content to a UIImage
• Make sure that you have a transparent border of 1 pixel around the content
• Display the image

---

Reference: http://darknoon.com/2012/05/18/the-transparent-border-trick/

Answer 3

The Gloomcore answer give a really neat result.

however this sometime make things really LAGGY ! Adding rasterization help a little bit:

.layer.shadowOpacity = 0.01;
.layer.shouldRasterize = YES;

I know the question/answer is old, but hey i just found it.

Answer 4

I had a similar issue that was solved by only setting shouldRasterize = YES, however because I was re-using my views (and layers), the shouldRasterize = YES killed the performance.

Fortunately I found a solution by turning shouldRasterize = NO at the right time to restore performance in my app's case.

I posted a solution here: Antialiasing edges of UIView after transformation using CALayer's transform

Answer 5

You could try adding some transparent pixels around the edge of the image, either by putting the UIImageView in a slightly larger empty view that you apply rotation to, or by changing the source images.