Vertical / Horizontal Scrolling DataGrid for iOS

Vertical / Horizontal Scrolling DataGrid for iOS

Horizontally and vertically scrollable DataGrid for iOS (iPhone / iPad / iPod support) with ability to reorder columns via user interaction. Supports custom headers/cells. Handles big datasets maintaining low memory consumption and fast speed.

Display grid based data on the iPad, iPhone and iPod Touch devices. Usage is simple and is similar to usage of UITableView which most developers know well.

Unlike the iPad, the iPhone and the iPod have smaller screens - this component has a combination of two great features to help with the smaller form factor: horizontal scrolling and columns dragging.

The user will be able to easily arrange columns so that the most important data is shown in first 2-3 columns which are usually visible even on the iPhone.

alt text

Features:

  • Supports vertical and horizontal scrolling
  • Reordering of columns via user interaction
  • Custom column headers
  • Custom cells
  • Column headers remains on top when you vertically scroll data
  • Variable column width and row height
  • Compatible with iPhone/iPod touch and iPad
  • Supports iOS 4 and higher
  • Supports ARC
  • Low memory consumption
Hide

Getting Started

  1. Extract files from zip archive.
  2. Open your project.
  3. In project tree right-click at your project root. Choose Add Files to your project. Select EXDataGridFramework folder. Select "Copy items into destination group folders" option and choose "Create group for any added folders".
  4. If you are using ARC – go to the project properties and choose Build Phases - Compiled sources. Add -fno-objc-arc to each .m file of DataGrid.
  5. Import “EXDataGrid.h” to your view controller.
  6. Create instance of EXDataGrid class in your loadView: 
 see Initialization section;
  7. Implement at least all required methods from DataGridDelegate protocol: see Delegate implementation section.
Hide

Initialization

EXDataGrid dataGrid = [[EXDataGrid alloc] init];
dataGrid.frame = frame; 
dataGrid.dataGridDelegate = self; //set delegate
[self.view addSubview:dataGrid]; //and add data grid as subview
[dataGrid release]; 
Hide

Implementing methods of delegate

//define number of columns in data grid
- (int)numberOfColumnsInDataGrid:(EXDataGrid*)dataGrid;
{
    return [dataSource count];
}
//define number of rows in each column
- (int)numberOfRowsInDataGrid:(EXDataGrid *)dataGrid
{
    return [[dataSource lastObject] count];
}
//If you want to set different height for different rows 
- (float)dataGrid:(EXDataGrid *)dataGrid heightOfRow:(int)rowNumber
{
    if(rowNumber == 0) {
      return 40;
    } else if (rowNumber == 1) {
      return 50;
    } else {
      return 60;
    }
}

//You can set different width for different columns
(float)dataGrid:(EXDataGrid *)dataGrid widthOfColumn:(int)columnNumber {
    if(columnNumber == 0) {
        return 100;
    } else if (columnNumber == 1) {
        return 110;
    } else {
        return 120;
    }
}
//Customize cell appearance. Inherit you cell from EXDataGridCell class.
- (EXDataGridCell*)dataGrid:(EXDataGrid *)dataGrid cellForColumn:(int)columnNumber row:(int)rowNumber
{
//obtain existing cell
    EXDataGridCell *cell = (EXDataGridCell*)[dataGrid  cellDequeueReusableIdentifier:identifier              forColumn:columnNumber];
    if(!cell)  {
        cell = [[[EXDataGridCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier] autorelease];
    }
    //set data to the each cell
    NSArray *columnData = [dataSource objectAtIndex:columnNumber];
    [cell.textLabel setText:[columnData objectAtIndex:rowNumber]];
    return cell;
}
Hide

Tips:

  • If your data source was changed, call reloadData / reloadColumn / reloadRow depending on what has changed.
  • To drag a column, hold your finger on a header of that column. After short time columns becomes more transparent and you can move it into another location. To select a column, press header of that column.
You need to log-in or create an account
  • Create an account
  • Log-in
Please use your real name.
Activation link will be sent to this address.
Minimum 8 characters
Enter your password again

Clicking this button confirms you read and agreed to the terms of use and privacy policy.

X

Save your watchlist

Fill your details below to receive project updates from your watch list - including new versions, price changes and discounts.

I agree to the terms of use and privacy policy.

3 licenses, starting from From » FREE 14 day money-back guarantee View Licenses
or Get a quote

for customization or integration services

Post a comment

Or enter your name and Email
  • N NeelPal 8 months ago
    also whenever i reload the ExDataGrid.....the horizontal indicator vanishes as well....plss help...tks..!!
  • N NeelPal 8 months ago
    there aint no vertical scroll bar appearing when u scroll down...
  • M Milenko 10 months ago
    Really great stuff. Thank you.