iPhone: Custom DataGrid View, Subclass UITableView, or other?

Question

I would like to create a data grid that scrolls both vertically and horizontally and has sticky row and column headers (so you can scroll the data while still viewing the row/column headers). What is the best way of doing this?

I've considered creating my own custom DataGrid view that handles its own rendering, but this seems like a lot of work. It seems like adding multiple UITableViews to a UIScrollView might work, but I don't know how to make the first row and column sticky while scrolling the rest of them together. Or perhaps I could subclass UITableView and add columns to it.

For an example of something similar to what I'm looking for, see http://www.roambi.com/. Click on the SuperList example and play around with the view there.

I have successfully recreated the effect I'm looking for in a UIWebView with a plain HTML table, custom JavaScript, and CSS, but performance on the iPhone is terrible using this method.

Answer 1

I don't think subclassing UITableView is a good match for your requirements. But you could replicate the design patterns UITableView uses. This would simplify both development and usage of your view.

I would go about it along these lines:

• Declare DataGridViewDelegate and DataGridViewDatasource protocols that mimic their UITableView counterparts.
• DataGridView is a UIScrollView subclass. It has two ivars delegate and datasource.
• DataGridViewCell is a UIView subclass similar to UITableViewCell.
• A category on NSIndexPath similar NSIndexPath(UITableView) that makes it easy to use index paths to address rows, columns, and (optionally, if you want to implement them) sections.
• DataGridView calls the datasource methods numberOfRowsInDataGridView: and numberOfColsInDataGridView: and the delegate methods heightForCellAtIndexPath: and widthForCellAtIndexPath: (or, if not implemented, uses default cellWidth and cellHeight properties) to calculate the size of the grid and set the scroll views contentSize property.
• When DataGridView needs to display itself or when it is scrolled, call the datasource method dataGridView:cellAtIndexPath: to get the subview for each cell to be displayed. Add these as subviews. Implement a cell reuse system like UITableView.
• ...

This might sound like a lot of work but I think it is feasible. I am not quite sure how to best implement the fixed (non-scrolling) header rows/cols.

Answer 2

This might suit your needs, it is well made: https://github.com/AlanQuatermain/AQGridView

Answer 3

Another alternative might be this iOS data grid component - it is not free, but quite full featured, such as animated row deletion and borders / colors customization.

Answer 4

I just answered a question like this one - there are a few more options that I found:

https://github.com/AlanQuatermain/AQGridView (Free)

http://ioscomponents.com/Home/Products (Commercial - lots of features 29 USD)

https://www.developergarden.com/en/marketplace/components/details/cmp/ios-data-grid-table-view (commercial 129 USD)

http://www.binpress.com/app/vertical-horizontal-scrolling-datagrid-for-ios/1082 (Commercial)