UIPageViewController是iOS中少有的動畫視圖控制器之壹。通過它可以創建類似UIScrollView和UIPageControl組合的滾動視圖,也可以創建類似書本效果的炫酷翻頁視圖。
UIPageViewController最初是在iOS 5 SDK中引入的,它使開發人員能夠使用這個ViewController來創建分頁視圖。在iOS 6中,該類已經更新為支持滾動過渡效果。使用頁面視圖,用戶可以通過手勢輕松地在多個頁面之間導航。UIPage ViewController不僅僅用於引導頁面,很多遊戲,比如憤怒的小鳥,都是用PageView來顯示關卡選擇的頁面,也有和書籍相關的應用,都是用這個類來顯示書籍的頁面。
UIPageViewController是壹個高度可配置的類,您可以按如下方式配置它:
翻頁方向-水平或垂直翻頁樣式-書籍翻頁或滑動翻頁書脊位置-僅書籍翻頁樣式對頁面間距有效-僅滑動翻頁樣式對定義頁間間距有效。
UIPageViewController類似於壹個視圖容器,其中每個特定的視圖都由自己的ViewController維護和管理,UIPageViewController只負責協調和動畫。下圖可以很好的展示UIPageViewControlelr的使用結構:
上圖中,UIPageViewControllerDataSource協議為UIPageViewController提供數據支持,DataSource協議提供的數據由每個ViewController維護。UIPageViewControllerDelegate中的回調可以監視翻頁和屏幕旋轉。UIPageViewController將從DataSource獲取的視圖數據呈現給View,用於當前視圖控制器的顯示。
為了演示,我們將壹起創建壹個簡單的應用程序。當然,我們不會演示UIPageViewController的所有配置細節,但我們會演示使用滑動翻頁樣式來創建向導頁面。不過不用擔心,對UIPageViewController有了基本的了解,相信妳也可以探索其他的特性。
開始吧!
其次,創建壹個UIPageViewController。
首先,在翻頁視圖控制器中創建壹個新類作為每個頁面視圖的控制器,並使其繼承UIViewController:
ModelViewController.h
#導入
@ interface ModelViewController:uiview controller
+(ModelViewController *)creatWithIndex:(int)index;
@property(nonatomic,strong)ui label * index label;
@end
ModelViewController.m
#導入" ModelViewController.h "
@interface ModelViewController()
@end
@實現模型視圖控制器
+(ModelViewController *)creatwinthindex:(int)index {
ModelViewController * con =[[ModelViewController alloc]init];
con . index label =[[UILabel alloc]initWithFrame:CGRectMake(110,200,100,30)];
con . index label . text =[ns string string with format:@ " page % d ",index];
[con . view addSubview:con . index label];
返回con
}
- (void)viewDidLoad {
【超級viewDidLoad】;
//在加載視圖後進行任何附加設置。
self . view . background color =[ui color red color];
}
@end
在項目模板附帶的ViewController.m文件中實現以下代碼:
#導入" ViewController.h "
#導入" ModelViewController.h "
//遵守協議
@interface ViewController()
{
//翻頁視圖控制器對象
UIPageViewController * _ pageview control;
//數據源數組
NSMutableArray * _ dataArray
}
@end
@實現視圖控制器
- (void)viewDidLoad {
【超級viewDidLoad】;
//初始化
_ pageViewControl =[[UIPageViewController alloc]initwithfransitionstyle:UIPageViewControllerTransitionStyleScroll navigationOrientation:uipageviewcontrollerorientionhorizontal options:@ { U ipageviewcontrolleroptions spinelocationkey:@ 0,uipageviewcontrolleroptions interpagespacingkey:@ 10 }];
self . view . background color =[ui color green color];
//設置翻頁視圖的大小。
_ pageview control . view . bounds = self . view . bounds;
//設置數據源和代理
_ pageview control . data source = self;
_ pageview control . delegate = self;
//創建初始接口
ModelViewController * model =[ModelViewController creatWithIndex:1];
//設置初始界面
[_ pageview control setview controllers:@[model]direction:UIPageViewControllerNavigationDirectionReverse animated:YES completion:nil];
//設置是否雙面顯示。
_ pageview control . doublesided = NO;
_ data array =[[NSMutableArray alloc]init];
[_ data array add object:model];
[self . view add subview:_ pageview control . view];
}
//翻頁控制器向前翻頁。此數據源方法返回的視圖控制器是顯示視圖的視圖控制器。
-(可為null的UIViewController *)pageview controller:(UIPageViewController *)pageview controller viewController beforeviewcontroller:(uiview controller *)view controller {
int index =(int)[_ data array index of object:view controller];
if (index==0) {
返回nil
}否則{
return _ data array[index-1];
}
}
//翻頁控制器執行向後翻頁動作。此數據源方法返回的視圖控制器是顯示視圖的視圖控制器。
-(可為null的UIViewController *)pageview controller:(UIPageViewController *)pageview controller viewControllerAfterViewController:(UIViewController *)view controller {
int index =(int)[_ data array index of object:view controller];
if (index==9) {
返回nil
}否則{
if(_ data array . count-1 & gt;=(index+1)) {
return _ data array[index+1];
}否則{
ModelViewController * model =[ModelViewController creatWithIndex:index+2];
[_ data array add object:model];
退貨模式;
}
}
}
//屏幕旋轉觸發的代理方法
-(UIPageViewControllerSpineLocation)pageview controller:(UIPageViewController *)pageview controller spinelocationforinterface orientation:(uiinterface orientation)orientation {
返回UIPageViewControllerSpineLocationMin;
}
//設置尋呼控制器的尋呼號。
-(NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageview controller {
返回10;
}
//設置初始分頁點
-(NSInteger)presentationIndexForPageViewController:(UIPageViewController *)pageview controller {
返回0;
}
@end
上面創建了翻頁視圖控制器最簡單的例子,效果如下:
第三,UIPageViewController中方法用法的分析
//創建翻頁視圖控制器對象
-(instance type)initwithhtransitionstyle:(UIPageViewControllerTransitionStyle)style navigation orientation:(UIPageViewControllerNavigationOrientation)navigation orientation options:(可為null的ns dictionary *)options;
上述方法用於創建視圖控制器對象,其中UIPageViewControllerTransitionStyle參數設置翻頁控制器的樣式,枚舉如下:
typedef NS_ENUM(NSInteger,UIPageViewControllerTransitionStyle){
UipageviewControllerTransitionstylePagecurl = 0,//類似於書籍翻頁的效果。
UipageviewControllerTransitionStyleScroll = 1//類似於ScrollView的滑動效果。
};
如果設置為UIPageView ControllerTransitionStyleCurl,翻頁效果如下圖所示:
上面初始化方法中的UIPageViewControllerNavigationOrientation屬性設置翻頁的方向,枚舉如下:
typedef NS_ENUM(NSInteger,UIPageViewControllerNavigationOrientation){
UipageviewControllerNavigationOrientationHorizontal = 0,//水平翻頁。
UipageviewControllerNavigationOrientationVertical = 1//垂直翻頁。
};
options參數用於設置翻頁查看控制器的配置字典,可以設置的配置鍵值如下:
//這個鍵需要設置為uipageviewcontrolleroptions spinelocationkey枚舉值對應的` NSNumber對象,翻頁控制器的書軸稍後設置。
ns string * const uipageviewcontrolleroptions spinelocationkey;
//該鍵需要設置為NSNumber類型,為滾動視圖樣式設置每個頁面視圖的間距。
ns string * const UIPageViewControllerOptionInterPageSpacingKey;
以下是UIPageViewController的壹些常見屬性和方法:
//設置數據源
@property(可空、非原子、弱)iddelegate。
//設置代理
@property(可空、非原子、弱)iddataSource。
//獲取翻頁樣式
@property (nonatomic,readonly)UIPageViewControllerTransitionStyle transitionStyle;
//獲取翻頁方向
@property (nonatomic,readonly)UIPageViewControllerNavigationOrientation navigation orientation;
//獲取滾動類型
@property (nonatomic,readonly)UIPageViewControllerSpineLocation spine location;
//設置是否雙面顯示。
@property (nonatomic,getter = is doubleSided)BOOL doubleSided;
//設置要顯示的視圖控制器。
-(void)setviewcontrollers:(nullable nsarray *)view controllers direction:(uipageviewcontrollernavigationdirection)direction animated:(bool)animated completion:(void(^ _ _ nullable)(bool finished))completion;
只有上面的spineLocation屬性有些難以理解,其枚舉如下:
typedef NS_ENUM(NSInteger,UIPageViewControllerSpineLocation){
//對於SCrollView類型滑動效果,不滾動將返回以下枚舉值。
UIPageViewControllerSpineLocationNone = 0,
//向左或向上旋轉界面,同壹時間只顯示壹個視圖。
UIPageViewControllerSpineLocationMin = 1,
//以中間為軸翻轉界面,可以同時顯示兩個視圖。
UIPageViewControllerSpineLocationMid = 2,
//以下邊緣或右邊緣為軸翻轉界面,同時只顯示壹個視圖。
UIPageViewControllerSpineLocationMax = 3
};
將上面的示例代碼修改如下:
- (void)viewDidLoad {
【超級viewDidLoad】;
//在加載視圖之後進行任何額外的設置,通常是從nib。
_ pageViewControl =[[UIPageViewController alloc]initwithfransitionstyle:UIPageViewControllerTransitionStylePageCurl navigationOrientation:uipageviewcontrolleroptionspinelocationkey:@ { U ipageviewcontrolleroptions:@ 2,UIPageViewControllerOptionInterPageSpacingKey:@ 10 }];
self . view . background color =[ui color green color];
_ pageview control . view . bounds = self . view . bounds;
_ pageview control . data source = self;
_ pageview control . delegate = self;
ModelViewController * model =[ModelViewController creatWithIndex:1];
ModelViewController * model 2 =[ModelViewController creatWithIndex:2];
[_ pageViewControl setview controllers:@[model,model 2]direction:UIPageViewControllerNavigationDirectionReverse animated:YES completion:nil];
_ pageview control . doublesided = YES;
_ data array =[[NSMutableArray alloc]init];
[_ data array add object:model];
[self . view add subview:_ pageview control . view];
}
-(UIPageViewControllerSpineLocation)pageview controller:(UIPageViewController *)pageview controller spinelocationforinterface orientation:(uiinterface orientation)orientation {
返回UIPageViewControllerSpineLocationMid;
}
操作效果如下圖所示:
第四,UIPageViewControllerDataSource中的方法分析
//向前翻頁以顯示ViewController。
-(可空UIViewController *)pageview controller:(UIPageViewController *)pageview controller viewController beforeviewcontroller:(UIViewController *)view controller;
//返回頁面以顯示ViewController。
-(可空UIViewController *)pageview controller:(UIPageViewController *)pageview controller viewControllerAfterViewController:(UIViewController *)view controller;
//設置尋呼控制器的尋呼號。
-(NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController NS _ AVAILABLE _ IOS(6 _ 0);
//設置當前分頁控制器的高亮點。
-(NSInteger)presentationIndexForPageViewController:(UIPageViewController *)pageViewController NS _ AVAILABLE _ IOS(6 _ 0);
第五,UIPageViewControllerDelegate中的方法分析
//翻頁視圖控制器即將翻頁時要執行的方法。
-(void)pageview controller:(UIPageViewController *)pageview controller willTransitionToViewControllers:(NSArray *)pendingViewControllers NS _ AVAILABLE _ IOS(6 _ 0);
//翻頁動畫完成後回調方法。
-(void)pageViewController:(UIPageViewController *)pageViewController did finish hanimating:(BOOL)finished previousViewControllers:(NSArray *)previousViewControllers transition completed:(BOOL)completed;
//對於屏幕防線改變時要返回的方法,可以通過返回值重置書軸類型枚舉。
-(UIPageViewControllerSpineLocation)pageViewController:(UIPageViewController *)pageViewController spinelocationforinterfaceoption:(uiinterfaceotination)orientation;