Sluggish scrolling experience when using QuartzCore to round corners on UIImageView's within a UITableViewCell

放肆的年华 提交于 2019-12-06 04:01:20

问题


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.


回答1:


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




回答2:


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).




回答3:


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.




回答4:


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.




回答5:


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)

 }


来源:https://stackoverflow.com/questions/5699135/sluggish-scrolling-experience-when-using-quartzcore-to-round-corners-on-uiimagev

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!