5

I use QuartzCore to add rounded corners to my UIImageView's within the cells of my UITableView

This is the code that I use:

fooImageView.layer.cornerRadius = 9.0;
fooImageView.layer.masksToBounds = YES;
fooImageView.layer.borderWidth = 1.0;

The problem is that when I add this code. The table cells movement is slowed down dramatically. I'm just wondering whether there are other alternatives to make the user experience much faster and to increase performance when scrolling a table view cell using this technique?

I see a lot of applications (most Twitter apps) that have no performance decrease when having rounded corners applied to images within their cells. Just wondering how they overcome the "sluggishness"?

Thanks for your help.

Cezar
  • 55,636
  • 19
  • 86
  • 87
gotnull
  • 26,454
  • 22
  • 137
  • 203

5 Answers5

15

The first thing I would try doing is setting:

fooImageView.layer.shouldRasterize = YES;

This renders the rounded corner effect as a bitmap. I had some similar issues when using CALayer effects on views in a UIScrollView a while back, and this setting drastically improved performance.

Don't forget to set

fooImageView.layer.rasterizationScale = [[UIScreen mainScreen] scale];

to prevent pixelation (rasterization at the wrong resolution for the device).

Community
  • 1
  • 1
Stuart
  • 36,683
  • 19
  • 101
  • 139
5

there are 3 main techniques for improving UITableView performance that I use:

  1. Always reuse cells, use the dequeuereusablecellwithidentifier when creating new cells. This prevents the overhead of the OS creating and destroying lots of objects when scrolling fast.

  2. Collapse the view hierarchy of the cell. Instead of having lots of views and subviews, create a custom view and do all your cell drawing in the drawRect. Apps like Twitter use this approach for super fast cell drawing.

  3. Ensure your images are opaque. You can do this by ensuring all image assets don't have alpha channels baked into them and by setting the layer's opaque property to YES.

Examples:

In the cellForRowAtIndexPath (the table identifier string simply creates a reference to cells that are the same type and can be anything you like):

static NSString *SimpleTableIdentifier = @"SimpleTableIdentifier";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier: SimpleTableIdentifier];
// Create a new cell if necessary
if (cell == nil) {
    cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:SimpleTableIdentifier] autorelease];
}

Check out the following link for examples of improving performance of UITableViews: http://developer.apple.com/library/ios/#samplecode/TableViewSuite/Introduction/Intro.html%23//apple_ref/doc/uid/DTS40007318-Intro-DontLinkElementID_2

Hope this helps,

Dave

Magic Bullet Dave
  • 9,006
  • 10
  • 51
  • 81
  • Thanks for this answer. Are you able to provide examples on dequeuereusablecellwithidentifier? Also are you able to elaborate on the cell drawing in drawRect? – gotnull Apr 18 '11 at 07:32
  • 1
    @Fulvio No problem, some examples edited into the post above. To track down opacity performance issues you can run your code under instruments and use the CoreAnimation instrument. This will colour areas of your cell in red that are performing poorly. Cheers Dave. – Magic Bullet Dave Apr 18 '11 at 07:47
  • Thanks for the code example. It's exactly how I construct my cellForRowAtIndexPath in the first place. So I'm good there. I will check out the sample code you've provided and look at other alternatives. – gotnull Apr 18 '11 at 23:04
2

You could do some masking. Overlaying the images with a mask-image that has a rounded corners square cut out from it and it will work like a charm.

Also be sure to use reuseCellIdentifier otherwise the table will lag if it gets even a little complex.

Stefan Ticu
  • 2,093
  • 1
  • 12
  • 21
1

Short answer: set cells opaque and draw them yourself.

Follow the advice by StuDave and Magic Bullet, and see also Fast Scrolling in Tweetie with UITableView by the author of the official Twitter client ot learn how to do cell drawing. It's a simple and clear example project.

Beyond solving this specific issue, you should read UITableView construction, drawing and management (revisited) by Matt Gallagher to learn how to write custom table controllers and cells. This not only improves the performance of your code, it lets you do things which are not possible with the standard classes from Apple. Basically you will create an UIViewController that replicates key methods of the UITableViewController.

Jano
  • 62,815
  • 21
  • 164
  • 192
  • link is dead :( any way to retrieve it somehow? – matm Apr 20 '12 at 08:50
  • http://web.archive.org/web/20100322222950/http://blog.atebits.com/2008/12/fast-scrolling-in-tweetie-with-uitableview/ https://github.com/enormego/ABTableViewCell – Jano Apr 20 '12 at 10:13
0

In my case it added endless subviews and the table view slowed down dramatically exactly as you said. I added this logic in willDisplayCell to fix the problem: 

if cell.contentView.subviews.count < 3 /* elements in cell + subviews */  { 

        cell.contentView.addSubview(subView)
        cell.contentView.sendSubviewToBack(subView)

 }
SteffenK
  • 582
  • 6
  • 17