Viewing a table with lockable columns and horizontal scrolling?

Question

I want to create a table with the following functions:

• Variable number of columns that scroll horizontally with the rest of the table
• Variable number of locked columns that do not scroll horizontally with the rest of the table
• Sortable column headers
• Vertical scrolling
• Horizontal scrolling

I have seen people use different strategies to perform similar functions, including:

• A UITableview with each cell in the table containing a 90-degree converted UITableview located inside another UIScrollview to handle horizontal scrolling. For this, however, I will need to use locked rotated tables for each cell, and it seems that there will be some fun with cell de-synchronization if I wanted to scroll through the entire main table instead of the table in each table cell.
• Option number one, but using a custom uiview instead of a uitableview for each table. (lead candidate so far)
• A custom UIScrollview class that replicates UITableview functionality with additional features such as MDSpreadView . It seems that the most flexible and difficult to implement.

Does anyone have any examples / recommendations / recommendations regarding what to see that will be easy enough to get up and work, excellent scroll performance and flexibility.

I am still at the planning stage, trying to figure out how best to do this, and so far have formulated some ideas that consist of two uitableviews with synchronized scrolling. The left view of the table will be used for locked columns, and the right table will be used for the horizontal scroll table. Both tables will use the same uiviews as tablecells with custom uiview objects for each column.

UPDATE

It seems pretty straightforward to be able to synchronize scrolling between locked columns and horizontal scrollable tables, and still this is apparently the option I'm leaning towards (# 2 above). Does anyone see any potential traps or roadblocks with this approach?

A great example of the desired finished product, which I can then find in the Roambi application (screenshot below)

thanks

Answer 1

I did this in one of my applications - see MDSpreadView . Its delegate / data source calls are similar to a UITableView.

Answer 2

I achieved this with three views controlled by standard protocols and one view controller. In this solution, you only need to link the vertical scroll of the two table view controllers. Horizontal scrolling is provided free of charge through a scroll view wrapping the body of the table view. I use the following UITableViewDelegate function to get locked column headers:

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section; 

Presentation Structure :

 - View - The VCs root view - Table View - rowHeadersTable - the locked left hand columns - Scroll View - rowBodyHorizontalScrollView - a container of the table body - Table View - rowBodyVerticalContentTableView - the table body, as wide as it needs to be beyond the frame of the parent scroll view 

View controller :

Implemented Protocols:

 @interface LockedTableColumnsViewController : UIViewController <UITableViewDataSource,UITableViewDelegate> 

Setup:

 - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. [self.rowHeadersTable setDataSource:self]; [self.rowHeadersTable setDelegate:self]; [self.rowBodyVerticalContentTableView setDataSource:self]; [self.rowBodyVerticalContentTableView setDelegate:self]; } -(void)viewDidAppear:(BOOL)animated { // This ensures the scroll view can only scroll horizontally, and adapts to the size of its member content [self.rowBodyHorizontalScrollView setContentSize:self.rowBodyVerticalContentTableView.frame.size]; // Important to do this here rather than viewDidLoad, because we want a final reading on self.rowBodyVerticalContentTableView.frame.size [super viewDidAppear:animated]; } // Do your Table Data Source however you choose 

Controlling the vertical scroll binding between rowHeadersTable and rowBodyVerticalContentTableView:

 -(void)scrollViewDidScroll:(UIScrollView *)scrollView { if (scrollView == self.rowBodyVerticalContentTableView) { [self.rowHeadersTable setContentOffset:CGPointMake(self.rowHeadersTable.contentOffset.x, scrollView.contentOffset.y)]; } else if (scrollView == self.rowHeadersTable) { [self.rowBodyVerticalContentTableView setContentOffset:CGPointMake(self.rowBodyVerticalContentTableView.contentOffset.x, scrollView.contentOffset.y)]; } } 

NB This will work well for long (i.e. tall) tables, as it uses prototype cells, etc. However, it is not optimized for horizontally intensive row content. The contents of my table body are text and a finite number of columns. If you don’t have such luxury, you can always make the table body in the form of a horizontal stream, but then you have to bind all the offsets of the row collection view (through the visible cells, I think). This whole other animal. Good luck

Answer 3

If your target OS is older than iOS 6.0, you can use the nested table ads declaration described here . Remember to synchronize the offset content of each horizontal table.

But if you are targeting iOS 6.0+, you can use MMSpreadsheetView , but its performance is very poor, and you are not allowed to set different sizes for its columns.

The best option you have is to write your own UICollectionView layout.