Beginning iOS Development

Course No. 10-152-143

Chapter 1 — A Simple iOS Application (iOS)

Follow the book; however, there are some differences that we need to incorporate that didn’t exist when the book was released. I’ll cover those differences here.

Creating an Xcode Project

  • You should use edu.matcmadison in the Company Identifier unless you have your own paid Apple developer license. Use yours if you have one.
  • Uncheck the Use Storyboard checkbox if it’s checked. This is important!

Building Interfaces

  • Nib files are a little complicated. We’ll cover them in detail once you’ve used them a bit. Don’t worry if the explanation in the book is confusing at this point.
  • Click on the QuizViewController.xib file.
  • If the panel on the right isn’t open then open it with ⌥⌘-0 (Option Command – Zero)
  • Click on the File Inspector tab. That’s the one on the left. Then uncheck Use Autolayout.

Model — View — Controller

  • This is a very important design pattern that is used extensively in Cocoa.
    • Model — The data
    • View — What you see and touch
    • Controller — What’s in charge
  • In Quiz:
    • The Model will be the NSMutableArray objects that hold the questions and answers.
    • The View is the QuizViewController.xib and all the user interface elements we add to it.
    • The Controller will be QuizViewController instance.


Declaring Properties

  • This section is where we use what we learned last semester and make some changes from the book. Whenever the book says to use instance variables we want to use properties instead. Also, we want to make them private properties unless they have to be public.
  • Open the QuizViewController.m. Notice that Xcode has added a class extension to the file.
  • Add the five properties like this instead of the five instance variables. (This is in the QuizViewController.m file.)
    • We’ll be using (assign, nonatomic) for primitive data types.

Declaring Methods

  • Add the method declarations in the QuizViewController.m file, just like the properties. They will go right after the properties.
  • Notice the little circles to the left of some of these?

  • They are connection indicators. If they are just a circle then the connections have not been established. Once we make the connections they will get a black dot inside the circle.

Making Connections

Setting Pointers

  • We need to connect our UI elements to our code. We do that with Outlets and Actions.

  • Outlets
    • An outlet is marked in our code as an IBOutlet.
    • When our code needs to change something in a UI element, it needs a pointer to the object.
    • The IBOutlet tag is telling Interface Builder that this property needs to be connected to a UI element.
  • Actions
    • An action is marked with IBAction in our code.
    • When a user touches a UI element we need to run code to respond. An action is how we hook buttons, etc., up to code in Cocoa Touch.
    • The IBAction tag is telling Interface Builder that this button needs to be connected to code in our app.
  • The book shows the way we made these connections before Xcode 4.5. Read how it’s done so you are familiar with it.
  • Use the new Xcode 4.5 way instead when you make these connections.

Setting Targets and Actions — The Xcode 4.5 Way

  • Click on the QuizViewController.xib file. You will see your UI layout in the center panel.

  • Hold down the Option key () and click on the QuizViewController.m file. This will open the code editor in another panel on the right.

  • Now you can see the UI elements and the code that needs connecting. Could it be as easy as just dragging from the little circles to the elements for vice versa? Yup!
  • Click-and-hold on the connection circle to the left of the questionField. Drag the line over to the question text field UILabel.

  • Once you release the mouse you will see that the circle now has a big dot in the middle. This means you have made a connection.

  • Connect the other label field the same way. We call this process wiring our interface.
  • Now wire up the buttons in the same way. Click-and-hold on the connection circle for showQuestion: and drag the wire to the button.

  • Repeat for showAnswer:.
  • Your code should look like this now.

Summary of Connections

  • Back to the book; this hasn’t changed.

Setting Targets and Actions — The Really New Xcode 4.5 Way!

  • What we just did works just fine, but there’s another way. (Isn’t there always?)
  • It turns our that most iOS developers will use this new alternative. Why, you might ask? Because it involves less typing.

Auto-Writing Properties

  • Let’s reset the development state to the way it was before we typed the properties and methods.

    • Notice that there are no properties for the UILabel instances.
  • Now hold the Control key down, click-and-hold on the question field and drag over to the code right under the other properties.

  • Now let go. A dialog box will open.

  • Type “questionField” into the text field.

  • Next, press the Connect button. Whoa! Look what happened. Xcode generated the property declaration for us. We didn’t have to type the whole line. And notice the dot in the circle? It’s all wired up and ready to use. Sweet!

  • Repeat the process for the answerField.

  • Enter “answerField” into the dialog. Press the Connect button and you will have your properties!

Auto-Writing Methods

  • Could it be just as simple for methods? Yes, it is.
  • Control-Click and drag from the Show Question button to the class extension.

  • Change the Connection to Action.

  • Select UIButton for Type.

  • Enter “showQuestion” in the Name field.

  • Press the Connect button and the method declaration is generated and written into the class extension.

  • That’s great isn’t it? But, wait. There’s more! Scroll down to the bottom of the QuizViewController.m file.

    • The method implementation has also been generated. The method has been wired up, too. You are now ready to write the code for the method.
  • Repeat this process for the “showAnswer” method and move on to the next section. Don’t forget to change the Connection to Action and the Type to UIButton. Enter “showAnswer” into the Name field and press Connect.

  • You are ready to implement the code in the methods.

Implementing Methods

  • initWithNibName:bundle:
    • We are using properties with auto-synthesis of instance variables. When you want to reference the instance variables directly you need to add an underscore to the name of the property.
      • For example, the property named questions has a backing ivar named _questions.
    • Your method needs to look like this.
    • Backing ivar? Yes, that’s what iOS developers call the instance variable that a property uses to hold its data.
    • What about dot notation? It is perfectly fine to use dot notation this semester. It’s even encouraged. However, there is one place where it is recommended to not use it and that’s in the init methods of classes. There you should use the direct pointers which start with underscores. The authors of the book say that it doesn’t really matter how you access properties in init methods. Since that’s the case we’ll take Apple’s recommendation and use the direct pointers only.
  • showQuestion:
    • Since we are using properties instead of instance variables we need to use accessor methods to assign and retrieve values. We’ll use dot notation as much as possible this semester. Here is the method rewritten the new way.
    • Let’s look at some of the lines in more detail.
      • This line does a lot of work. First it calls the get method for the property. Then it increments that value. Finally, it calls the set method for property. All with just a ++!
      • The count method is not a property so we have to use a set of [], not dot notation.
      • This is the modern Objective-C syntax for using properties with array access.
      • Here’s an example of using multiple properties in one statement. We start with self.questionField to get access to the label instance. Then we add the text property of the UILabel class. How do we know it’s a property? We look it up in the docs.
  • showAnswer:
    • Here’s the simpler method to show the answer.

Build and Run on the Simulator

  • We can run it in the iOS 6 simulator.

Deploying an Application

  • We’ll be skipping this section until we get everyone deploying to a device.