3.3     应用实战与讲解
这一节我们将实际编写这个应用,边做边讲解的方式。按照搭建应用骨架、视图翻转动画、主视图UI和代码、主视图控制器代码、背后视图UI和代码、背后视图控制器,这样的顺序编写和讲解。
3.3.1     构建应用骨架
在本书采用Xcode3.2工具中提供了一个编写实用型应用程序的模板,图3-11是Xcode3.2的模板,其中Utility Application选项就是创建实用型应用程序。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_的

图3-11 实用型应用模板

但是遗憾的是本应用的原作者代码,没有采用Xcode3.2模板,我们比较一下它们的不同,使用Xcode3.2生成的类图如图3-12所示。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_应用程序_02

图3-12  Xcode3.2生成的类
    为了尊重原作者,在本书中如果涉及到由于历史版本引起的问题,我们还是按照原作者应用始版本介绍和构建应用。
比 较类图3-8和3-12会发现,Xcode3.2没有MainView 和FlipsideView两个自定义视图类,而是直接采用UIView类,Xcode3.2中MainViewController类还实现了一个 FlipsideViewControllerDelegate协议,FlipsideViewControllerDelegate协议是旧版本中没有 的,而Xcode3.2中没有RootViewController控制器类。这正是两个版本区别的关键,在旧版本中视图跳转和返回都是通过根控制器 RootViewController实现控制的,在Xcode3.2中是通过MainViewController实现 FlipsideViewControllerDelegate协议视图翻转控制的,MainViewController即使主视图控制器也是根控制 器。
由于我们要构建与旧版本一样的类,所以要添加MainView、FlipsideView和RootViewController类。先创建 MainView选择Main View文件夹,右键菜单New File弹出对话框如图3-13所示,选择Objective-C class,Subclass of为UIView,选择好后点击Next,在类名中输入MainView。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_iPhone_03

图3-13 创建UIVew
MainView生成之后还需要修改对应的nib文件,在Xcode中双击MainView.xib然后Interface Builder会打开MainView.xib窗口如图3-14所示,

《iPhone与iPad开发实战—iOS经典应用剖析》连载三_的_04


图3-14 MainView.xib窗口
从图3-14中可以看到View的类型是UIView,我们需要把它改成为MainView,为了实现这一个目的,请选择菜单Tools->Inspector打开检查器窗口,选择 标签打开检查器如图3-15所示,选择MainView类。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_iPhone_05

图3-15视图检查器
选中双击Main View打开设计窗口如图3-16所示,该视图是使用Xcode3.2工具生成的,我们需要恢复到默认视图状态,如图3-17所示。
        
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_开发_06

图3-16 Xcode3.2模板生成视图                             图3-17 修改后视图
为了达到这一效果需要删除 按钮,并把视图背景修改颜色为默认颜色。删除 按钮过程是用鼠标点中该按钮,使用键盘delete就可以删除了,而视图背景修改需要打开检查器窗口选择标签 后如图3-18,修改Background属性使背景颜色被默认白色。

  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_开发_07

图3-18 修改视图背景
按 照上面的方法创建FlipsideView类,该类创建完成需要修改它对应的FlipsideView.xib文件,在Interface Builder会打开FlipsideView.xib窗口,选中双击Flipside View打开设计窗口如图3-19所示,该视图是使用Xcode3.2工具生成的,我们需要恢复到默认视图状态,如图3-20所示。
          
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_应用程序_08

              图3-19 Xcode3.2模板生成视图                                图3-20 修改后视图
为达到图3-20效果,需要删除Title部分导航栏,在本应用中导航栏是通过代码动态添加到视图上面去的,而不是在视图设计窗口中拖拽上去的。删除导航栏和修完成背景后我们会发现视图变成如图3-21所示带有状态栏。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_应用程序_09

图3-21 状态栏视图
我们需要去掉这个状态栏,打开视图检查器如图3-22所示,将Status Bar选择为Unspecified。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_iPhone_10

图3-22 视图检查器
并 配置它们的创建过程完全一样这里就不再过多介绍了。下面介绍RootViewController创建和配置,选择一个文件夹,右键菜单New File弹出对话框如图3-23所示,选择UIViewController subclass,并在Options部分去掉With XIB for user interface,就是不创建nib文件。选择好后点击Next,在类名中输入RootViewController。
  
《iPhone与iPad开发实战—iOS经典应用剖析》连载三_应用程序_11

图3-23 创建视图控制器
RootViewController 生成之后还需要修改MainWindow.xib文件,在Xcode中双击MainWindow.xib然后Interface Builder会打开MainWindow.xib窗口如图3-24所示。点中MainViewController后选择菜单 Tools->Inspector打开检查器窗口,选择  标签打开检查器窗口在Class中选择RootViewController类。

《iPhone与iPad开发实战—iOS经典应用剖析》连载三_开发_12


图3-24 MainWindow.xib窗口