iOS开发8：使用Tool Bar切换视图

以前讨论的都是单视图应用程序，而在实际应用中，咱们可能要多个视图，并根据用户的须要切换视图。

iOS中几种典型的多视图程序：

（1）Tab Bar Application：程序的底部有一排按钮，轻触其中一个按钮，相应的视图被激活并显示出来；

（2）Navigation-Based Application：其特色是使用navigation controller，而navigation controller使用navigation bar来控制多级视图；

（3）Tool Bar Application：程序的底部有一个工具条，利用工具条中的按钮来切换视图，常常与Tab Bar Application混淆。

此次要作的例子就是使用了Tool Bar，只是简单了实现了视图切换功能，并添加一些视图切换时的效果。在作例子以前，首先要了解一下视图的切换原理。

通常来讲，一个多视图的程序要至少三个View Controller，其中一个做为Root Controller。所谓Root Controller，是指用户看到的第一个Controller，而且在程序加载时这个Controller就加载了。

Root Controller一般是UINavigationController或者UITabBarController的子类，也能够是UIViewController的一个子类。

在多视图程序中，Root Controller的工做得到两个或者更多的其余视图，并根据用户输入显示不用的视图。

除Root Controller以外，其余视图就做为Content Controller，能够理解为可能会显示出来的各类视图。

为了更好地理解多视图程序的结构，咱们从Empty Application开始建立咱们的程序。

一、建立工程：

运行Xcode 4.2，新建一个Empty Application，名称为MultiView，其余设置以下图：

二、建立3个View Controller：

依次选择File — New — New File，打开以下窗口：

找到UIViewController subclass并单击Next，打开下面的窗口：

输入名称RootViewController，而且保证Subclass of选择UIViewController，下面的两个选框都不选；按照一样的步骤新建两个View Controller，名称分别是FirstViewController和SecondViewController。建好后，在Project Navigation中显示文件以下：

三、为三个View Controller建立.xib文件：

依次选择File — New — New File，打开以下窗口：

在左边选User Interface，右边选View，单击Next，在新窗口中的Device Family中选择iPhone，单击Next，打开以下窗口：

输入名称RootView，单击Create，建立了一个.xib文件。用一样的方法再建立两个.xib，名称分别是FirstView和SecondView。

四、修改App Delegate：

4.1 单击AppDelegate.h，在其中添加代码，在@interface以前添加@class RootViewController;在@end以前添加@property (strong, nonatomic) RootViewController *rootViewController;添加以后的代码以下：

#import <UIKit/UIKit.h>
@class RootViewController;
@interface AppDelegate : UIResponder <UIApplicationDelegate>
@property (strong, nonatomic) UIWindow *window;
@property (strong, nonatomic) RootViewController *rootViewController;
@end

4.2 单击AppDelegate.m，修改其代码。在@implementation以前添加#import "RootViewController.h"，在@implementation以后添加@synthesize rootViewController;而后修改didFinishLaunchingWithOptions方法以下：

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    // Override point for customization after application launch.
    self.rootViewController = [[RootViewController alloc] initWithNibName:@"RootView" bundle:nil]; 
    UIView *rootView = self.rootViewController.view; 
    CGRect rootViewFrame = rootView.frame; 
    rootViewFrame.origin.y += [UIApplication sharedApplication].statusBarFrame.size.height; 
    rootView.frame = rootViewFrame; 
    [self.window addSubview:rootView]; 
    self.window.backgroundColor = [UIColor whiteColor];
    [self.window makeKeyAndVisible];
    return YES;
}

① self.rootViewController = [[RootViewController alloc] initWithNibName:@"RootView" bundle:nil];

这行代码用于从RootView.xib文件中初始化rootViewController，注意initWithNibName:@"RootView"中不要后缀名.xib

② rootViewFrame.origin.y += [UIApplication sharedApplication].statusBarFrame.size.height;

使得RootViewController的视图不会被状态栏挡住

五、修改RootViewController.h：

单击RootViewController.h，在其中添加两个属性和一个方法，以下：

#import <UIKit/UIKit.h>
@class FirstViewController;
@class SecondViewController;

@interface RootViewController : UIViewController

@property (strong, nonatomic) FirstViewController *firstViewController;
@property (strong, nonatomic) SecondViewController *secondViewController;
- (IBAction)switchViews:(id)sender;

@end

六、打开RootView.xib，在坐边选择File’s Owner，在右边打开Identity Inspector，在Class下拉菜单选择RootViewController：

这样，咱们就能够从RootView.xib文件向RootViewController建立Outlet和Action了。

七、为RootView.xib添加工具栏：打开RootView.xib，拖一个Tool Bar到视图上，双击Tool Bar上的按钮，修改其名称为Switch Views：

八、添加Action映射：

选中Switch Views按钮，按住Control，拖到File’s Owner，松开鼠标后选择switchViews方法：

九、选择File’s Owner，按住Control键，拖到View，松开鼠标，选择view：

十、修改RootViewController.m：

打开RootViewController.m文件，在@implementation以前添加代码：

#import "FirstViewController.h"
#import "SecondViewController.h"

在@implementation以后添加代码：

@synthesize firstViewController;
@synthesize secondViewController;

接下来修改viewDidLoad方法，这个方法默认是被注释掉的，先去掉其周围的注释符，而后修改其代码以下：

- (void)viewDidLoad
{
    self.firstViewController = [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil];
    [self.view insertSubview: firstViewController.view atIndex:0];
    [super viewDidLoad];
}

添加switchViews方法：

- (IBAction)switchViews:(id)sender {
    if (self.secondViewController.view.superview == nil) {
        if (self.secondViewController == nil) { 
            self.secondViewController = [[SecondViewController alloc] initWithNibName:@"SecondView" bundle:nil]; 
        } 
        [firstViewController.view removeFromSuperview]; 
        [self.view insertSubview:self.secondViewController.view atIndex:0]; 
    } else {
        if (self.firstViewController == nil) { 
            self.firstViewController = 
            [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil]; 
        } 
        [secondViewController.view removeFromSuperview]; 
        [self.view insertSubview:self.firstViewController.view atIndex:0]; 
    } 
}

修改didReceiveMemoryWarning方法：

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    if (self.firstViewController.view.superview == nil) { 
        self.firstViewController = nil; 
    } else { 
        self.secondViewController = nil; 
    } 
}

十一、打开FirstView.xib文件，选择左边的File’s Owner，而后在Identity Inspector中选择Class为FirstViewController；而后按住Control键从File’s Owner图标拖到View，在弹出的菜单选择view。为SecondView.xib进行一样的操做，不过Class选择为SecondViewController。

十二、打开FirstView.xib文件，选择View，打开Attribute Inspector，进行以下设置：

对SecondView.xib进行一样设置，不过背景颜色设成红色。

1三、此时运行程序，你会看见刚启动的时候，程序显示的绿色背景，轻触Switch Views按钮后，背景变成了红色。不断轻触按钮，背景不断变换。

1四、添加切换背景的动画效果：

打开RootViewController.m，修改其中的switchViews方法以下：

- (IBAction)switchViews:(id)sender { 
    [UIView beginAnimations:@"View Flip" context:nil]; 
    [UIView setAnimationDuration:1.25]; 
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    if (self.secondViewController.view.superview == nil) { 
        if (self.secondViewController == nil) { 
            self.secondViewController = [[SecondViewController alloc] initWithNibName:@"SecondView" bundle:nil]; 
        } 
        [UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES]; 
        [self.firstViewController.view removeFromSuperview]; 
        [self.view insertSubview:self.secondViewController.view atIndex:0]; 
    } else { 
        if (self.firstViewController == nil) { 
            self.firstViewController = [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil]; 
        } 
        [UIView setAnimationTransition: UIViewAnimationTransitionCurlUp forView:self.view cache:YES]; 
        [self.secondViewController.view removeFromSuperview]; 
        [self.view insertSubview:self.firstViewController.view atIndex:0]; 
    } 
    [UIView commitAnimations]; 
}

注意四个表示切换效果的常量：

UIViewAnimationTransitionFlipFromLeft
UIViewAnimationTransitionFlipFromRight
UIViewAnimationTransitionCurlDown
UIViewAnimationTransitionCurlUp

分别表示从左翻转、从右翻转、向下卷、向上卷。
运行后翻页效果以下：

 

最终代码：http://www.oschina.net/code/snippet_164134_10918