UITABLEVIEW IN AN APPLE WATCH APP

In this post I’m going to show you how to create a WKInterfaceTable and set dynamic content in a list in a Watch app.

Let’s start by creating a new project. Open Xcode 7.0 (or later) and click on File > New > Project (as shown below).

Next, select the iOS App with WatchKit App option and click Next (as shown below).

Enter the Product Name – this will be the name of your application. I’ve used the name ‘MyFirstWatchApp’. Click Next and choose the appropriate destination for creating the project.

When you do that, XCode will automatically create a number of files and directories. Open the Interface.storyboard file under “WatchKit App”. Then, drag the WKInterfaceTable from the Object library to the Interface Controller (as depicted below).

Now, drag the WKInterfaceLabel from the Object library to the newly created Table Row Controller, and set the vertical alignment of the label to ‘center’ (as shown below).

Next, set the Identifier of the Table Row Controller to Default (as shown below).

Now, assign the newly created TableViewRowController class to the default table view row you have created on the storyboard (shown below).

Next, create a WKInterfaceLabel IBOutlet in the TableViewRowController.h file.

Now connect this IBOutlet in the storyboard with the tableview row label (as depicted below).

Next, create a set Content method and its definition in the TableViewRowController class as follows:

TableViewRowController.h file
- (void)setContent:(id)object;

TableViewRowController.m file
- (void)setContent:(id)object {
self.label.text = object;
}

Then, create a WKInterfaceTable IBOutlet and a datasource property of type NSArray in the InterfaceController.h file

Connect this IBOutlet in the storyboard with the tableview, as shown below.

Now, create the following three methods in the InterfaceController.m file

- (void)loadDataSource {
self.dataSource = @[@"English", @"Maths", @"Chemistry", @"Physics", @"Urdu", @"Social Science"];
}

- (void)loadTableViewData {
[self.tableView setNumberOfRows:self.dataSource.count withRowType:@"Default"];
}

- (void)setTableViewContent {
NSUInteger index = 0;
for (id object in self.dataSource) {
TableViewRowController *controller = [self.tableView rowControllerAtIndex:index];
[controller setContent:object];
index++;
}
}

Call these methods sequentially in the awakeWithContext: method.

And that’s it! Let’s try it out. Select the watchkitApp from target and run it.