用InterfaceBuilder設计用户界面.docxVIP

iOS 参考库 Apple Developer 搜索搜索 iOS 参考库 Xcode 快速入门Companion File 目录 下页上页 教程：用 Interface Builder 设计用户界面Interface Builder 是一个集成在 Xcode 中可视化的界面编辑器。您可以使用 Interface Builder 为 iOS 和 Mac OS X 下的应用程序设计界面。通过 Interface Builder 的图形化环境，您可以把窗口，视图，控制器，菜单以及其他可视化元素组合到一起。您可以排列这些元素，设置属性，建立它们之间连接关系，然后保存在一个叫作 nib 的资源文件里。Nib 文件保存您的对象，包括它们的配置和布局信息。这些内容在运行时被加载用来在您的程序中生成实际的对象。在本教程中，您将使用 Interface Builder 为一个简单的 Mac OS X 应用程序设计界面，这个应用程序的名字叫做 QCDemo，它的功能是查看 Quartz Composer compositions。Quartz Composer 是一个开发工具，能够处理和渲染图形数据。它的图形化编程环境能帮您开发图形处理模块，也就是 compositions，您甚至不需要写一行关于图形的代码就能做到。注意：要动手完成这个教程，必须安装 Mac OS X v10.6.6 或以上版本以及 Xcode 4.0 或以上版本。使用 Interface Builder 创建用户界面当您完成这个教程时, QCDemo 窗口会如图2-1所示。这个窗口包含一个用来显示 composition 的视图，一个用来加载新 composition 的按钮，和一个用来切换播放/暂停的按钮。图 2-1?QCDemo 窗口 创建这个界面的过程中，您会接触到 Interface Builder 里一些经常用到的功能。让我们一步步开始吧。创建查看器要做的第一件事是创建一个 Quartz Composer 查看器。选择工程模板。打开 Xcode，依次点击菜单 File New New Project。Mac OS X 下选择 Application。选择 Cocoa Application 模板。点击下一步。设定新工程的一些选项。将产品命名为 QCDemo。指定公司标识 (或接受默认标识)。确认没有设置其他选项。点击下一步。创建工程。为新工程选择一个文件夹的位置。确认 Source Control 未被设定。选择创建。添加 Quartz 框架到工程目标中。在工程浏览器选择工程 QCDemo。在工程编辑器中选择 Targets 下的 QCDemo。在 Summary 面板，在 Linked Frameworks and Libraries 下点击 Add (+) 按钮。 在列表中选择 Quartz.framework 并点击 Add 按钮。 (提示：在文本框中输入 quartz 可滤选列表。)在代码中引入 Quartz 框架的头文件。在工程浏览器中选中文件 QCDemoAppDelegate.h。在代码编辑器中找到行 #import Cocoa/Cocoa.h。在这一行后面增加一行 #import Quartz/Quartz.h。 在该教程的后面您还会不断地修改这个文件。打开 Interface Builder 文件。在工程浏览器中找到 nib 文件 MainMenu.xib。点击 MainMenu.xib, 使它在 Interface Builder 编辑面板里打开。依次点击 Xcode 的菜单栏 View Navigators Hide Navigator 使我们更加专注于 Interface Builder。如果 Interface Builder 左侧未能像下图一样显示，点击左下角的铵钮切换到大纲视图。设置 QCDemo 窗口的大小。依次点击 Xcode 菜单 View Utilities Size Inspector。在 Interface Builder 编辑器左边的大纲视图里，选择 QCDemo 的窗口。未被选中前，它不会出现在 Interface Builder 编辑器的画板里。在 Size 查看器里, 设置窗口宽度为 480 高为 420。 输入完高度按一下回车键。勾上 Minimum Size 选项。 确认最小尺寸也设置为 480 x 420。添加一个 Quartz Composer 视图到 QCDemo 窗口。确认 Object library 在 Size 查看器下方是可见的，否则点击菜单 View Utilities Object Library 让它出现。在库下方的搜索框里输入 quartz composer。从库里将 Qu