[ShinobiGrids] Unwanted 1 pixel line above header and first row



There is two weird red lines above the header and above the first row of Shinobi Grids. They appear when I set a transparent color as background of header and row cells.

Above the header there is some dots in the center, I think its a text. Above the first row I got rid of the dots using:

-(NSString *)shinobiDataGrid:(ShinobiDataGrid *)grid titleForHeaderInSection:(NSInteger)section {
    return @"";

How can I get rid of these lines?

I am using: iOS 7, ShinobiGrids 2.5.2


Hi again,

I tried to change the sectionHeaderStyle in my data grid and it did not work and after some attemps I found solution:

-(void)hideSGridSectionHeader:(UIView*)view {
    if([NSStringFromClass([view class]) isEqualToString:@"SGridSectionHeader"] && CGRectGetHeight([view frame]) == 0.5){
        [view setAlpha:0];
    for (UIView * v in [view subviews]) {
        [self hideSGridSectionHeader:v];

-(void)didFinishLayingOutShinobiDataGrid:(ShinobiDataGrid *)grid {
    [self hideSGridSectionHeader:grid];
        [self requestDataSeries];
        _shouldRequestData = NO;

I don’t think its a good solution, because the lines first appear and then disappear, and because there is no way to directly access this view that I want to hide.

Both line are SGridSectionHeader and are 0.5 pixel height. One of the has the text Headers inside it.

I hope some one has a better solution for that  :laughing:


Greetings Program!

Are you running it in the simulator?

I get the small dots along the bottom edge of the header as well (no red line) on my iPad running iOS6. The iOS7 version of my app gives me the red line as well as the dots but only when running in the simulator. They do not show up when I run it on an iPad running iOS7.



Forgot to mention; the dots and line on the simulator disappear once the grid is populated.



Hi Wg,

I get the dots and the red line in the simulator and in the iPad and I only manage to get rid of them with the code I mention above. They show only if I use a transparent background in the cells. 


It’s strange you have to resort to such a workaround.

In the GettingStarted sample app, I commented out the datasource to return an empty grid and got the same result as my previous post (shows in simulator but not on device).

// create some data to populate the grid
    //_data = [PersonDataSource generatePeople:50];

Are you able to post your code for creating the grid? Maybe we can narrow it down.



Hi Wg,

here is the code that creates the grid and the theme implementation.  I did not copy the delegate implementation because its a simple value lookup in an array of dictionaries. _optionsScriptObject is a JSON that has my columns definitions and it behaves like a dictionary.

Maybe the problem is in the [[grid layer] setBorderWidth:0]; line?? I did not find another way to clear the borders.

I hope it helps :slight_smile:

_shinobiDataGrid = [[ShinobiDataGrid alloc] initWithFrame:CGRectMake(CGRectGetMinX(frame),
    [_shinobiDataGrid setDelegate:self];
    [_shinobiDataGrid setDataSource:self];
    [[grid layer] setBorderWidth:0];
    [grid applyTheme:[DashboardDataGridTheme instance]];
    NSArray * columns = [_optionsScriptObject valueForKey:@"columns"];
        NSNumber * width = @(CGRectGetWidth(frame) / [columns count]);
        for (NSInteger i = 0; i < [columns count]; i++) {
            NSDictionary * column = [columns[i] dictionaryWithValues];
            [_columns addObject:column];
            SDataGridColumn * dataGridColumn = [SDataGridColumn columnWithTitle:[column valueForKey:@"name"]];
            [dataGridColumn setEditable:NO];
            [dataGridColumn setWidth:width];
            [dataGridColumn setHeaderCellType:[SDataGridHeaderCell class]];
            [dataGridColumn setCellType:[SDataGridMultiLineTextCell class]];
            NSNumber * sortable = [column valueForKey:@"sortable"];
            if(sortable && [sortable boolValue]){
                [dataGridColumn setSortMode:SDataGridColumnSortModeTriState];
            [_shinobiDataGrid addColumn:dataGridColumn];
    [[self view] addSubview:_shinobiDataGrid];

#import "DashboardDataGridTheme.h"
#import "Constants.h"
#define DEFAULT_FONT [UIFont fontWithName:@"AvenirNext-Medium" size:14] 
#define DEFAULT_BLUE_40 [UIColor colorWithRed:28.0/255.0 green:52.0/255.0 blue:77.0/255.0 alpha:0.4] 
static DashboardDataGridTheme * _instance;
@implementation DashboardDataGridTheme
@synthesize defaultHeaderRowHeight = _defaultHeaderRowHeight;
@synthesize defaultRowHeight = _defaultRowHeight;
+(DashboardDataGridTheme *)instance {
        _instance = [DashboardDataGridTheme new];
    return _instance;
-(id)init {
    self = [super init];
        [self initStyles];
    return self;
-(void) initStyles {
    [self setHeaderRowStyle:[[SDataGridCellStyle alloc] initWithBackgroundColor:DEFAULT_BLUE_40
                                                                  withTextColor:[UIColor whiteColor]
                                                                       withFont:[DEFAULT_FONT fontWithSize:14.0]]];
    [self setRowStyle:[[SDataGridCellStyle alloc] initWithBackgroundColor:DEFAULT_BLUE_40
                                                            withTextColor:[UIColor whiteColor]
                                                                 withFont:[DEFAULT_FONT fontWithSize:14.0]]];
    [self setSectionHeaderStyle:[[SDataGridSectionHeaderStyle alloc] initWithHeight:0 withBackgroundColor:[UIColor clearColor]]];
    [self setAlternateRowStyle:[self rowStyle]];
    [self setSelectedCellStyle:[self rowStyle]];
    _defaultHeaderRowHeight = @44.0;
    _defaultRowHeight = @44.0;
    [self setIOS7Arrows:YES];
    [self setGridLineStyle:[[SDataGridLineStyle alloc] initWithWidth:1.0 withColor:[UIColor clearColor]]];
    [self setHideVerticalGridlines:YES];


Are you running the app in a non-portrait orientation?

I created a project from scratch and added your code and the result was the same - shows on simulator but not on device.

Then I put down the iPad and the orientation changes (something my app or the GettingStarted app do not do) and the line and dots appeared. As soon as I changed orientation back to portrait, the line and dots disappeared.

On the device, the effect occurs only on Upside Down and Landscape Left orientation.

On the Simulator, the effect occurs only on Portrait and Landscape Left orientation.

I enabled the orientation on the GettingStarted app and my app with  with the same result.



Hi all,

This is a bug in the Grids framework. We have fixed it in the latest version, which we’re planning on releasing either this week or next week. Once the new version of the framework is out, we will let you know.

Many thanks,