詳解IOS中Tool Bar切換視圖方法
本文通過(guò)實(shí)例給大家詳細(xì)講解了IOS開發(fā)中Tool Bar切換視圖方法以及原理解釋,希望我們的整理對(duì)你有用,一起學(xué)習(xí)下。
iOS中幾種典型的多視圖程序:
(1)Tab Bar Application:程序的底部有一排按鈕,輕觸其中一個(gè)按鈕,相應(yīng)的視圖被激活并顯示出來(lái);
(2)Navigation-Based Application:其特點(diǎn)是使用navigation controller,而navigation controller使用navigation bar來(lái)控制多級(jí)視圖;
(3)Tool Bar Application:程序的底部有一個(gè)工具條,利用工具條中的按鈕來(lái)切換視圖,經(jīng)常與Tab Bar Application混淆。
這次要做的例子就是使用了Tool Bar,只是簡(jiǎn)單了實(shí)現(xiàn)了視圖切換功能,并添加一些視圖切換時(shí)的效果。在做例子之前,首先要了解一下視圖的切換原理。
此文來(lái)自: 馬開東云搜索 轉(zhuǎn)載請(qǐng)注明出處 網(wǎng)址: http://makaidong.com
此文原標(biāo)題: 使用Tool Bar切換視圖 來(lái)源網(wǎng)址: http://makaidong.com/yangxt/1/58141_12002051.html
一般來(lái)說(shuō),一個(gè)多視圖的程序要至少三個(gè)View Controller,其中一個(gè)作為Root Controller。所謂Root Controller,是指用戶看到的第一個(gè)Controller,并且在程序加載時(shí)這個(gè)Controller就加載了。
Root Controller通常是UINavigationController或者UITabBarController的子類,也可以是UIViewController的一個(gè)子類。
在多視圖程序中,Root Controller的工作獲得兩個(gè)或者更多的其他視圖,并根據(jù)用戶輸入顯示不用的視圖。
除Root Controller之外,其他視圖就作為Content Controller,可以理解為可能會(huì)顯示出來(lái)的各種視圖。
為了更好地理解多視圖程序的結(jié)構(gòu),我們從Empty Application開始創(chuàng)建我們的程序。
1、創(chuàng)建工程:
運(yùn)行Xcode 4.2,新建一個(gè)Empty Application,名稱為MultiView,其他設(shè)置如下圖:

2、創(chuàng)建3個(gè)View Controller:
依次選擇File — New — New File,打開如下窗口:

找到UIViewController subclass并單擊Next,打開下面的窗口:

輸入名稱RootViewController,并且保證Subclass of選擇UIViewController,下面的兩個(gè)選框都不選;按照同樣的步驟新建兩個(gè)View Controller,名稱分別是FirstViewController和SecondViewController。建好后,在Project Navigation中顯示文件如下:

3、為三個(gè)View Controller創(chuàng)建.xib文件:
依次選擇File — New — New File,打開如下窗口:

在左邊選User Interface,右邊選View,單擊Next,在新窗口中的Device Family中選擇iPhone,單擊Next,打開如下窗口:

輸入名稱RootView,單擊Create,創(chuàng)建了一個(gè).xib文件。用同樣的方法再創(chuàng)建兩個(gè).xib,名稱分別是FirstView和SecondView。
4、修改App Delegate:
4.1 單擊AppDelegate.h,在其中添加代碼,在@interface之前添加@class RootViewController;在@end之前添加@property (strong, nonatomic) RootViewController *rootViewController;添加之后的代碼如下:
view source print ?
#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方法如下:view source print ?
- (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的視圖不會(huì)被狀態(tài)欄擋住
5、修改RootViewController.h:
單擊RootViewController.h,在其中添加兩個(gè)屬性和一個(gè)方法,如下:
view source print ?
#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
6、打開RootView.xib,在坐邊選擇File's Owner,在右邊打開Identity Inspector,在Class下拉菜單選擇RootViewController:

這樣,我們就可以從RootView.xib文件向RootViewController創(chuàng)建Outlet和Action了。
7、為RootView.xib添加工具欄:打開RootView.xib,拖一個(gè)Tool Bar到視圖上,雙擊Tool Bar上的按鈕,修改其名稱為Switch Views:

8、添加Action映射:
選中Switch Views按鈕,按住Control,拖到File's Owner,松開鼠標(biāo)后選擇switchViews方法:

9、選擇File's Owner,按住Control鍵,拖到View,松開鼠標(biāo),選擇view:

10、修改RootViewController.m:
打開RootViewController.m文件,在@implementation之前添加代碼:
view source print ?
#import "FirstViewController.h" #import "SecondViewController.h"
在@implementation之后添加代碼:
view source print ?
@synthesize firstViewController; @synthesize secondViewController;
接下來(lái)修改viewDidLoad方法,這個(gè)方法默認(rèn)是被注釋掉的,先去掉其周圍的注釋符,然后修改其代碼如下:
view source print ?
- (void)viewDidLoad {
self.firstViewController = [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil];
[self.view insertSubview: firstViewController.view atIndex:0];
[super viewDidLoad];
}
添加switchViews方法:
view source print ?
- (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方法:
view source print ?
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
if (self.firstViewController.view.superview == nil) {
self.firstViewController = nil;
} else {
self.secondViewController = nil;
}
}
11、打開FirstView.xib文件,選擇左邊的File's Owner,然后在Identity Inspector中選擇Class為FirstViewController;然后按住Control鍵從File's Owner圖標(biāo)拖到View,在彈出的菜單選擇view。為SecondView.xib進(jìn)行同樣的操作,不過(guò)Class選擇為SecondViewController。
12、打開FirstView.xib文件,選擇View,打開Attribute Inspector,進(jìn)行如下設(shè)置:

對(duì)SecondView.xib進(jìn)行同樣設(shè)置,不過(guò)背景顏色設(shè)成紅色。
13、此時(shí)運(yùn)行程序,你會(huì)看見剛啟動(dòng)的時(shí)候,程序顯示的綠色背景,輕觸Switch Views按鈕后,背景變成了紅色。不斷輕觸按鈕,背景不斷變換。
14、添加切換背景的動(dòng)畫效果:
打開RootViewController.m,修改其中的switchViews方法如下:
view source print ?
- (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];
}
注意四個(gè)表示切換效果的常量:
view source print ?
UIViewAnimationTransitionFlipFromLeft UIViewAnimationTransitionFlipFromRight UIViewAnimationTransitionCurlDown UIViewAnimationTransitionCurlUp
分別表示從左翻轉(zhuǎn)、從右翻轉(zhuǎn)、向下卷、向上卷。
運(yùn)行后翻頁(yè)效果如下:

相關(guān)文章
iOS ScrollView嵌套tableView聯(lián)動(dòng)滾動(dòng)的思路與最佳實(shí)踐
這篇文章主要給大家介紹了關(guān)于ScrollView嵌套tableView聯(lián)動(dòng)滾動(dòng)的思路與最佳實(shí)踐,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)各位iOS開發(fā)者們具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-10-10
IOS中MMDrawerController第三方抽屜效果的基本使用示例
這篇文章主要介紹了IOS中MMDrawerController第三方抽屜效果的基本使用示例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-02-02
通過(guò)UIKit坐標(biāo)系來(lái)全面掌握iOS中的UIScrollView組件
iOS開發(fā)套件中的UIScrollView組件十分強(qiáng)大,不僅是滾動(dòng),縮放操作也能夠控制自如,其核心當(dāng)然是坐標(biāo)軸上的控制,下面就通過(guò)UIKit坐標(biāo)系來(lái)全面掌握iOS中的UIScrollView組件2016-05-05
支持Xcode10和適配iPhone XS Max、iPhone XR的方法
這篇文章主要介紹了支持Xcode10和適配iPhone XS Max、iPhone XR的方法,文中通過(guò)示例代碼以及圖文介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2018-10-10
iOS實(shí)現(xiàn)電商購(gòu)物車界面示例
這篇文章主要為大家詳細(xì)介紹了iOS實(shí)現(xiàn)一個(gè)類似電商購(gòu)物車界面示例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12
iOS 開發(fā)之 - 關(guān)閉鍵盤 退出鍵盤 的5種方式
這篇文章主要介紹了iOS 開發(fā)之 - 關(guān)閉鍵盤 退出鍵盤 的5種方式的相關(guān)資料,需要的朋友可以參考下2016-09-09
iOS App開發(fā)中的UIPageControl分頁(yè)控件使用小結(jié)
UIPageControl分頁(yè)控件的例子簡(jiǎn)單來(lái)說(shuō)即是我們平時(shí)翻動(dòng)多個(gè)桌面頁(yè)時(shí)及底部帶有的圓點(diǎn)頁(yè)碼標(biāo)注,這里我們來(lái)看一下iOS App開發(fā)中的UIPageControl分頁(yè)控件使用小結(jié),需要的朋友可以參考下2016-06-06
iOS 防止按鈕多次點(diǎn)擊造成多次響應(yīng)的方法
這篇文章主要介紹了iOS 防止按鈕多次點(diǎn)擊造成多次響應(yīng)的方法的相關(guān)資料,這里對(duì)多次點(diǎn)擊造成的響應(yīng)提供了解決辦法,需要的朋友可以參考下2016-11-11

