BeFor Web
为网而生 - 关注移动互联网及AR/VR产品的用户体验设计

iOS应用开发基础 - 起步

iOS应用开发基础 - 起步

还算是个阳光周六,喵正在我身后的砂盆里埋便便,唰唰唰的;一会带她过去医院复诊,希望是好结果。

念旧的毛病改不掉。这个多事之秋里,总是回想起2005年大学毕业之后那几个月的日子。当时的第一份工作是在徐家汇附近一家掌上电脑公司卖Palm和HP一类的PDA,各种智能机也从那时开始被越来越多的人接受。每天身为一个“卖手机的”工作一天,晚上回到家(在中山公园和朋友合租的两室一厅,月租金每人800元)随便糊弄点粮食吃掉,然后就是吹着风扇喝着啤酒尽情的学Photoshop啊Illustrator一类;似乎每晚都有用不完的时间,从7点到夜里2点,任由自己安排。那时一心往Web行当里扎,约莫是不想一辈子被人叫做“卖手机”的吧。其实现在想想,如果从那时老老实实卖到现在的话,却也早该赚的盆满钵满了吧。只是自己不喜欢。

那时的状态幸福的有些不可思议,而如今每晚可以利用的时间加在一起写不了几行字也看不了几页书;一事无成的感觉越发强烈,而自己却已年入而立。真想有什么办法可以把每天的时间透支到25或26个小时,让我再可以多学些东西,多做点事,在自己变成一个庸碌无为的中年大叔之前。

那就说正经的吧。之前在微博念叨过,想做些iOS开发基础方面文章。找到一个还算比较新的教程系列,今天做第一篇。大约从第五篇起,原作者开始使用Xcode 5;前面四篇基于Xcode 4的范例倒也不会造成很大困扰。再多念叨两句,做这类文章,目的就是希望更多和我一样的设计师能对开发方面的那点事有些概念、常识和认知;真正的开发能力绝非看几篇文章或听几次技术人员的分享会就可以掌握的,这点还希望各位能够了解。

这里进入译文。如今,开发一款iOS应用已经变得相对容易了很多,因为有大量的工具可以帮助我们更轻松的完成整个开发流程。我向你保证,一旦你开发出一款iOS应用并上架到App Store当中,你一定会觉得无比兴奋的。

本教程系列将帮你从零开始学习开发一款iOS应用,同时还会帮你了解Xcode以及一些关于iOS编程的基础概念。

怎样搭建开发环境

在你的MacBook或iMac上,从App Store下载Xcode,这就足够你在本地进行开发并在模拟器当中运行程序了。如果你想将应用部署到实际设备当中或是发布到App Store,那么还需要注册iOS Developer Program(99美金/年)。

接下来,让我们一起通过创建一个简单的iOS应用来学习Xcode和iOS编程的基础知识。

在Xcode中创建新项目

1.打开Xcode,选择“File->New Project”。

2.在接下来的模板选择界面中,选择“Single View Application”,点击“Next”。如大家所见,Xcode默认提供很多可用的模板,你可以试着进行探索。在本教程中,我们使用最基础的单视图应用模板(Single View Application)。

01-template-ios-development-basic-xcode-tutorial-.png

3.在接下来的界面中,你可以对项目进行必要的设置。

02-project-ios-development-basic-xcode-tutorial-.png

其中:

  • Product Name:应用名。
  • Organization Name:可以是你自己的名字,也可以是你所在的组织的名称。该名称会被添加到每个源文件当中的版权注释当中。
  • Company Identifier:一个唯一的字符串,用于为最终的程序包创建唯一的标示符。为了确保独特性,苹果建议使用反转式的命名方式,例如“com.companyname”。
  • Bundle Identifier:通过上面的Company Identifier生成的包标示符。
  • Class Prefix:这里填写的内容会被添加到你所创建的任何一个class名称当中,作为前缀。这种机制的目的是为了避免自定义class与内置class之间的命名冲突。
  • Devices:指明你即将开发的应用是面向iPhone、iPad还是通用的。本次的案例当中,我们选择“iPad”。
  • Use Storyboard:故事板是应用流程的概念化设计与呈现方式。我们这次的案例当中不涉及故事板的使用,所以不要选中它。
  • Use Automatic Reference Counting:本案例中要确保这项被选中。在iOS5之前,开发者们必须手动管理应用的内存使用情况。选中该选项后,内存管理方面的问题会被系统自动处理。
  • Include Unit Tests:本案例中不要选中此项。如果选中,系统将帮助开发者执行单元测试。

按照上面的说明进行设置之后,点击“Next”。

4.为你的项目指定保存路径。如果你选中“Create local git repository for this project”,那么Xcode将会把当前项目置于版本控制体系当中。在本教程中,我们不需要选择此项,只有当你在做需要部署到App Store当中的应用时才会用到该功能。

03-folder-ios-development-basic-xcode-tutorial-.png

5.最后,点击“Create”按钮,进入正式的项目开发界面。

04-file-ios-development-basic-xcode-tutorial-.png

理解Xcode的IDE环境

05-ide-ios-development-basic-xcode-tutorial-.png

Xcode的窗口包含以下这些组件:

1.顶部工具栏(top tool bar)。你可以通过工具栏中的Run按钮来启动或退出应用的测试。工具栏右侧的编辑器和视图切换按钮可以改变Xcode的界面模式。不妨随便尝试一下看看每个按钮都是做什么用的。

2.导航栏视图(navigator view)位于界面左侧,显示当前项目包含的各类源文件。

3.主视图(main view)位于界面中央,用于显示在左侧导航视图里选中的文件当中的内容;你通常可以在这个视图中编写代码或调整应用的设置。

4.检查器视图(inspector view)位于界面右侧,当你在主视图中选择了特定的元素之后,这里会显示更多的详情和设置。

在左侧导航栏中选择最上方的项目名称,主视图中会呈现当前项目的详细信息,如下图所示:

06-summary-ios-development-basic-xcode-tutorial-.png

在上图所示的状态下,主视图包括两部分:

  • Project:涉及创建产品所必需的源文件、资源和数据。
  • Target: 涉及产品实际创建过程中所需的设置。

选择Project或Target后,右侧都会出现相应的设置。

让项目运行起来

点击工具栏中的Run按钮,当前项目会按照Stop按钮右侧菜单中所做的设置在模拟器或实际设备中运行起来。

由于我们刚刚新建的项目,还没有做任何修改,所以你现在在模拟器中只能看到一个空白屏幕,如下图所示:

07-simulator-ios-development-basic-xcode-tutorial-.png

理解项目中的各类文件

1.接口文件(interface file):我们要在这里声明每个class所涉及到的变量和方法。此类文件以.h作为扩展名。

2.实现文件(implementation file):我们要在这个文件中实际定义那些在接口文件当中声明的方法。此类文件以.m作为扩展名。

3.Interface Builder文件:顾名思义,这是用于打造应用界面的文件,在Xcode的Interface Builder中使用,以.xib作为扩展名。

4.预编译头文件(precompiled header file):这类文件会在缓存中编译和储存。在每个源文件被编译的过程中,预编译头文件会被自动添加进来。它们以.pch作为扩展名。你也可以在这些.pch文件中引入普通文件的声明。

5.框架(Frameworks):这里是开发应用所需用到的库(Library)。默认情况下,下列库会被自动添加。我们可以在需要的时候将其他iOS框架添加进来,也可以创建自己的库并引入到项目当中。

  • UIKit框架:用来渲染UI元素。
  • Foundation框架:用来控制底层数据类型。
  • Coregraphics框架:与Quartz 2D相关的功能。

6.参数表(Plist):属性列表文件,其中包含了应用程序执行时所需的各类设置信息。

7.Infoplist.strings:用来存储特定的属性值。

应用程序的入口点在什么地方?

任何基于C语言的程序都会从一个main function开始运行,我们的Objective C(面向对象C语言)程序也不例外,因为它是C语言的一个扩展集。

我们的main function在main.m文件当中。打开该文件后可以看到这样的代码:

#import <uikit /UIKit.h>
 
#import "TTTAppDelegate.h"
 
int main(int argc, char *argv[])
{
    @autoreleasepool {
        return UIApplicationMain(argc, argv, nil, NSStringFromClass([TTTAppDelegate class]));
    }
}

autorelease pool用来处理自动化的内存管理。

UIApplicationMain函数可以接收4个参数。前两个用于指示命令行参数当中有那些数字和变量列表是可以被忽略掉的;第三个用来指明哪个应用类(application class)是需要被实例化的,如果这个参数为“nil”,则UIApplication类会被默认使用。

第四个参数用来说明应用的代理实例(app delegate instance)属于哪个类。UIApplicationMain函数会使这个实例成为应用实例(第三个参数)的代理。这就意味着,每当UIApplication实例处于某种特定的状态,例如应用被激活或退回到背景模式时,这个代理都会被通知到。

现在,UIApplicationMain函数会调用一些属于代理实例的方法。在应用被加载的同时,application:didFinishLaunchingWithOptions:会被调用,它负责定义程序被加载后向用户展示的初始视图是怎样的。

应用已经被加载完毕,UIApplicationMain函数会持续运行,管理事件循环,对用户接下来的相关行为进行响应。

应用代理的加载方法(AppDelegate Launch Method)

正如前面提到的,application:didFinishLaunchingWithOptions:是应用加载之后调用的第一个方法。

它会创建一个UIWindow对象,用来管理呈现在设备屏幕上的视图。UIWindow对象处于视图层级的顶端。

它还会创建一个视图控制器对象(View Controller Object),并将其添加为Window对象的根视图控制器(Root View Controller),用于呈现视图控制器当中的视图。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.
    self.viewController = [[TTTViewController alloc] initWithNibName:@"TTTViewController" bundle:nil];
    self.window.rootViewController = self.viewController;
    [self.window makeKeyAndVisible];
    return YES;
}

Interface Builder

让我们一起探索一下Interface Builder吧。

在左侧的导航面板中选中TTTViewController.xib文件。

在主视图中选择“Objects”下的“View”,此时右侧会呈现一个视图对象。

在右侧面板中点击属性检查器(Attributes Inspector)按钮。

在属性检查器中调整视图的背景色。

08-outline-ios-development-basic-xcode-tutorial-.png

在右侧检查器下方的面板中选择对象库(Object Library)。

从对象库里拖拽一个按钮对象到主视图当中。

双击按钮,在其中添加一些文字。

09-interface-builder-ios-development-basic-xcode-tutorial-.png

点击工具栏当中的Run按钮,应用就会在模拟器当中运行了。

10-test-ios-development-basic-xcode-tutorial-.png

你可以花点时间在Interface Builder中随便玩玩,看看各种设置会对界面产生怎样的影响。

小结

到目前为止,你已经可以在Xcode中创建一个简单的静态页面了。你的iOS开发之旅刚刚起步,在接下来的一篇里我们继续上路吧。

译文代表原作者观点。欢迎发表评论,或到译者微博进一步交流探讨。

本站原创编译文章。如需转载,请注明:本文来自Be For Web
译者信息: C7210 - 交互设计师、UX热爱者、译者、猫奴、音乐玩家,现就职于大众点评网用户体验设计部(DPUX)
评论 (4)
谢谢楼主的分享,最近也买了《c语言入门》和《objective-c基础教程》,哇哇,啃的好辛苦,不过想着来年生完宝宝,能学会了给娃娃也做个游戏什么的,拼了命啃吧!
好棒的目标!
果然有点看不太懂。。。 我也想搞一个自己的ios玩闹。。
建议买几本书正式学学看呗
发表评论