Your First IOS App (V): Adding Functionality to our App - Digital Leaves
page-template-default,page,page-id-2022,qode-social-login-1.0,qode-restaurant-1.0,ajax_fade,page_not_loaded,,select-theme-ver-4.1,wpb-js-composer js-comp-ver-5.2,vc_responsive

Hello again! This is the final episode of the “Your First iOS App” tutorial series. In this tutorial, we are building our first iOS App, with a textfield to type a name, and a button that changes a label to greet the name we just entered in the textfield. In the previous episode, we added the outlet connections for the visual controls to code variables, and we also created an action for the button interaction, so we can add some functionality when the button gets clicked.

In this last episode, we are going to add some functionality to make the button change the label according to the text we just entered in the textfield. This means that we will be adding Swift code to the code portion of the view controller. Don’t worry, though! It’s not a lot of code, and we will go step by step.

Plan before you act

When approaching a problem you need to solve, before writing a single line of code, it’s essential, in my opinion, to plan how you are going to solve that problem and elaborate a list of points that takes you from the initial point to the solution.  This doesn’t need to take you a long time, it’s just an enumeration of the steps to follow, to serve you as a guide for implementing the solution once you start coding.

I’ve always said that the difference between a junior and a senior developer is that the junior developer spends 20% of her time thinking and 80% of her time coding, while the senior developer spends 80% of her time thinking and 20% of her time coding. This means that sometimes, taking a moment to plan how you are going to solve a problem, as opposed to just blindly starting to code can save you hours of work later.

Our plan

So, let’s build our plan. Our problem is simple: when the user types some text “xxx” in our textfield, and clicks on the “say hello” button, we want to display a “Hello, xxx!” message in the label at the top. Accordingly, our plan will simple too, and it’s depicted in the figure below:

All these actions will take place inside the “sayHello” method of our ViewController class, thanks to the IBAction we set in the previous episode, but we will define an instance variable for the current name of the textfield belonging to the instance of the class, so first let’s write down our plan as a series of steps there:

Technically speaking, you don’t need to define an instance variable for this, but I wanted to explicitly define it so you can see an example of a plan that includes modifying a local method and the class itself.

Now it’s time to turn those steps into real instructions.

Executing the plan

First, we define our currentName variable, that will be a String variable. More precisely, it will be an implicitly unwrapped optional, because we want to avoid having to initialize it, but we don’t want to be taking care of unwrapping it. If you don’t know what an optional is, I recommend you to check the “Swift For Absolute Beginners” course, but for now don’t worry, just think of it as a variable that might contain a null value (and this is indicated by the “!” mark):

Next, inside the sayHello method, we’ll assign the text value contained in the text field to this currentName variable. The text inside the text field is accessed by means of the “text” property (makes sense, right?), so we can say:

Actually, this “text” property can contain a null value (nil), so we will make sure that we get at least an empty string by using a coalescing operator:

What this means is “assign to the currentName variable the content of the text property of inputTextfield. If this variable happens to be nil, then put there an empty but valid string instead”. Don’t worry if the syntax might seem confusing, just get the idea of getting the text of the input field or at least an empty string.

Then, the last step is updating the helloWorldLabel with a “Hello, xxx!” message, where xxx is the content of the currentName variable. in Swift, variables can be added to strings inline by wrapping them into this syntax: \(xxx), where xxx is the name of the variable. So in our case, we have:

Notice how we set the text of the label by using a “text” property, like we did in the case of the text field.

So now, our code looks like:

Running Our Finished First App

Now save (Cmd+S) and run the application (Cmd+R), and voila! The screen should appear with the “Hello, world!” label on top and a textfield (that initially has the text “world” on it) just above the “Say Hello” button. If you click on the input text field, the keyboard should appear, and you can then remove the world text, and add your own name (it can be anything, really), and click on the “Say Hello” button.

When you click on the “Say Hello” button, the sayHello method will be invoked, the current text value of the input text field will be stored in the currentName variable, and this value will be used to update the label on top with a nice cheerful message. Congratulations! You have just created your first interactive native iOS application.

If the message does not change, check that you made the IBAction linking the visual representation of the ViewController with the source file correctly (check the previous episode of the series), and check that you are reading first the value from the input field correctly, and then setting that value to the label correctly.

We will not dive into debugging here, because it’s out of the scope of this tutorial, but you can add a line between steps 2 and 3 saying: print(currentName), so that when you click on the “Say Hello” button, the debug area should print the name you just entered. (You can show the debug area with Cmd+Shift+Y).

If you still can’t get the name to appear in the label, don’t hesitate to contact me. Probably it’s just a small oversight (we all made them at the beginning).

Congratulations! You just finished your first iOS App. Hooray! Time to enjoy a well-deserved rest and show the app to your family and friends.

Before you continue...

Hi there! I created the Digital Tips List, the newsletter for Swift and iOS developers, to share my knowledge with you.

It features exclusive weekly tutorials on Swift and iOS development, Swift code snippets and the Digital Tip of the week.

Besides, If you join the list you'll receive the eBook: "Your First iOS App", that will teach you how to build your first iOS App in less than an hour with no prior Swift or iOS knowledge.

I hate spam, and I promise I'll keep your email address safe.