iOS开发9：使用Tab Bar切换视图

概述上一篇文章提到了多视图程序中各个视图之间的切换，用的Tool Bar，说白了还是根据触发事件使用代码改变Root View Controller中的Content View。这次，我们还是讲一讲切换视图，不过这次使用的是Tab Bar。 这次要写的程序运行起来的效果是这样的：底部有几个图标，每个图标对应一个视图。每点击一个图标，对应的视图就会打开。如下图，就是我们做好的程序效果：   每个Tab

上一篇文章提到了多视图程序中各个视图之间的切换，用的Tool bar，说白了还是根据触发事件使用代码改变Root VIEw Controller中的Content VIEw。这次，我们还是讲一讲切换视图，不过这次使用的是Tab bar。

这次要写的程序运行起来的效果是这样的：底部有几个图标，每个图标对应一个视图。每点击一个图标，对应的视图就会打开。如下图，就是我们做好的程序效果：

 

每个Tab bar有一个对应颜色的视图。

为了搞清使用Tab bar切换视图的原理，我们还是从Empty Application开始创建我们的程序。

1、运行Xcode 4.2，新建一个Empty Application，名称为Tab bar Application，其他设置如下图：

2、为工程添加图标文件：

这里要添加的图标文件是用来定制各Tab bar的。首先新建一个Group，选择file — New — New Group，创建好后给新的Group重命名为Icons。然后，将准备好的四个图标文件拖到Group中，在d出的窗口选择copy items……(if needed)，如下图：

4、创建四个VIEw Controller：

选中Tab bar Application这个Group，然后选择file — New — New file，在d出的窗口，左边选择Cocoa touch，右边选择UIVIEwController subclass，之后选Next，在d出的窗口中，输入名称BlueVIEwController，并选中With xib，如下图：

然后选择Next，选好位置，点击Create，这样就创建了一个VIEwController。以同样的方式再创建三个，名称分别是GreenVIEwController，RedVIEwController，YellowVIEwController。

5、创建TabbarController.xib：

选中Tab bar Application这个Group，然后选择file — New — New file，在d出的窗口，左边选择User Interface，右边选择Empty：

然后点Next，在d出的窗口输入名称TabbarController，选好位置后点击Create。

之后，在Group中点击TabbarController.xib，你会发现跟BlueVIEwController.xib不一样，里边没有一个像VIEw一样的窗口，不要着急，我们拖一个Tab bar Controller到里边：

6、在上图中选择file’s Owner，打开IDentity Inspector，在Class一栏选择AppDelegate：

这样，我们就可以从TabbarController.xib向AppDelegate创建OutLet映射了。

7、打开Assistant Editor，保证Assistant Editor中打开的是AppDelegate.h，在左边选中Tab bar Controller，按住Control，往AppDelegate.h中创建映射：

然后在d出的窗口输入rootController，点击Connect：

打开AppDelegate.m，在dIDFinishLaunchingWithOptions方法中添加代码：

- (BOol)application:(UIApplication *)application dIDFinishLaunchingWithOptions:(NSDictionary *)launchOptions{    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];    // OverrIDe point for customization after application launch.    [[NSBundle mainBundle] loadNibnamed:@"TabbarController" owner:self options:nil];     [self.window addSubvIEw:self.rootController.vIEw];     self.window.backgroundcolor = [UIcolor whitecolor];    [self.window makeKeyAndVisible];    return YES;}

8、单击TabbarController.xib，拖两个Tab bar Item到Tab bar上：

9、选中第一个VIEw Controller，在右边打开IDentity Inspector，在Class中选择BlueVIEwController：

然后，打开Attribute，在NIB name选择BlueVIEwController：

对其他的VIEw Controller进行同样的 *** 作，依次设成GreenVIEwController、RedVIEwController、YellowVIEwController。

10、设置Tab bar图标和文字：

展开Blue VIEw Controller，选中其中的Tab bar Item，打开Attribute，如下图：

Badge属性：设置的文字将以红色图标形式显示出来，比如，这个Tab显示的是Mail视图，你可以用Badge显示有多少封未读邮件。

IDentifIEr属性：这个属性对应的下拉菜单中，如果你选择的是不是Custom，比如是Favorite，那么这个Tab bar的名称和图标就都设置好了。我们这里选择Custom。

在Title输入Blue，在Image选择Blue.png。

对其他Tab bar Item进行类似 *** 作，这样之后，整个Tab bar如下图所示：

11、现在单击.xib，选中VIEw，打开Attribute Inspector，将其背景颜色改成蓝色。然后，在Simulated Metrics中设置Bottom bar为Tab bar：

对GreenVIEwController、RedVIEwController和YellowVIEwController进行同样设置，不过背景颜色要设成与其名称相对应的。

12、大功告成了，运行一下，看看效果吧：

 

总结

以上是内存溢出为你收集整理的iOS开发9：使用Tab Bar切换视图全部内容，希望文章能够帮你解决iOS开发9：使用Tab Bar切换视图所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。