Change color of row programmatically in WatchKit

Question

I'd like to change the color of a row in a WKInterfaceTable if it has been selected. I've done these steps but don't know how I can go further:

override func table(table: WKInterfaceTable, didSelectRowAtIndex rowIndex: Int) {

    let row = tableView.rowControllerAtIndex(rowIndex) as! TableRowObject

}

I hope someone of you guys can help me to do this.

Answer 1

I think you have to set the background colors in Storyboard.

Highly theoretical, never done this myself:

If you have a more dynamic app, your could potentially create two prototype rows and give them ids (Normal, Highlighted). Then use insertRowsAtIndexes(_:) and removeRowsAtIndexes(_:) to "switch" the row against a highlighted one...

Not the best solution, but the only one that comes to mind with WatchKit still being very limited.

Answer 2

You can do this by adding a WKInterfaceGroup to your row controller. Make the group's width and height "relative to container" with a size of 1. This ensures that the group completely fills your row. Then, you can set the background color using the setBackgroundColor: method on WKInterfaceGroup. Add all of the other controls within this new group.

Answer 3

You can change colour as per row selection,

Create IBOutlet of WKInterfaceGroup in rowController and set it to Storyboard with DefaultGroup which is created when you drag Table to storyboard (no need to add new WKInterfaceGroup).

@property (weak, nonatomic) IBOutlet WKInterfaceGroup *rowGroup;

Create a BOOL property to track selection status in rowController.

@property (nonatomic, readwrite) BOOL isSelected;

Add this to didSelectRow,

- (void)table:(WKInterfaceTable *)table didSelectRowAtIndex:(NSInteger)rowIndex {

    TableRowObject *row = [self.interfaceTable rowControllerAtIndex:rowIndex];

    if (row.isSelected) {
        row.isSelected = NO;
        [row.rowGroup setBackgroundColor:[UIColor clearColor]];
    }
    else {
        row.isSelected = YES;
        [row.rowGroup setBackgroundColor:[UIColor blueColor]];
    }
}

Answer 4

@property (weak, nonatomic) IBOutlet WKInterfaceGroup *groupCellContainer;
Create above property in your custom cell for the Group in your cell and connect it with watch interface storyboard.

Add below code in your didSelectRowAtIndex method, this code will set Red background color to selected cell & set Gray color to other cells.
- (void)table:(WKInterfaceTable *)table didSelectRowAtIndex:(NSInteger)rowIndex {
for (int row=0; row < Array.count; row++) {
    CustomCell *customCell = [table rowControllerAtIndex:row];
    if (rowIndex == row) {
        [customCell.groupCellContainer setBackgroundColor:[UIColor redColor]];
    } else {
        [customCell.groupCellContainer setBackgroundColor:[UIColor grayColor]];
    }
}

}