Setting Up Cell Border Styles

Operating system requirements: iOS 5.0 or later.

Mobile device: iPad.

Description

This example describes application of styles for top, right, left and bottom table cell borders. After starting the example the following operations are executed:

Color for all cell borders is set and removed.
Line thickness for all cell borders is set.
Line style for all cell borders is set and removed.

Source Code

Executing the example requires to place the following code in the body of the executeExample method of the ViewController class (see the Creating a Simple Data Grid section):

// Determine style for other table cells
NuGridCellStyle *cellStyle = [NuGridCellStyle deafultStyle];
// Determine style for bottom border of other table cells
[cellStyle setBottomBorderWidth:3];
NSArray *dashValuesArray = @[@3, @0, @3]; // Dash-dotted line
[cellStyle setBottomBorderDash:dashValuesArray];
[cellStyle setBottomBorderColor:[UIColor redColor]]; // Red line
// Determine style for right border of other table cells
[cellStyle setRightBorderWidth: 3];
NSArray *rightBorderDashValuesArray = @[@5]; // Dash-dotted line
[cellStyle setRightBorderDash: rightBorderDashValuesArray];
[cellStyle setRightBorderColor: [UIColor purpleColor]]; // Purple line
// Create a default style for table row and column headers
NuGridCellStyle *headerStyle = [NuGridCellStyle deafultStyle];
// Determine style for cell top border in row and column headers
[headerStyle setTopBorderWidth:4];
NSArray *columnTopBorderDashValuesArray = @[@5, @5]; // Dash-dotted line
[headerStyle setTopBorderDash:columnTopBorderDashValuesArray];
[headerStyle setTopBorderColor:[UIColor greenColor]]; // Green line
// Determine style for left cell border in row and column headers
[headerStyle setLeftBorderWidth:4];
NSArray *columnLeftBorderDashValuesArray = @[@2, @5]; // Dash-dotted line
[headerStyle setLeftBorderDash:columnLeftBorderDashValuesArray];
[headerStyle setLeftBorderColor:[UIColor orangeColor]]; // Orange line
// Set styles for table columns and column headers
for(int i = 0; i < [datasource gridViewColumnCount:[contr gridView]]; i++) {
    [proxyDatasource gridView:[contr gridView] setStyle:cellStyle forColumn:i];
    [proxyDatasource gridView:[contr gridView] setStyle:headerStyle forHeaderForColumn:i];
}

After executing the example line color, thickness and style are set for top, right, left and bottom cell borders:

Then remove line style settings and table cell border width settings by adding the following code to the example:

// Remove cell border width settings
[headerStyle removeTopBorderWidth];
[headerStyle removeLeftBorderWidth];
[cellStyle removeBottomBorderWidth];
[cellStyle removeRightBorderWidth];
// Remove cell border line style settings
[headerStyle removeTopBorderDash];
[headerStyle removeLeftBorderDash];
[cellStyle removeBottomBorderDash];
[cellStyle removeRightBorderDash];

After executing the example the specified settings of line styles and cell borders are removed:

The remove table cell border color settings:

[headerStyle removeTopBorderColor];
[headerStyle removeLeftBorderColor];
[cellStyle removeBottomBorderColor];
[cellStyle removeRightBorderColor];

After executing the example the specified cell border colors are removed: