7

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!

Colin
  • 3,670
  • 1
  • 25
  • 36
  • Are you setting `edgeAntialiasingMask` to `kCALayerLeftEdge | kCALayerRightEdge | kCALayerTopEdge | kCALayerBottomEdge`? – rpetrich Apr 21 '10 at 21:36
  • yep, tried that. also, that combination is the default for that property – Colin Apr 21 '10 at 21:55
  • Seems transparent edge pixels is the way to go then (that way `magnificationFilter` and `minificationFilter` will take care of it) – rpetrich Apr 21 '10 at 22:17

5 Answers5

19

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

Gloomcore
  • 940
  • 7
  • 11
7

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.

Lifely
  • 1,035
  • 12
  • 22
2

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.

drawnonward
  • 53,459
  • 16
  • 107
  • 112
  • 1
    Putting the `UIImageView` in a larger view and then applying a transform will have no effect--sublayers aren't composited into their parents, rather the entire graph is composited by the GPU. Adding transparent pixels to the edge of the image should work well though. – rpetrich Apr 21 '10 at 21:35
0

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

Community
  • 1
  • 1
Raz
  • 1,387
  • 12
  • 13
0

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/

hfossli
  • 22,616
  • 10
  • 116
  • 130