基础辅助教程:XCode 4.2的Storyboard

野生的世界 2012-07-25

小弟是刚刚接触ios5,对storyboard也是茫然不知其为何物,goole了下发现一篇英文的入门教程,看了下还是很基础的,比较适合我这样的新手,我大概翻译了下供大家参考,我英文也是很一般,如果有错误的地方还请大家指正.

以下为翻译内容:

基础辅助教程:XCode4.2的Storyboard

今天我准备做一个短暂的辅助教程关于怎么用Xcode4.2里边的Storyboard.当storyboard出现的时候相比于以前IB的工作方式有些让人茫然不解,我也感觉苹果在这个技术上真的打了一个曲线球.

实际上当你开始使用它的时候并不是完全那么糟糕,这个教程将会展现用一个按钮怎么连接两个视图控制器,在这个过程中不会有一行代码.

废话就说这么多,现在让我们进入正题,马上建立一个新的Xcode工程.

1.建立Demo工程

我们将用SingleViewApplication模板,我们给它取名为Demo.为了简单起见我们这个教程只针对于iPhone.记住勾选"useStoryboard"和"UseAutomaticReferenceCounting"这两个选项(虽然在这次教程里我并不会讲解ARC,注:ARC也就是IOS5内存管理的自动引用计数技术).我不准备给我的类加任何前缀所以我把那一个位置留空.

现在你应该拥有了你的新的空工程,包含你的AppDelegate,一个singleViewController,和一个storyboard文件.

在我们开始storyboard的学习之前,让我们先建立一个新的viewcontroller.右击Demo组(就在AppDelegage的上面),然后选择"NewFile",在CocoaTouch组里选择UIViewControllersubclass然后我们给它取名为"NewViewController"

确保下边的两个选项都没有被标记.

现在你就有一个工程像下边这幅图的样子.

2.Storyboard

现在我们进入正题,storyboard将允许我们定义在我们应用程序中不同的视图之间的相互作用关系.在一个程序中你可以拥有一个或多个storyboard,这并不是说你真正的需要它().让我们点击storyboard文件然后看看都有些什么.

首先我们看到我们的工程有了我们第一个viewcontroller而且也包含我们程序的入口点.

现在我们首先要做的就是添加一个navigationcontroller以便我们能够推入或弹出新的视图.幸运的是Xcode我们提供了一个简单的做此事情的方法.

左键单击ViewController的图片,然后在屏幕的顶部选择Editormenu,然后选择EmbedIn最后选择NavigationController.Xcode非常友好的我们加入了一个新的navigationcontroller而且把所有的为了使它能够工作的后台工作都做好了.

谢谢Xcode,但是我想如果这个选项能够更明显一点它会更实用的.现在你拥有了两个box在你的storyboard上,如下图所示

非常棒!现在我们需要一个button来展示从一个视图转到另一个.所以现在让我们添加一个button到ViewController.只需要托一个"roundedrectbutton"从对象列表里到viewcontroller上(注意如果你的视图进行了缩放的话你是无法托项目到view上的);

让我们给这个button命名为"NewView".让我们也给navigationbar一个标题"OriginalView",我们可以双击导航条并输入.

现在我们需要一个新的ViewController对象来展现我们的"NewViewController",在右侧托一个已经存在的viewController进来.添加一个label写上比如"MyNewView"或什么其它的.这样当我们测试把这个视图推入的时候我们就能知道了.现在你的soryboard应该看起来像下面这样

现在我们需要链接我们的viewController对象到我们的"NewViewController"子类.

选择你刚才托入的viewcontroller然后选择IdentityInspector在右上方,选择第三个标签,从Class里选择"NewViewController".最终,我们需要告诉第一个视图的按钮,当它被点击的时候我们想要移入第二一个视图.简单的按住Ctrl然后从button托动到新的viewcontroller.当我们做完这些时将会出现一个选项列表,有三个选项(push,modal和custom).选择Push.这是可行的因为我们有一个NavigationController在我们的工程里.如果我们没有在开始把navigationcontroller加进来,这样做是没有意义的,在运行的时候点击button将不会任何事情发生.不管怎么样,你还可以选择"modal"选项它并不需要navigationcontroller.

也注意当我们连接了两个视图以后,navigationbar将会出现在第二个视图.

你的最终的storyboard应该看起来像下边这个样子

现在如果你运行你的工程,你将看到第一个视图,点击按钮出现第二个视图.

可能唯一需要提到的就是如果我们需要给新的视图传送数据我们可以实现方法"prepareForSegue:sender:".当然你也可以从视图返回数据用delegates就像我们平时做的那样.

原文地址:http://developer.apple.com/library/IOS/#documentation/General/Conceptual/Devpedia-CocoaApp/Storyboard.html

相关推荐