Want to learn iOS development? Start with the HelloWorld page

1 Introduction

This year, the team is flattening the front-end capabilities and needs to learn native App development. Let's write a HelloWorld iOS page first.

2. Create a project

2.1 Install Xcode

How to download and install xcode, you can go to the AppStore to search for Xcode to download or go to the official website of Xcode

It is recommended to go to the official website, because AppStore downloads often encounter network blocking and loading problems.

Environment: Xcode 14.2, System: macOS Monterey

65066030-257C-425D-B2BA-923A5954D21E.png

2.2 Create a new Xcode project

1. Select the iOS target and App application template

98D1CD94-47E2-4562-B623-8F7F3A442FF7.png

2. Fill in the information, select Storyboard for Interface, and use the language Objective-C.

45386964-8896-4CF9-8962-8C8D813F9262.png

3. After confirming, Xcode will automatically open this project by default

9725997B-0AB9-476F-9F4F-7E724B667ADC.pngView through the folder, the root directory defaults to a project name.xcodeproj and a project name folder, you can double-click the HelloWorld.xcodeproj file to open the above interface.

DAD1EDAF-B824-4626-A837-8EE835AADC4F.png

3. Introduction to project directory

3.1 .xcodeproj folder

The .xcodeproj file is not a file, but a folder. View the following folders in the terminal:

  • The project.pbxproj file is essentially an ASCII text file, storing various configuration parameters of the Xcode project. Essentially an old style Property List file
  • project.xcworkspace Workspace
  • xcuserdata is generally some settings related to users

The above documents can be roughly understood, and there is no need to study in detail now.

3.2 Project name folder

Double-click to open the file directory HelloWorld.xcodeprojin Xcode as follows

063D0689-1777-479F-A4B2-C510669C1067.png

  • Main.stroyboard storyboard file
  • LaunchScreen app launch storyboard file
  • Assets.xcassets resource directory, which can be used to manage pictures

现在只需要了解 Main.stroyboard 就可以实现在界面上显示 Helloworld 文本。

4. 添加 Label 控件

4.1 Main.stroyboard

故事板可以用来构建界面,它本质上是一个 XML 文件,可以用来描述应用中有哪些界面、界面有哪些视图元素,它们的布局、事件处理,以及界面之间是如何导航的。

在这里,我选中故事板下的 view 视图,并点击右上角的加号,在这里选中一个 Label UI,添加到页面中,此时启动应用即可看到 Jecyu 文本。

711A8E5E-1051-4879-A098-5E66FB520EBE.png

这里的 View Controller Scene 是视图控制场景,View Controller 是视图控制器,最后才是视图控制器管理的视图。

一个场景中包含一个视图控制器,视图控制器通过管理视图来显示界面,视图控制器有一个 view 属性,该属性可用于获得它所管理的视图。多个场景通过“过渡”连接,过渡定义了场景之间的导航方式。

4.2 Info.plist

这个文件的作用就是提供应用在运行期的一些配置,可以看到程序实际执行的路径,故事板使用 Main.stroyBoard ,故事板使用的场景执行文件为 SceneDelegate 。

711A8E5E-1051-4879-A098-5E66FB520EBE.png

9BE2C2FC-C232-474F-AB06-7E1897EC5C88.png

5. 启动程序,在模拟器中运行

点击左上角构建图标,点击运行

D3F7FE89-B6AE-41C0-BA09-1EA3CD37BEFC.png

6. 总结

如何快速实现一个 Hello world iOS App。

  • 新建一个 Xcode 项目,选择 iOS 目标。
  • 根目录下默认就是一个项目名 .xcodeproj 和一个项目名文件夹。
  • 项目名文件夹下选择 Main.storyboard 故事板,选择 View 属性,搜索添加 Label 控件,输入 HelloWorld
  • 启动程序,即可在模拟器中运行

In the next article, I will first briefly understand the class knowledge of Objective-C, and then introduce the functions of the .h and .m files in the remaining project name folder , and then draw Hello World through code.

References

  • Guan Dongsheng, author of "iOS Development Guide from HelloWorld to App Store"

Guess you like

Origin juejin.im/post/7214110277121589306