iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable

Today we will start our 2nd tutorial on WatchKit, iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable.

I think its basic one of the basic thing to do so we will load table and display respective data in next Controller. You can check basic of iWatch or WatchKit 2 in our previous tutorial here.

 

Creating Project

Open Xcode select New project select “WatchOS application”.

iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable

Give your project a name and you can also select from notification, glance and complication.

iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable

Designing the UI

There is no Main.storyboard instead there is Interface.storyboard. Drag drop a table on your Interface Controller. You can also drag and drop label and imageview to your table row. I named it watch table. iWatch has its own type of table view not the UITAbleView but WKInterfaceTable.

 

iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable

 

Populating WKInterfaceTable

We will start by creating and Array of data we want to display on our table.

Then in our awakeWithContext method we will set the number of rows and data to table. This method is like viewDidLoad. Then using for-in loop we will set each and every row of our WKInterfaceTable.

Note : There are no delegates like UITabelView the common one i.e numberOfRowsInSection or cellForRowAtIndexPath.

Now run your program, watch simulator will automatically comes up. It will look like below.

iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable

Nice work you just display a table of content in your iWatch.

 

Extra Controllers

We will use UKTableView Delegate method of selection of table view. And we will send data from Interface Controller to our other controller.

Lets drag and drop another controller and create a new Controller class for it. Just drag and drop on your new Detail controller and create its outlet like belowScreen Shot 2016-03-31 at 2.14.49 PM

Set the DetailController identifier say “detailController”. Now back to our main Interface Controller. Now we will code the delegate method.

This is just a simple push method which is pushing controller by its identifier and the “context” contains the data which we want to send.

In our Detail controller we will get the data from the context and display it on the label.

 

Now again run your project and click on any row.

Screen Shot 2016-03-31 at 2.19.40 PM

Simple isn’t it. We can show image and other objects also.

So start coding and try something and make something for yourself. Will be back soon with something more exciting next time and don’t forget to post your comment and suggestion below about our today’s iWatch Tutorial 2 : Selectable Table Using WKInterfaceTable. Happy Coding 😉

One Comment

Add a Comment

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.