The first iOS app -- Hello world!

Source: Internet
Author: User

In fact, many people have already written similar tutorials on the Internet, but xcode itself is upgraded Fast. Some tutorials on the Internet are based on xcode 3. After work, I spent some time organizing a simple tutorial, hoping to join the ranks of IOS developers.ProgramMembers and friends are helpful.

The first example of many software development tutorials is usuallyHello World. Some people say this is a programmer's curse.Starting from Hello world, you can quickly master a language."Hey hey. So let's start the iOS development journey from Hello world. :]

This article Article It is only for reference by programmers who first came into contact with iOS development. You will find that iOS development is so simple! This article describes the following objectives:
    1. Familiar with IOS ide integrated environment;
    2. Create the first project;
    3. Organize the project structure;
    4. Add a hello World text tag;
    5. Set the application direction;
    6. Hide the status bar.

It looks like a lot. In fact, you almost don't have to write any line in the whole process.CodeTo complete all the above work. Let's start now. :]

1. Familiar with the IOS ide integration environment, as shown in. This is the xcode integration environment:

For those familiar with MS Visual Studio or eclipse, this IDE environment is not difficult to understand and accept. You only need to remember several functional areas. As for the skills in this environment, I will gradually add them in subsequent articles. After all, we have not started to do anything yet, and there is no need to waste too much time on it. Tips : In xcode, you only need to click the mouse in many places. This may be difficult for users who are new to xcode. 2. Create the first project 1. Open xcode, select File> new project, select IOS> Application> single view application, and click Next, as shown in:

Note: In addition to OpenGL game templates, the procedures for other templates are very simple. If you are interested, you can use these templates to create empty projects, and then spend a few minutes reading the code, in this article, we select "singl view application" as the sample template. 2. On the next page that appears, enter "helloworld" in product name. For other settings, see:

Note:
    • Company identifier: Company ID. Enter a unique ID here. You can also modify the ID in the project;
    • Class prefix: Default class prefix. To avoid confusion with other classes, you are advised to enter a prefix name. By default, full uppercase letters are used. leave it blank, in this example, Joy is used as the class prefix name;
    • Device Family: Device type. You can select "iPhone", "iPad", or "universal" (general-purpose, supporting both iPhone and iPad );
    • Storyboard: It is a new feature of xcode 4.x and an extension upgrade of the previous version of XIB, which simplifies the UI design of the program;
      Note: storyboard-based applications can only run on devices of ios5 or later versions.
    • Arc: It is a new feature of xcode 4.x. for iOS programmers of previous versions, every alloc object will subconsciously go to release, which is a very annoying thing. Now with arc, everything becomes simpler, and programmers can focus more on the performance of their applications.
For more information about arc and storyboard, I will write some special articles to discuss them later. If you are interested, you can Google them yourself. For details, I will not discuss them in detail in this article. 3. Click "Next". In the next pop-up window, select a folder, save the project, and click "CREATE. Now we have created the first project. Click "run" in the upper-left corner to see the effect. As shown in:

Now, we just created an application that can run independently through simple settings. Everything is so simple :). 3. Sort out the project structure. This part of content is not necessary during development. If you are anxious to see the following, you can skip this part. However, as we develop more and more files, it is also a very good habit to organize the project structure. :] First, let's take a look at the navigation area, as shown in:

1. Right-click "helloworld" and select "new group" from the pop-up menu ";

2. Rename the new group to "Gui ";

3. Drag the files we see to the "Gui" group, as shown in:

Tip:First in the first file joyappdelegate. h. Click the mouse, hold down shift, and then click the last joyviewcontroller. M click the mouse to select these files, hold down the mouse, and drag and drop to the GUI.

4. Add a hello World text tag

Next we will add a text label to display Hello world.

1. click in the navigation area and open the "mainstoryboard. storyboard" file, as shown in:

This is a blank storyboard without any controls.

2. Find the label control from the object area in the lower right and drag it to the default blank view;

3. Double-click the label control. When the text in the label control is highlighted, we enter a hello World!

4. Adjust the label position to keep it in the center of the screen.

Click the run button in the upper left corner, or press command + R to check the running effect.

How do you feel? Not bad. Haha, it looks very simple. Let's continue. :]

5. Set the application direction

Most mobile devices currently support screen rotation. Many applications re-deploy the application interface when you rotate the device in the current direction. In the simulator, we can use the Comand + left and right keys to rotate the simulator direction, so as to simulate the effect of rotating the device during use.

Now let's take a look at the effect, as shown in:

The label is not in the center of the screen. For complex UI applications, you may need to write code to separately arrange the positions of each control based on the screen. However, we do not need to do this for the current example. Let's take a look at what we can do.

1. Click and open the "mainstoryboard. storyboard" file in the navigation area;

2. Click "Hello World" to select the control;

3. Click "show the attributes inspector" in the tool area to set the alignment attribute of the tag to center, as shown in:

4. Click "show the size inspector" in the tool area to set the autosizing attribute of the tag:

Next let's run it again. I turn, haha, and now no matter how you turn to Hello world, it is always in the middle of the screen. :]

But a careful friend may find a problem at this time, that is, when the home key is above, hello World is displayed on a horizontal screen, not what we expect. Why?

1. Click and open the "joyviewcontroller. m" file in the navigation area;

2. Find the shouldautorotatetointerfaceorientation method, which is originally limited here;

3. comment out the only statement and add a return YES statement as follows:

 
1-(Bool) shouldautorotatetointerfaceorientation :( uiinterfaceorientation) interfaceorientation2 {3 //Return (interfaceorientation! = Uiinterfaceorientationportraitupsidedown );4ReturnYes;5}

Now let's run it to see the effect. OK! :]

Additional instructions

In the project property settings, there is a setting property that supports device orientation.

Click the helloworld project in the navigation area, and click helloworld under targets in the editing area. We can see that:

 

By default, the "upside down" direction is not supported. However, after this attribute is modified, it will only affect the viewcontroller we will add in the future, without affecting the previous viewcontroller. Therefore, if you want helloworld to support upside down, you need to manually adjust the code.

6. Hide the status bar

Although the iPhone and the new iPad have a high resolution, their screens are much smaller than those of traditional PCs. When developing IOS applications, the space on the screen can be described as "nothing". We need to make full use of every space on the screen. Currently, many IOS applications do not display the status bar during runtime. How can this problem be solved?

1. click in the navigation area and open the HelloWorld-Info.plist file;

2. Right-click the blank area of the editing area and select "add row" in the pop-up menu ";

3. In the "key" column, find "status bar is initially hidden" in the drop-down list and set its attribute to "yes ";

Run it. the status bar is missing! :]

Conclusion

OK. So far, the "Hello World" project has been completed. How do you feel? Easy!

Later, we will go into depth to start a happy iOS development journey.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.