《Apple Watch 开发》WKInterfaceTable 列表控件小结

目标结果截图：

目前 watch OS 2.0 开放的接口非常有限

WKinterfaceTable 类包含的接口：

- (void)setRowTypes:(NSArray<NSString*> *)rowTypes;// row names. size of array is number of rows
- (void)setNumberOfRows:(NSInteger)numberOfRows withRowType:(NSString *)rowType;// repeating row name
@property(nonatomic,readonly) NSInteger numberOfRows;
- (nullable id)rowControllerAtIndex:(NSInteger)index;
- (void)insertRowsAtIndexes:(NSIndexSet *)rows withRowType:(NSString *)rowType;
- (void)removeRowsAtIndexes:(NSIndexSet *)rows;
- (void)scrollToRowAtIndex:(NSInteger)index;

---

1. 首先，在Interface.storyboard 搭建好列表要显示的视图

    UI 结构

2. 新建一个类 TableCell继承自 NSObject，然后将刚刚storyboard里面的Cell的类修改为新建的类，作为自定义Cell用。（记得要 #import<WatchKit/WatchKit.h> ）

注意Cell的 Identifier，它就像UITableViewCell里面的重用ID

3. 将自定义Cell里面的视图组件通过 IBOutlet 关联到  TableCell 类。

@interface TableCell : NSObject

@property (unsafe_unretained, nonatomic) IBOutlet WKInterfaceImage *icon;
@property (unsafe_unretained, nonatomic) IBOutlet WKInterfaceLabel *nameLabel;

@end

4. 填充列表数据，在 InterfaceController类里面的 awakeWithContext: 方法进行  

    // 初始化数据源
    _counties = [NSMutableArray arrayWithArray:@[@"Belgium", @"Brussels",
                                                 @"USA",@"Washington DC",
                                                 @"UK",@"London",
                                                 @"India",@"New Delhi",
                                                 @"China",@"Beijing",
                                                 @"Australia",@"Canberra"]];
   
    // 设置列表行数和列表Cell类型（rowType就是storyboard里面的Identifier）
       // 要显示不同种类的Cell，可以通过cell的Identifier来控制
    [_table setNumberOfRows:_counties.count withRowType:kCellType];
   
    // 填充数据到每一行
    for (int i = 0; i < _counties.count; i++) {
       
        NSString *name = _counties[i];
       
        // 取得索引对应的行，然后填充数据，其实这一步逻辑可以放到TableCell类里面处理
        TableCell *row = [_table rowControllerAtIndex:i];
       
        [row.nameLabel setText:name];
       
        [row.icon setImageNamed:@"watch"];
    }

5. 滚动到目标行

[_table scrollToRowAtIndex:_counties.count - 1];

6. 删除目标行

    NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:_counties.count - 1];
   
    [_table removeRowsAtIndexes:indexSet];

7. 插入目标行 

    NSInteger index = _counties.count - 2;
   
    NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:index];
   
    [_table insertRowsAtIndexes:indexSet withRowType:kCellType];
   
    // 修改新插入行的数据
    TableCell *row = [_table rowControllerAtIndex:index];
   
    [row.nameLabel setText:@"创客-第三次工业革命"];
   
    [row.icon setImageNamed:@"testPic"];

8.列表选中事件处理，实现方法 table:didSelectRowAtIndex:

- (void)table:(WKInterfaceTable *)table didSelectRowAtIndex:(NSInteger)rowIndex
{
    NSLog(@"选中：%d", rowIndex);
   
    NSString *content = [NSString stringWithFormat:@"你选中的地方是：%@", _counties[rowIndex]];
   
    [self pushControllerWithName:@"DetailInterfaceController" context:content];
}

9. 页面跳转

WKInterfaceController 页面的跳转，通过 Interface.storyboard 里面的控制器对应的 Identifier来跳转。

10. 页面间传值

页面（控制器）之间的传值则通过跳转时设置的 context 参数，

• - (void)pushControllerWithName:(NSString*)name context:(nullableid)context;
• - (void)presentControllerWithName:(NSString*)name context:(nullableid)context;
• - (void)presentControllerWithNames:(NSArray<NSString*> *)names contexts:(nullableNSArray *)contexts;

我们从以上3个页面跳转方法里面看到，context 参数是个id类型，也就是说它可以指向任何一种object类型变量，所以它可以传递数据到下一个页面。

那我们取值也是通过这个context，这就是为什么方法 awakeWithContext:会有个context参数，这个就是上一个页面传递过来的数据，如果没有传值，则为nil。有个这个context，我们就可以将它转为上一个页面传递过的数据。

Demo:  https://github.com/AbooJan/WatchTableDemo.git