The user interface will be pretty simple since we're only displaying one value. In the Main.storyboard we're going to give our app two labels and a switch. One of the labels will display our accelerometer data as it updates and our switch will stop and start the updates.

Let's create our labels.

Select the Main.storyboard file. You can find the label and switch in the Object Library on the right lower corner of our project window.

Click and drag two Labels to the center of the storyboard. Place one Label over the other Label. It should look like this. 

Then search for a Switch, and do the same.

Change the top label's text to "iPhone Accelerometer-X Data:" by double clicking the label.

Then, open the assistant editor menu. Your main.storyboard and view controller class should appear side-by-side.

We'll need to create a reference to one of our labels. Select the bottom label then control+drag and drop to the view controller window.

A smaller window will pop up, here you'll give the label its reference name. For the sake of the project, we'll name this reference accelTagX.

We'll do the same with the switch UI and we will name the switch accelSwitch.

Select the switch again, we'll control+drag and drop into the view controller, but this time in the small pop-up window, we'll select the Connection drop down menu and select Action instead of Outlet, then we'll name the action "stateChange".

After you've done that, in the Type drop down option, change Any to UISwitch. When you're all done, hit Connect.

Let's head back to our view controller to create a function that will get us our accelerometer data.

This guide was first published on Jan 01, 2018. It was last updated on Mar 08, 2024.

This page (Setting up the UI) was last updated on Mar 08, 2024.

Text editor powered by tinymce.