So far my testing of the new 13.1 controls has gone well. I have spent some time generating our own theme for the grid, derived from the dark theme that is supplied. I cannot see that a property is defined for the header cell or filter cell that would allow you to style the border; this would be very useful.In my case, I would like to create a line to separate the filter cell from the header cell so it doesn't look like a single tall cell since they both bleed together.
If you look in the attached zip file at the attached default.png screenshot you will see it as I have styled it to this point. If you look at the default1.png attachment I have mocked up what I would like to achieve (the single black line separator).I believe this would be a useful feature for many of your customers.Look forward to hearing your thoughts.
Hi,
Out of the box there isn't such a thing as a Filter Row Separator. However, b/c of the extensibility of the grid, you can add it yourself.
@implementation CustomFilterDSH
-(IGGridViewFilterCell *)filterCellForGridView:(IGGridView *)gridView{ IGGridViewFilterCell* cell = [gridView dequeueReusableCellWithIdentifier:@"FilterCell"]; if(cell == nil) { cell = [[IGGridViewFilterCell alloc]initWithReuseIdentifier:@"FilterCell"]; if(gridView.theme != nil && [gridView.theme respondsToSelector:@selector(filterCellBackgroundColor)]) cell.backgroundColor = [gridView.theme filterCellBackgroundColor]; else cell.backgroundColor = [UIColor grayColor]; if(gridView.theme != nil && [gridView.theme respondsToSelector:@selector(filterCellTextFieldColor)]) cell.textField.backgroundColor = [gridView.theme filterCellTextFieldColor]; else cell.textField.backgroundColor = [UIColor whiteColor]; if(gridView.theme != nil && [gridView.theme respondsToSelector:@selector(filterCellTextFieldFont)]) cell.textField.font = [gridView.theme filterCellTextFieldFont]; else cell.textField.font = [UIFont systemFontOfSize:17.0]; if(gridView.theme != nil && [gridView.theme respondsToSelector:@selector(filterCellTextFieldTextColor)]) cell.textField.textColor = [gridView.theme filterCellTextFieldTextColor]; else cell.textField.textColor = [UIColor blackColor]; if(gridView.theme != nil && [gridView.theme respondsToSelector:@selector(filterCellTextFieldCornerRadius)]) cell.textField.layer.cornerRadius = [gridView.theme filterCellTextFieldCornerRadius]; else cell.textField.layer.cornerRadius = 0; UIView* v = [[UIView alloc]initWithFrame:CGRectMake(0, 0, cell.frame.size.width, 2)]; v.backgroundColor = [UIColor blackColor]; v.autoresizingMask = UIViewAutoresizingFlexibleWidth; [cell addSubview:v];
} return cell;}
@end
Basically, what you're going to do is derive fromt he DataSourceHelper that you're using, and override the "filterCellForGridView:" method. Then you'll return a new filter cell, and insert your separator into the cell. Note: b/c you're providing the filter cell, you wont natively get styling on that cell, so you'll have to apply your theme directly to the cell, I've included how to do that in the code snippet i've provided.
I hope this helps.
-SteveZ
Hey Steve,
Thanks for the example - is there any chance it could be posted in c# for monotouch? My Objective-c isnt that good :)
Sure:
public class CustomDataSource :IGGridViewDataSourceHelper { public override IGGridViewFilterCell CreateFilterCell (IGGridView gridView) { IGGridViewFilterCell cell = (IGGridViewFilterCell)gridView.DequeueReusableCell("FilterCell"); if(cell == null) { cell = new IGGridViewFilterCell("FilterCell");
if(gridView.Theme != null && gridView.Theme.RespondsToSelector(new Selector("filterCellBackgroundColor"))) cell.BackgroundColor = gridView.Theme.FilterCellBackgroundColor; else cell.BackgroundColor = UIColor.Gray; if(gridView.Theme != null && gridView.Theme.RespondsToSelector(new Selector("filterCellTextFieldColor"))) cell.TextField.BackgroundColor = gridView.Theme.FilterCellTextFieldColor; else cell.TextField.BackgroundColor = UIColor.White; if(gridView.Theme != null && gridView.Theme.RespondsToSelector(new Selector("filterCellTextFieldFont"))) cell.TextField.Font = gridView.Theme.FilterCellTextFieldFont; else cell.TextField.Font = UIFont.SystemFontOfSize(17); if(gridView.Theme != null && gridView.Theme.RespondsToSelector(new Selector("filterCellTextFieldTextColor"))) cell.TextField.TextColor = gridView.Theme.FilterCellTextFieldTextColor; else cell.TextField.TextColor = UIColor.Black; if(gridView.Theme != null && gridView.Theme.RespondsToSelector(new Selector("filterCellTextFieldCornerRadius"))) cell.TextField.Layer.CornerRadius = gridView.Theme.FilterCellTextFieldCornerRadius; else cell.TextField.Layer.CornerRadius = 0; UIView v = new UIView(new RectangleF(0,0, cell.Frame.Size.Width, 2)); v.BackgroundColor = UIColor.Red; v.AutoresizingMask = UIViewAutoresizing.FlexibleWidth; cell.AddSubview(v); } return cell; } }
Thanks Steve, thats a great help.
Cheers,
Paul