Question

I’m basically trying to achieve the following scrollable layout and am looking for some suggestions as to the best way to achieve it…

Potential solutions might be…

Nesting UITableViews

I have considered having all of the ‘A’ componenets part of a single row in a parent UITableView with rows A1, A2 & A3 in a child UITableView but I’m not sure if this is possible?

Spanning Rows

I am also unsure if its possible to have a single UITableView but have areas within span multiple rows (like you can do in a HTML table for example). Then area A, B, C etc can just be views that span their respective rows.

Any suggestions appreciated.

Answer 1

Thanks for all the replies, I’ve up-voted them because they were helpful however I haven’t accepted them as the answer since I actually implemented a completely different solution to those suggested using a combination of a UIScrollView underneath a UITableView as below. Note there’s no nesting or spanning going on.

The UITableView’s delegate is set to be the UIViewController. The UIScrollView’s delegate is NOT set.

When the user scrolls the UITableView its scrollViewDidScroll method is fired and I am able to scroll the UIScrollView the same amount manually in code as follows…

- (void)scrollViewDidScroll:(UIScrollView *)tableView
{
    [self.scrollView setContentOffset:tableView.contentOffset animated:YES];
}

I have to be a bit clever to calculate (in code) when the page loads the position of the elements in A, B, C etc and the exact height of the scroll view so it matches the UITableView.

Since I am using a standard UITableView for A1, A2, B2, C3 etc I am able to easily control the action when the user selects a row and still get the standard UITableView highlighting for free.

Drawbacks

Swiping/scrolling on the UIScrollView has no effect you have to scroll on the UITableView. I might be able to overcome this by implementing a delegate on the UIScrollView and reacting to its own scrollViewDidScroll method to scroll the UITableView but I’ve yet to try this and I expect they’ll be problems since both methods would be firing at the same time.

Touching/tapping the UIScrollView has no effect. This is fine for my needs however if I wanted to perform some action I could use a UITapGestureRecognizer which I’ve done before. E.g.

UITapGestureRecognizer *tapRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapGestureCaptured:)];
[self.scrollView addGestureRecognizer:tapRecognizer];

- (void)tapGestureCaptured:(UITapGestureRecognizer *)touch
{    
   CGPoint touchPoint=[touch locationInView:scrollView]; 
   // Perform action here. 
}

Hopefully this helps someone. Thanks again.