UITableViewCell subclassing optimization - iphone

If i do a custom cell, is it best practice to...
put icons and labels all on one view and drop it to the contentView (assuming you want everything to shift in edit mode)
or
put all editable stuff (labels) on one view, and non editable (icons) on another view and drop them to the contentView
or
it doesn't matter because when the label text changes it redraws everything anyway ?
And part2... if I'm doing transparent background (I know, big performance hit)... and I'm using png icons with soft edges (same one for every cell)... would it be that much of a difference if I create a blur on the dynamic text as well ? -I'm not sure if the performance hit is due to the animating of transparencies or the drawing of the cell initially.
Any insight/suggestions ?

The more transparencies you have and the more alpha blending that has to happen the worse off you are. For simple cells it's fine to just throw subviews in, but for complex ones you'll want to create a custom contentView that does most of its own drawing programatically in drawRect rather than depending on the UIView drawing code. Paint the UIImages directly and just draw the text strings yourself. It's a little extra work but it will perform a lot better.

Related

Pinterest Gridview implementation on iOS

I want to implement a grid view like the one in Pinterest
I thought about implementing as 3 table views. But I was not able to scroll them together well. When I implemented the scrollViewDidScroll and set the contentOffset for the table views other the scrollView , the scrolling became slow and unusable.
Another implementation I did was of was having a set of images to load and calling the viewDraw function in scrollViewDidScroll. The ViewDraw function just draws the necessary images and removes the rest of the images from the memory which were already drawn but wont be visible .
this too makes the ScrollView scrolling slow. And another issue with it is that there are white(background color) patches before the images are drawn.
What should be the best way to implement this grid view ?
Solution 1 (i don't know if this works and I don't like it very much)
How about having 3 vertical table views side by side, but forward any touch events from any tableview to the other ones. I understand that you had performance problems when trying to sync the tableviews, but maybe working on an event level things would work better. Maybe.
Solution 2
Use a UIScrollView (for the scrolling purposes of course). For performance and memory reasons you also need to implement a load-on-demand mechanism so that you don't load all your images at once.
To do this I would create a class, CustomImageStrip that handles a vertical image list. This class works together with the scrollview and uses contentOffset to decide when it is time to load/unload a image from the strip.
By having 3 independent image strip classes, the images can be of any size and don't need to be aligned. But, since they all belong to the same UIScrollView the scrolling will be done simultaneously.

How Can I Recreate This UITableView Look?

Right now I have a standard UITableView that is empty by default and the user can add cells to it.
I noticed this app starts with no cells and is empty (like you cant see lines) but my standard view always has the lines like standard table view.
I thought it may be a grouped table style but the edges are not curved like the grouped style is.
Does anyone have any ideas?
The lines between cells are controlled by the separatorStyle property of your tableView. To remove the lines simply set:
tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
Your other options are UITableViewCellSeparatorStyleSingleLine and UITableViewCellSeparatorStyleSingleLineEtched.
You can hide the separator lines by setting their color to the same color as your background, e.g.
tableView.separatorColor = [myApp theColorOfMyBackground]; // A UIColor object
Make sense?
The cells in your picture are likely custom cells, but you didn't really ask about that. :-)
EDIT: As noted in another answer seperatorStyle can be used to simply "turn off" the lines. That's a better way to do it.
This is a good question. +1 What app is this? Does the view you show above actually "scroll" even though only 2 rows are showing? I am wondering if it is a truly a table view. It could be a series of UIViews added to a UIScrollView with a dark background.
Assuming the programmer knows how tall the "rows" are, then they can add them with a pixel spacing over the charcoal background. With the UIScrollView, the programmer can define the contentSize.
If more views were added to extend past off the screen and the contentSize was appropriately defined, the USScrollView would automatically allow scrolling at that point.
Selecting a "row" could be easily handled by UIGesture controls on each UIView.
*EDIT
After seeing the app, Delivery by JuneCload, it is definitely using a UITableView with custom cell views. As Mark and Matt have answered.

UIScrollView - how to draw content on demand?

I want to create a scroll view with a massive contentSize that will display content inside it. The content will be mostly text (a few small images will be drawn for content-boundaries).
So, think like a tiled map application, but tiling labels instead of tiled images.
Performance is critical in this application, so I think I should avoid using UILabels or any UIViews at all inside the scroll view.
How can I draw these labels as the user scrolls around? Some options I've considered:
override drawRect: in the scroll view and draw everything within the window - this seems like it would be really slow. Sometimes drawRect is called with only a 1 pixel difference.
Same, but keep track of which ones I've already drawn
Draw them from the "outside" somehow, like from the scroll view delegate - I can't figure out how to use [#"mystring" drawInRect:] outside of drawRect: (context problems)
Is there something I haven't thought of? I know the scroll views were designed to be able to handle this kind of problem, but I'm not sure what the designed way is. Thanks!
The standard way to achieve this in an iPhone application is to create a normal UIScrollView that is the size you want it to be, and to populate it either directly with a CATiledLayer if you're feeling brave or with a custom UIView subclass that uses a CATiledLayer and implements - (void)drawLayer:(CALayer*)layer inContext:(CGContextRef)context.
CATiledLayer provides the same experience as Safari — it's good for views that are much larger than the screen and which are expensive to render, but which you don't want to ruin the fluidity of the user experience. It'll request tiles as and when it needs them on a background thread, then fade them in (according to a fade of any length, so you can cause them to appear instantly if you desire) when they're ready. If your program really can always keep up with the scrolling and you've requested an instant appearance then there'll be no evidence that there's an asynchronous step involved.
An example people tend to point to is this one, but if you're new to implementing your own UIView subclasses then it might be worth seeing e.g. this tutorial. Then look into the + layerClass property on UIView and the various properties of CATiledLayer (which I think you'll also possibly need to subclass since + fadeDuration is a class method).

UITableViewController custom cell scrolling performance

So I have a UITableViewController. The cells in this tableview have the following UIControls:
2 UILabels, one of which has a shadow and a clearColor background color.
1 Custom Progress view resized to be larger and with a different color
3 UIButtons
Functionally, they do exactly what they are supposed to do. However, I've noticed when looking at it on device that scrolling performance quickly tanks and has dropped frames all over the place, even with other interactions like pushing one of the buttons.
So I was reading around today and found http://blog.atebits.com/2008/12/fast-scrolling-in-tweetie-with-uitableview/ this article by the Tweetie guy about how to achieve fast scrolling performance by subclassing UITableViewCell and doing the drawing yourself.
The example works extremely well, but when I tried to adapt it to work with my desired configuration I realized that he isn't using any predefined UI Controls, he's mapping out everything by hand.
While I can see how this would be an extremely efficient way to do things, it strikes me as problematic for things like the progress view and the buttons, and even one of my labels to a certain extent.
So my question is this: Do I need to completely write my controls from scratch if I want my scrolling performance to be good, or is there a way to use the standard UI Controls and get good scrolling performance?
If you're adding custom controls to your cell, you should still be subclassing UITableViewCell, adding your controls in the init function, laying them out in layoutSubviews, etc. - just like any other view. As VdesmedT says, make sure you're re-using cells via the dequeue mechanism, so that you aren't allocating new cells with each scrolling operation.
OK, I will propose something obvious but to achieve UIScrollView performance, you need to be sure that the dequeue mechanism works well. I often see developers not properly set the identifier in IB and therefore missing the UITableViewCell cache benefit

How to increase the scrolling performance in my table view with images in iphone?

I am new to iPhone development. I am parsing a xml and display the title, date, contents and image in the cell. Now the scrolling is not smooth, it is stuck.
How can I increase it? I have already applied lazy loading in another view, I am not able to apply in the new view. So how can I increase the scrolling performance? Can I check for any condition that if image is already loaded in the image view, so I can stop once again the loading of image view?
What I do to guarantee fast scrolling in a table is to subclass my own UITableViewCell where I implement all properties that I need.
Whenever that tablecell is initialized I draw the properties of the cell on the cell itself. So when you need an image on there, dont use an UIImageView, but just draw the image on the cell. Also all the text I need I just draw on there.
After a long stuggle finding out how to do all this, I also found a nice blog post about this.
http://blog.atebits.com/2008/12/fast-scrolling-in-tweetie-with-uitableview/
First of all, check if you're not resizing the images - that takes a lot of computing power, and will slow down the table for sure.
Second of all, check for view hierarchy - complicated view hierarchy means bad performance. Rembemer to use as much opaque views as possible, and when you're using non-opaque views don't make the cells too complex(by complex Apple means three or more custom views). If the views are too complex - use drawRect method for custom drawing of the content.
There's a great example on how to achieve this provided by Apple called AdvancedTableViewCell (here's a link), and there's a great tutorial by Apple about table view cells (another link).