[Solved] Custom TKSideDrawerTableViewCell with separator support

[Mathieu]

Hi,

I want to add a different background color to the item in the side drawer which is currently selected. For that purpose, I added the following delegate implementation:

- (TKSideDrawerTableViewCell *)sideDrawer:(TKSideDrawer *)sideDrawer cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    TKSideDrawerSection *section = sideDrawer.sections[indexPath.section];
    TKSideDrawerItem *item = section.items[indexPath.item];
    TKSideDrawerTableViewCell *cell = [[TKSideDrawerTableViewCell alloc] init];
    cell.item = item;
    cell.selectedBackgroundView = [[UIView alloc] init];
    cell.selectedBackgroundView.backgroundColor = [UIColor colorWith...];
    cell.selectionStyle = UITableViewCellSelectionStyleGray;
    return cell;
}

which works almost fine.

The problem is that in this case, the separator styling is no longer applied to the cells (e.g. item.style.separatorColor is ignored). How do I have to setup the TKSideDrawerTableviewCell so that it still respects the separator styling?

A second, related question: Is there any non-hacky way to set the initially selected item (read: send a [tableView selectRowAtIndexPath...] to the TKSideDrawerTableView)?

[Adrian]

Hello Mathieu,

Thank you for contacting us.

1. To change the background color of a cell in TKSideDrawer  you should subclass TKSideDrawerTableViewCell and implement its setSelected:animated: method. If you need separator you should set its frame in the layoutSubviews method. Please consider the code snippet below:

@implementation MyCell

- (void)layoutSubviews
{
    [super layoutSubviews];
    self.separator.frame = CGRectMake(0, self.frame.size.height - 0.5, self.frame.size.width, 0.5);
}

- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
    [super setSelected:selected animated:animated];
    if (selected) {
        self.item.style.fill = [TKSolidFill solidFillWithColor:[UIColor colorWithRed:1 green:0 blue:0 alpha:0.5]];
    }
    else {
        self.item.style.fill = nil;
    }
    [self setNeedsDisplay];
}

@end

Then you should use this cell in your TKSideDrawerDelegate implementation:

- (TKSideDrawerTableViewCell *)sideDrawer:(TKSideDrawer *)sideDrawer cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    TKSideDrawerSection *section = sideDrawer.sections[indexPath.section];
    TKSideDrawerItem *item = section.items[indexPath.item];
    MyCell *cell = [[MyCell alloc] init];
    cell.item = item;
    return cell;
}

2. Currently to select an item in TKSideDrawer programmatically you should use the selectRowAtIndexPath:animated:scrollPosition method of TKSideDrawerTableView. However it is reasonable suggestion to provide an API for achieving such scenario. I logged this in our feedback portal, where you could follow its status and updated your Telerik points accordingly.

I hope this helps. Should you have further questions, do not hesitate to contact us.

Regards,
Adrian
Telerik

[joao]

How can we programmatically select a row if not explicitly implementing TKSideDrawerTableView. (just using TKSideDrawer with sections and items..)

 

Thank you in advance.

[Adrian]

Hello, Joao,

To select an item in TKSideDrawer programmatically you should use TKSideDrawer's selectItemAtIndexPath: method. Consider the code below:

[_sideDrawer selectItemAtIndexPath:[NSIndexPath indexPathForItem:2 inSection:0 ]];

I hope this helps. If you need further assistance, do not hesitate to contact us.

Regards,
Adrian
Telerik

[joao]

Thank you Adrian,

 

Sorry but forgot to mention that I'm using xamarin. check the attachement to see that i have no such method..

 

Best regards

[Adrian]

Hi, Joao,

Indeed the selectItemAtIndexPath: method is not included in Xamarin.iOS wrappers. The wrappers will be updated and a new version will be available by the end of the month. I hope this timeframe is OK for you.
If you need further assistance, do not hesitate to contact us.

Regards,

Adrian
Telerik