iPhone对独立软件开发者来说是个很棒的平台。也许你都没想过能简单的使用一些代码就拥有实现自己想法的应用，并有数以百万计的潜在客户！
最近，我已经得到了很多人新的iOS开发者询问如何开始的问题。所以，我认为写一个专为初学者的教程系列将是有益的。
但我们不会只专注一个主题，我们将深入的创建一个完整功能的应用。到最后，你将尝试到iPhone开发的许多领域,为未来开发您的应用做好准备。
那么，什么是我们要的应用？嗯，有一个背后的故事......
一天晚上，我看到PotatoBug，并开始吓坏了，因为它是如此之大又丑！然后，我就痴迷于在线寻找各种可怕的虫子图片。并为传播它们为乐，我们打算使一个应用程序-评级可怕的虫子！
制作这个应用程序的同时，我们将介绍一些iPhone开发中最常用的主题：
iPhone开发者入门
如何使用模型对象在您的应用中存储数据
如何使用TableViews–包括添加与删除行
如果为表行创建一个详情视图
如何支持Portrait&Landscape双方向
如何使用Navigation控制器
如何使用图片选择器
如何使用一般控件，如文本字段，按钮，图片视图
如何添加图标与默认图片
奖励：如何处理长时间运行的操作
看起来似乎很多东西，不过不要紧张–我们不怕有错误！
此教程分三段，这里是第一段,我们将讨论如何加载我们的模型的虫子列表，并将它们显示在表视图上。（跳转到第二部分或第三部分）
本教程是iOS开发初学者的，但它假定您熟悉Objective-C和一般编程。如果您不了解Objective-C，请先阅读苹果Objective-C
编程语言手册。
|
夜狼
翻译于8天前
1人顶
顶翻译的不错哦!
|
您需要什么
首先第一件事情–要开发iPhone，你需要一台Mac。几乎任何一台Mac都可以，只要支持运行最新版本的MacOS系统，Lion。但是如果你想省钱，你可以选择相对便宜的Mac
Mini，它做为开发机也是没问题的。
然后，你需要一个XCode副本，Apple’siOS开发者IDE。如果您还没有，在iPhoneDevCenter注册一个免费帐户并从Mac
AppStore下载Xcode。
如果你愿意，你可以注册为付费iPhone开发者，可让您在AppStore上发布您的应用程序，但如果你只是想尝试iOS开发，免费帐户就行了。
如果你严肃对待iOS开发，您可能需要一些iOS设备(iPhone/iPhone4/iPodTouch/iPad)更好。你可以只使用模拟器测试，但是一些API不会在模拟器上工作，您将需要一个物理设备进行测试。
就是这些了-那么如果你还没准备好，马上下载XCode，并启动起来，让我们继续！
|
夜狼
翻译于8天前
1人顶
顶翻译的不错哦!
|
Hello,TableView!
我们从iPhone里最常见的控件–TableView开始。您可以已经在很多应用中看到过TableView，这里有些示例：
所以无论如何，我们在应用程序的第一个屏幕将有其中之一，显示一个可怕的虫子列表！
在XCode菜单选择File\NewProject，选择iOS\Application\Master-DetailApplication,然后点击Next。
在下一页中，输入产品名称（ProductName）为ScaryBugs，公司识别（companyidentifier）字符串(com.yourcompanyname或com.yourname更好),选择设备类型（DeviceFamily）为iPhone，确保UseStoryboard与UseAutomaticReferenceCounting为选中状态。完成后点击Next。
选择一个位置保存您的项目并点击Create。在我们进行任何工作之后，让我们看看现在是什么样子的！在屏幕顶部的工具栏列表中选择iPhoneSimulator然后点击Run按钮。如果一些正常，您将在你的模拟器中看到如下界面：
您可以点“+”按钮创建一个新实体，点击新行看到一个它的详情视图：
正如你看到的，我们将使用选择的Master-DetailApplication模版开始我们的项目。
我们不会深入这个模版，因为这超出了本教程，只需要注意我们有一个空的表视图和详情视图已经为我们准备好-我们只需要使用数据填充它们！
为了这个目标，首先让我们创建一个类用于保存我们的虫子数据。
|
夜狼
翻译于8天前
1人顶
顶翻译的不错哦!
|
一个虫子数据模型：结构
请注意，XCode项目浏览器包含了一个文件夹层次结构：
模版已经创建了一个根组和一个SupportingFiles组。这些组只是用于组织结构的目的，所以你可以自由的按你的需要改变。在我们的例子中，我们要在这个项目中有相当数量的文件，让我们做一点整理。
首先，创建一个新的组用于存储用户界面文件。control-clickScaryBugs组，在菜单中选择NewGroup。然后control-click新组选择重命名，将其命名为“GUI”。将根组中的所有文件拖到GUI组中（但不包括SupportingFiles）。最后看起来应该像这样：
现在创建第二个新组，命名为“Model”，因为我们将添加一些数据模型类到其中。现在您的树应该像这样：
在我们开始之前，让我们来谈谈我们将如何组织：
ScaryBugData:包括虫子名称与评分。
ScaryBugDoc:包括全尺寸图片，缩略图，ScaryBugData。
我们做如上的设计让本教程后面要做的事情变的容易，我们将在磁盘上保存我们的数据，实现文件共享等。
|
夜狼
翻译于8天前
1人顶
顶翻译的不错哦!
|
一个虫子数据模型：实现
好的，现在开始吧！Control-clickModel组并点击“NewFile…”。选择iOS\CocoaTouch\Objective-Cclass模版点击Next。
命名类名为ScaryBugData,父类（Subclassof）为NSObject，点击Next。
最后点击Create。如果一切正常，您的项目浏览器现在应该看起来像这样：
好的，来创建我们的ScaryBugData类。使用下面的代码替换ScaryBugData.h文件：
01 | #import
<Foundation/Foundation.h> |
03 | @interface
ScaryBugData:NSObject |
05 | @property
(strong)NSString*title; |
06 | @property
(assign) float rating; |
08 | -
(id)initWithTitle:(NSString*)titlerating:( float )rating; |
这非常简单-我们只是定义了一个对象的两个属性-一个字符串用于虫子名称，一个浮点数用于评分。这里我们用了两个属性的属性（propertyattributes）：
strong:这描述运行时应该自动保持对象的强关联。这是一个神奇的方式告诉ARC运行时保证一个强关联到对象时不会释放对象，当它不再有关联时自动释放。更多详情，查看我的Beginning
ARCiniOS5Tutorial。
assign:这意味着属性是直接设置，不涉及内存管理。这通用是用于像float这样的元类型（非对象）。
我们还定义了一个初始化方法，这样我们可以在创建虫子时设置标题与评分。
切换到ScaryBugData.m并使用下面代码替换：
01 | #import
"ScaryBugData.h" |
03 | @implementation
ScaryBugData |
05 | @synthesize
title=_title; |
06 | @synthesize
rating=_rating; |
08 | -
(id)initWithTitle:(NSString*)titlerating:( float )rating
{ |
09 | if ((self
=[superinit])){ |
又是非常简单的一段。合成(synthesize)我们的属性并创建我们的初始化方法使用传入参数填充实例变量。注意我们使用了ARC，所以这里不需要实现dealloc。
好的，以上就是ScaryBugData。接下来还有同样的创建NSObject子类的工作，这次命名为ScaryBugDoc。
使用下面代码替换ScaryBugData.h：
01 | #import
<Foundation/Foundation.h> |
05 | @interface
ScaryBugDoc:NSObject |
07 | @property
(strong)ScaryBugData*data; |
08 | @property
(strong)UIImage*thumbImage; |
09 | @property
(strong)UIImage*fullImage; |
11 | -
(id)initWithTitle:(NSString*)titlerating:( float )rating
thumbImage:(UIImage*)thumbImagefullImage:(UIImage*)fullImage; |
这里没有什么特别的地方–只是创建了一些实例变量、属性和一个初始化方法声明。
使用如下代码替换ScaryBugDoc.m：
01 | #import
"ScaryBugDoc.h" |
02 | #import
"ScaryBugData.h" |
04 | @implementation
ScaryBugDoc |
06 | @synthesize
thumbImage=_thumbImage; |
07 | @synthesize
fullImage=_fullImage; |
09 | -
(id)initWithTitle:(NSString*)titlerating:( float )rating
thumbImage:(UIImage*)thumbImagefullImage:(UIImage*)fullImage{ |
10 | if ((self
=[superinit])){ |
11 | self.data
=[[ScaryBugDataalloc]initWithTitle:titlerating:rating]; |
12 | self.thumbImage
=thumbImage; |
13 | self.fullImage
=fullImage; |
好了-我们的数据模型完成！现在该创建一些数据并在表视图中显示它了。
|
夜狼
翻译于8天前
1人顶
顶翻译的不错哦!
|
一个不同类型的虫子列表
首先，设置我们的表视图让它能处理显示ScaryBugDocs列表。先修改表视图为动态行（而不是模版为我们生成的一个硬编码行）。
打开MainStoryboard.storyboard。它允许您查看应用中的多个“屏幕”布局。正如您看到的，这应用当前包含一个导航控制器（用它很容易在不多的屏幕间过渡切换），有一个名为"master"的根控制器和一个名为“detail”的第二控制器。
选择MasterViewController并在左边的导航面板中选择表视图（TableView）。在右边的检查器中设置Content为DynamicPrototypes。
这是一种允许你在故事板（Storyboard）编辑器中设计一个简单的表视图单元格的方式。这里只需要一个基本的单元格，所以只需要基本的样式。。
在左边的导航面板选中表视图单元格（TableViewCell），在属性检查器中设置Style为Basic，Identifier为MyBasicCell。
有关创建自定义单元格的更多信息，查看我的BeginningStoryboardsiniOS5Tutorial。
|
夜狼
翻译于6天前
1人顶
顶翻译的不错哦!
|
好了，现在我们的表视图已经设置，只需要更新一些代码使用一个虫子列表填充这个表视图。
我们将使用一个NSMutableArray类型的ScaryBugDocs变量保存列表，这个类型是可动态改变大小的数组集合。
在MasterViewController.h的@interface与@end之间添加下面这行：
1 | @property
(strong)NSMutableArray*bugs; |
这将用于我们保存虫子列表的实例变量、属性。
转到MasterViewController.m文件做如下更改：
02 | #import
"ScaryBugDoc.h" |
03 | #import
"ScaryBugData.h" |
09 | self.title
=@ "Scary
Bugs" ; |
11 | //
替换shouldAutorotateToInterfaceOrientationwith:方法的return |
14 | //
替换tableView:numberOfRowsInSection方法内容 |
17 | //
替换tableView:cellForRowAtIndexPath如下： |
18 | -
(UITableViewCell*)tableView:(UITableView*)tableView |
19 | cellForRowAtIndexPath:(NSIndexPath
*)indexPath |
21 | UITableViewCell
*cell=[tableView |
22 | dequeueReusableCellWithIdentifier:@ "MyBasicCell" ]; |
23 | ScaryBugDoc
*bug=[self.bugsobjectAtIndex:indexPath.row]; |
24 | cell.textLabel.text
=bug.data.title; |
25 | cell.imageView.image
=bug.thumbImage; |
好了，最后讨论一些有趣的东西！
首先，注意我们设置了一个名为“title”的属性为字符串“ScaryBugs.”,“title”是一个特殊的视图控制器内建属性。当在一个导航控制器中显示一个视图控制器时，它将当前的“title”属性显示在标题栏上。所以通过设置它，我们将看到“ScaryBugs”在顶上！
下一个，注意我在shouldAutorotateToInterfaceOrientation中直接返回YES，这告诉OS我们可以支持所有方向–竖屏，横屏与此倒置的它们。因为这个类是UITableViewController，所以不需要更多处理-视图将自动旋转!
下一个,当构建一个动态行的表视图时，我们需要重写numberOfSectionsInTableView与numberOfRowsInSection告诉系统有多少节/行(sections/rows)将在表视图中显示。这里只有一个节，所以我们没有重写numberOfSectionsInTableView因为模版已经设置了返回1。对于行，我们只需要返回我们的虫子数组的对象数。
|
夜狼
翻译于6天前
1人顶
顶翻译的不错哦!
|
最后，我们实现tableView:cellForRowAtIndexPath，它大概是实现一个表视图时中最重要方法。这里你设置一个特定行的单元格如何显示。系统将为每一行调用一次该方法，这样你就可以设置它。
因为它很重要，让我们细看一下这个方法：
01 | -
(UITableViewCell*)tableView:(UITableView*)tableView |
02 | cellForRowAtIndexPath:(NSIndexPath
*)indexPath |
04 | UITableViewCell
*cell=[tableView |
05 | dequeueReusableCellWithIdentifier:@ "MyBasicCell" ]; |
06 | ScaryBugDoc
*bug=[self.bugsobjectAtIndex:indexPath.row]; |
07 | cell.textLabel.text
=bug.data.title; |
08 | cell.imageView.image
=bug.thumbImage; |
第一行调用了“dequeueReusableCellWithIdentifier”帮助函数尝试返回一个可重用的单元格。这是什么意思？
是这样的，它是一个重要的性能优化。要知道表视图可能包括非常大是不是的行，但在屏幕上一次只显示有限的行。这样做不需要每次新行进入屏幕时都创建新行，系统可通过重用一个已经创建但滚动出屏幕之外的单元格来提高性能。
那么调用dequeueReusableCellWithIdentifier，如果没有可重用的行，就基于您在InterfaceBuilder中的设置创建一个新单元格（记得我们设置它为基本样式并命名为“MyBasicCell”？）。
|
夜狼
翻译于6天前
1人顶
顶翻译的不错哦!
|
在故事板（Storyboard）编辑器中你可以自定义单元格的布局或使用一个内建的。这里我们选择包括一个文本标签和图片的基础样式。
如果您感兴趣，可以查看Table
ViewProgrammingGuide中的StandardStylesforTable-ViewCells主体看看基本表视图的各种样式选项效果。
最后，我们通过单元格的textLabel与imageView(基本样式可用的)设置要显示的内容。
信不信那是所有我们需要做！现在我们只需要设置要显示的表视图的一些示例数据。
|
夜狼
翻译于6天前
1人顶
顶翻译的不错哦!
|
可怕的虫子图片!
当然我们需要一些可怕的虫子图片！您可以浏览互联网找到一些或直接下载我在stock.xchng上找到的Scary
BugPictures。
准备好图片文件后，将他们拖动到你的项目导航树根节点。在选项中确保“Copyitemsintodestinationgroup’sfolder(ifneeded)”已选中，然后点击Add。
接着打开AppDelegate.m并做如下更改：
02 | #import
"MasterViewController.h" |
03 | #import
"ScaryBugDoc.h" |
05 | //
在application:didFinishLaunchingWithOptions方法开头 |
06 | ScaryBugDoc
*bug1=[[ScaryBugDocalloc]initWithTitle:@ "Potato
Bug" rating:4
thumbImage:[UIImageimageNamed:@ "potatoBugThumb.jpg" ]
fullImage:[UIImageimageNamed:@ "potatoBug.jpg" ]]; |
07 | ScaryBugDoc
*bug2=[[ScaryBugDocalloc]initWithTitle:@ "House
Centipede" rating:3
thumbImage:[UIImageimageNamed:@ "centipedeThumb.jpg" ]
fullImage:[UIImageimageNamed:@ "centipede.jpg" ]]; |
08 | ScaryBugDoc
*bug3=[[ScaryBugDocalloc]initWithTitle:@ "Wolf
Spider" rating:5
thumbImage:[UIImageimageNamed:@ "wolfSpiderThumb.jpg" ]
fullImage:[UIImageimageNamed:@ "wolfSpider.jpg" ]]; |
09 | ScaryBugDoc
*bug4=[[ScaryBugDocalloc]initWithTitle:@ "Lady
Bug" rating:1
thumbImage:[UIImageimageNamed:@ "ladybugThumb.jpg" ]
fullImage:[UIImageimageNamed:@ "ladybug.jpg" ]]; |
10 | NSMutableArray
*bugs=[NSMutableArrayarrayWithObjects:bug1,bug2,bug3,bug4,nil]; |
12 | UINavigationController
*navController=(UINavigationController*)self.window.rootViewController; |
13 | MasterViewController
*masterController=[navController.viewControllersobjectAtIndex:0]; |
14 | masterController.bugs
=bugs; |
这里我们使用ScaryBugDoc初始化方法设置title,rating与image。生成四个ScaryBugDoc添加到将用于表格视图显示的NSMutableArray中。
说到这，我们可以获取指向指针RootViewController因为我们知道这是导航控制器堆栈中的第一个视图控制器。还有其他方法可以得到一个指针，但这是一个简单的方法。
|
夜狼
翻译于6天前
1人顶
顶翻译的不错哦!
|
这就是它！编译并运行你的应用程序，如果一切运作良好，你应该能在你的表视图中看到令人害怕的一系列虫子！
从这里去哪里？
这里是一个示例工程，有我们开发的这一系列教程的所有代码。
如果以上有让你困惑的内容或如果你希望我将一些内容讲得更详细，请告诉我们。
该系列的下部分，我们描述了如何为这些虫子创建详细视图(detailview)，使我们能编辑和评价这们的虫子！
|
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理
