Disclaimer: This article is translated from the Appcoda website article:Creating Hello World App Using Xcode 5 and Interface Builder, author is creator Simon Ng. If you have any objection, please contact the blogger.
Update: based on Apple's latest version of the Xcode 6 and Swift language, we update the latest version of the Hello World tutorial.
This Hello World tutorial has been written before in the old version of the free tutorial . We would like to use Xcode 5来 to re-update the tutorial (since the old tutorial is obsolete, the translator will no longer translate the old version of the tutorial, I hope you understand the reader). We have received quite a few questions (or complaints) about the old version of the Hello World tutorial. Following:
- I'm trying to follow the tutorial, but it's not working properly under Xcode 5.
- Where is the Interface builder interface Builder?
- How do I create a xib file?
The list of issues is endless, in Xcode 5, a new storyboard storyboard replaces the Interface Builder Interface Builder. When you use a separate attempt template to create a new Xcode project, it defaults to storyboard, which no longer has a xib file.
We have finished updating the Hello World Tutorial version of Xcode 5. However, we still intend to use the Interface Builder Interface Builder to create the project. This does not mean that interface Builder is better than storyboard, we just want you to learn both ways.
Open our Hello World Tutorial in Xcode 5.
If you have read other programming books before, you may have heard the "Hello World" program. This has become almost the norm for beginners ' first program. It is a very simple program, just output "Hello world" on the device's screen. In this tutorial, we will continue this tradition and use Xcode to create a "Hello World" program. Although it is very simple, the development of the "Hello World" program can also accomplish the following purposes:
- It allows you to better understand the grammar of objective C and learn about iOS becoming a language.
- It also gives you a brief introduction to Xcode's programming environment. You'll learn how to create a Xcode project and create a user interface with Interface Builder.
- You will learn how to compile a program, build an app, and debug it in the Simulator emulator.
- Finally, it will give you a dose of sedative, not to be programmed too hard to scare.
Take
a peek at your first appBefore we get into the code-writing phase, let's take a look at our version of the "Hello World" program. The end result will look like this: it's very simple, just shows a "Hello World" button. When it is clicked, the program will give you a hint of a message. That's it. Nothing is particularly complicated, but it can help you start your iOS programming journey.
Start programming! First, open Xcode. If you've already installed Xcode through the App Store. You should be able to find the Xcode icon on the panel. Click on the Xcode icon to open the software. Once clicked, Xcode displays a welcome dialog box. Here, select "Create a new Xcode project" and create a new project: Xcode will show you many types of project templates to choose from. Your first app, you can directly select the empty application template, then click "Next" to proceed to the next step. It then jumps to another interface and needs to fill in some of the necessary information for the project. You can simply fill in the following example as follows:
- Product Name: Hello World-Here is your app name.
- company Identifier (ID): Com.appcoda -Here is actually another way to write a domain name, and if you have a domain name, you can write your own domain directly. Otherwise, you can write "edu.self" with mine or directly.
- Class Prefix (the prefix of the classes name): HelloWorld -Xcode automatically uses this class name prefix to name the class. In the future, you can choose your own prefix or leave it empty. But in this tutorial, let's simply write "Hello world".
- device Family (Devices used): iphone -In this project, we use the iphone directly.
- use core data (if core data is used): [No] – do not select this check box, because in this simple project, we do not need to use core data.
If you have previously used Xcode 4.6 or earlier, you may find "use Automatic Reference Counting" (using automatic counters) and "Include Unit Tests" The two options (including unit tests) have been completely removed in Xcode 5. They will no longer be selected in Xcode 5, but default.
Click "Next" to continue, and Xcode will prompt you to save the "Hello World" project. Select a folder on your Mac machine (for example: Desktop). You may notice that there is a version control option. Just cancel the selection. Questions about this option will be discussed later in the tutorial. Click "Create" and continue.
You can confirm that Xcode automatically creates a "Hello world" project based on all of the criteria you have chosen. The interface is like this:
familiarize yourself with the Xcode workspaceBefore we start moving to writing programs, let's take a few minutes to quickly preview the Xcode development environment. On the left side of the panel is the item navigation bar (Project Navigator). In this area, you can find so the project file. In the middle section, the editing area where the code is written. You will do it here so code writing work (e.g. writing project settings, class files, user interface design, etc.) depends on what type of file you choose. Below the coding area, you can find the debug area (debug Zone). This area will be displayed when you run the program. The rightmost area is the area that is used specifically (Utility areas). It displays the file attributes, allowing you to use quick help. If this section is not shown in Xcode, you can choose to display it by clicking the Style button at the far right of the toolbar. Finally, the following toolbar (Toolbar) is introduced. It will provide you with a lot of functions, try switching the Edit button (editor buttons) and view options (see selections).
Run your program for the first timeEven if you do not write any code, you can still run your program in the emulator. It will let you know how you are compiling and debugging in Xcode. Simply click on the "Run" button on the toolbar. Xcode will automatically compile the program and run it in the emulator. This is what the emulator looks like when it's running: a white screen with nothing in it?! That's nature. Because your program has nothing to add, the emulator will display a blank interface. If you want to terminate the program, click the Stop button on the toolbar. Xcode chooses the iphone Retina (3.5 inch) screen as the emulator by default. You can easily switch other versions of the simulator to test your program. Try selecting a different simulator and running your program.
back to Programming Okay, here we are. Let's start by adding the "Hello World" button to our program. Before we can add buttons, we need to create a view and the corresponding controller controllers. You can think of a view as a container for a UI control like a button. Returns the project Navigation area (Project Navigator). Right-click the HelloWorld folder and select "New file" to add the files. under the Cocoa Touch category, select the Objective-c class template, and then click Next. Create a new class file and name it "Helloworldviewcontroller", and then select the inherited class "Uiviewcontroller". Confirm that the "with XIB for user interface" check box is selected. After confirming the error, click Create View controller file. A file box prompt appears. Click the Create button to create the class file and the Xib file. Once completed, Xcode will have three new files to produce. Includes: HelloWorldViewController.h, HELLOWORLDVIEWCONTROLLER.M and Helloworldviewcontroller.xib. If you click on the Helloworldviewcontroller.xib file, you will see an empty view interface, like the same: now let's add a Hello World button to the view first. In the utility area of the following section, there will be an object library. From here, you can select any UI control you need and drag it to your view interface. Try to place the button in the middle of the view. then, let's give this button a name again. Edit the label of the button, double-click the button, and enter the content "Hello world". If you try to run the program now, it will still be the same as before, nothing at all. The reason for this is that we didn't tell the app to load a newly added view. So we're going to add a few lines of code to load HELLOWORLDVIEWCOntroller.xib file. Select the APPDELEGATE.M file in the project navigation bar, and add the following references at the front of the file: in Didfinishlaunchingwithoptions: Method, Add the following lines of code: the final edit completed code should look like this: What you just did was to be able to load the Helloworldviewcontroller.xib file. Then set it as the root view controller. Now that you run your program again, you should see this: now, if you click on this button, nothing will react. We also need to add code to the message that it displays "Hello world".
Write the Hello World buttonIn the project navigation bar, select the "HelloWorldViewController.h" file. The code editing area will display the code you selected for this file. Before @end, add the following code: When you're done, the code should look like this: Then, select "HELLOWORLDVIEWCONTROLLER.M" and insert the following code before the @end section: After editing, it should look like this: Don't go. The meaning of the OBJECTIVE-C code above that part of the tube. We'll explain it to you later in the tutorial. Now, we're just going to think about how to trigger the "ShowMessage" event. Then how to instruct iOS to display the message "Hello World" on the interface.
bind event to Hello World buttonBut here's the question: How do you tell the "Hello World" button to trigger an event when someone clicks the button? So next, let's build a connection between the "Hello World" button and the "ShowMessage" event you just added. Select the "helloworldviewcontroller.xib" file and Return to interface Builder (interface edit area). Click the control key on your keyboard, and then click the "Hello World" button and drag it to "File's Owner". : Release the two button, and then there will be a pop-up box showing the "ShowMessage" event. Select it so that the click button and the "ShowMessage" event are bound.
Test Your programIn this way, you have completed and can test your first app. Just click the "Run" button, and if everything is OK, some programs will run normally in the emulator. Congratulations! You have created your first app to complete your application. It's simple, but I'm sure you've got a further understanding of Xcode and how to develop a iechengx. You can jump tothe second part of the Hello World program, learn how the HelloWorld program actually works. Here to provide you with aDownload the program's source code, for reference. As a rule, if you are having trouble creating your program, leave us a message. We'll post more tutorials on Xcode 5 and iOS 7.
Third, use Xcode 5 and Interface Builder to create the Hello World app
