Optimizing drawing on UITableViewCell
- by Brian
I am drawing content to a UITableViewCell and it is working well, but I'm trying to understand if there is a better way of doing this.
Each cell has the following components:
Thumbnail on the left side - could come from server so it is loaded async
Title String - variable length so each cell could be different height
Timestamp String
Gradient background - the gradient goes from the top of the cell to the bottom and is semi-transparent so that background colors shine through with a gloss
It currently works well. The drawing occurs as follows:
UITableViewController inits/reuses a cell, sets needed data, and calls
[cell setNeedsDisplay]
The cell has a CALayer for the thumbnail - thumbnailLayer
In the cell's drawRect it draws the gradient background and the two strings
The cell's drawRect it then calls setIcon - which gets the thumbnail and sets the image as the contents of the thumbnailLayer. If the image is not found locally, it sets a loading image as the contents of the thumbnailLayer and asynchronously gets the thumbnail. Once the thumbnail is received, it is reset by calling setIcon again & resets the thumbnailLayer.contents
This all currently works, but using Instruments I see that the thumbnail is compositing with the gradient. I have tried the following to fix this:
setting the cell's backgroundView to a view whose drawRect would draw the gradient so that the cell's drawRect could draw the thumbnail and using setNeedsDisplayInRect would allow me to only redraw the thumbnail after it loaded --- but this resulted in the backgroundView's drawing (gradient) covering the cell's drawing (text).
I would just draw the thumbnail in the cell's drawRect, but when setNeedsDisplay is called, drawRect will just overlap another image and the loading image may show through. I would clear the rect, but then I would have to redraw the gradient.
I would try to draw the gradient in a CAGradientLayer and store a reference to it, so I can quickly redraw it, but I figured I'd have to redraw the gradient if the cell's height changes.
Any ideas? I'm sure I'm missing something so any help would be great.
