Quick-Tip: Creating Grid Lines on the IGGridView (Objective-C)

Introduction

As of NucliOS 2013 Volume 1, the IGGridView currently does not support column separator lines. Until we add this feature natively, there's a simple workaround you can use to create gridlines.

Creating the Gridlines

The idea of the work around consists of using the IGGridView's backgroundColor in combination with the columnSpacing and rowSeparatorHeight properties to create a separation between the cells as shown in the above illustration.

UIColor *gridlineColor = [UIColor blackColor];
CGFloat gridlineSeparation = 2.0;
_gridView.backgroundColor = gridlineColor;
_gridView.columnSpacing = gridlineSeparation;
_gridView.rowSeparatorHeight = gridlineSeparation;
_gridView.rowSeparatorColor = gridlineColor;
_gridView.rowHeight = 50;

Using this work around doesn't require the IGGridView to stay in any generic design, you can still take advantage of the great layout functionality. The image below demonstrates this work around on an Excel-like grid.

Download the Example Project

The Xcode project source code for this quick tip can be downloaded by clicking this link. You will need to add the IG.framework to the Xcode project after you install the NucliOS trial.

A much easier to read format of this post is available here.

By Torrey Betts