iOS使用pageViewController實現(xiàn)多視圖滑動切換
本文實例為大家分享了pageViewController實現(xiàn)多視圖(控制器)滑動切換的具體代碼,供大家參考,具體內(nèi)容如下
先看一下效果動畫


類似的界面做過不少,在幾個APP中都有用到過,再次之前不了解uipageViewController 曾經(jīng)的思路有兩個現(xiàn)在想想都覺得繁瑣。
之前的思路1:使用嵌套,collectionview嵌套,每個item中添加內(nèi)容
之前的思路2:使用scrollview 在上面創(chuàng)建一個一個的controller 實現(xiàn)左右滑動
這兩個思路無疑是可以實現(xiàn)的,并且可以實現(xiàn)每個頁面的重用,滑動等都可,唯獨一點不好就是當(dāng)停留在第一頁的時候,點擊標(biāo)題欄第五頁,那么平移的過程就是第一頁到第五頁,所有的頁面從屏幕快速閃過,并且看到現(xiàn)在很多APP都是這樣的。在此之前我是用的思路2,為了避免跨頁面切換出現(xiàn)的中間幾個頁面閃過的過程,直接把平移動畫關(guān)閉了。直到使用了uipageViewController,趕緊把項目中的給換掉了
代碼不多150行以內(nèi)
#import "ViewController.h"http:/// 當(dāng)前controller
#import "MyViewController.h" /// 復(fù)用的controller 適用于每個控制器布局相同的情況下,,布局不同就創(chuàng)建不同的controller添加進來
#import "TitleCollectionViewCell.h"http:/// 標(biāo)題欄使用的collectionviewcell
@interface ViewController ()<UIPageViewControllerDelegate,UIPageViewControllerDataSource,UICollectionViewDelegate,UICollectionViewDataSource>{
//// 記錄當(dāng)前頁 當(dāng)前標(biāo)題位置
NSInteger ld_currentIndex;
}
@property (nonatomic, strong) UIPageViewController *pageViewController;
@property (nonatomic, strong) NSMutableArray *controllersArr;/// 控制器數(shù)組
@property (nonatomic, strong) NSMutableArray *titleArray; /// 標(biāo)題數(shù)組
@property (nonatomic, strong) UICollectionView *titleCollectionView; /// 標(biāo)題collectionview
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
self.navigationController.navigationBar.translucent = NO;
self.controllersArr = [NSMutableArray array];
self.titleArray = [NSMutableArray array];
//// 如果controller布局相同則循環(huán)創(chuàng)建MyViewController 添加進數(shù)組,,如果controller 布局不同 那就創(chuàng)建多個不同controller依次添加數(shù)組
for (int i = 0; i < 10; i++) {
MyViewController *con = [[MyViewController alloc]init];
[self.controllersArr addObject:con];
NSString *str = [NSString stringWithFormat:@"第 %d 頁", i+1];
con.titlestring = str;
[self.titleArray addObject:str];
}
[self createCollectionView];
[self createPageViewController];
[self setTheFirstPage];
}
/// 創(chuàng)建標(biāo)題collectionview
- (void)createCollectionView{
UICollectionViewFlowLayout *lay = [[UICollectionViewFlowLayout alloc] init];
lay.itemSize = CGSizeMake(60, 30);
lay.minimumLineSpacing = 0;
lay.minimumInteritemSpacing = 0;
lay.scrollDirection = UICollectionViewScrollDirectionHorizontal;
self.titleCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 34, 375, 30) collectionViewLayout:lay];
self.titleCollectionView.showsHorizontalScrollIndicator = NO;
self.titleCollectionView.backgroundColor = [UIColor whiteColor];
self.titleCollectionView.delegate = self;
self.titleCollectionView.dataSource = self;
[self.titleCollectionView registerClass:[TitleCollectionViewCell class] forCellWithReuseIdentifier:@"titleReuse"];
[self.navigationController.view addSubview:self.titleCollectionView];
}
//// 標(biāo)題collectionview的協(xié)議方法
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return self.titleArray.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
TitleCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"titleReuse" forIndexPath:indexPath];
cell.titleLabel.text = self.titleArray[indexPath.row];
if (indexPath.row == ld_currentIndex) {
cell.titleLabel.textColor = [UIColor orangeColor];
}else{
cell.titleLabel.textColor = [UIColor blackColor];
}
return cell;
}
//// 點擊標(biāo)題左右切換視圖控制器------------再也不用看到好幾個中間頁面從屏幕快速閃過了------
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
UIViewController *vc = [self.controllersArr objectAtIndex:indexPath.row];
if (indexPath.row > ld_currentIndex) {
[self.pageViewController setViewControllers:@[vc] direction:UIPageViewControllerNavigationDirectionForward animated:YES completion:^(BOOL finished) {
}];
} else {
[self.pageViewController setViewControllers:@[vc] direction:UIPageViewControllerNavigationDirectionReverse animated:YES completion:^(BOOL finished) {
}];
}
ld_currentIndex = indexPath.row;
NSIndexPath *path = [NSIndexPath indexPathForRow:ld_currentIndex inSection:0];
[self.titleCollectionView scrollToItemAtIndexPath:path atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];
[self.titleCollectionView reloadData];
}
/// 創(chuàng)建pageViewController
- (void)createPageViewController {
NSDictionary *option = [NSDictionary dictionaryWithObject:[NSNumber numberWithInteger:0] forKey:UIPageViewControllerOptionInterPageSpacingKey];
_pageViewController = [[UIPageViewController alloc]initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll navigationOrientation:UIPageViewControllerNavigationOrientationHorizontal options:option];
_pageViewController.delegate = self;
_pageViewController.dataSource = self;
[self addChildViewController:_pageViewController];
[self.view addSubview:_pageViewController.view];
}
/// 展示上一頁
- (nullable UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController {
NSInteger index = [self.controllersArr indexOfObject:viewController];
if (index == 0 || (index == NSNotFound)) {
return nil;
}
index--;
return [self.controllersArr objectAtIndex:index];
}
/// 展示下一頁
- (nullable UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerAfterViewController:(UIViewController *)viewController {
NSInteger index = [self.controllersArr indexOfObject:viewController];
if (index == self.controllersArr.count - 1 || (index == NSNotFound)) {
return nil;
}
index++;
return [self.controllersArr objectAtIndex:index];
}
/// 將要滑動切換的時候
- (void)pageViewController:(UIPageViewController *)pageViewController willTransitionToViewControllers:(NSArray<UIViewController *> *)pendingViewControllers {
UIViewController *nextVC = [pendingViewControllers firstObject];
NSInteger index = [self.controllersArr indexOfObject:nextVC];
ld_currentIndex = index;
}
/// 滑動結(jié)束后
- (void)pageViewController:(UIPageViewController *)pageViewController didFinishAnimating:(BOOL)finished previousViewControllers:(NSArray<UIViewController *> *)previousViewControllers transitionCompleted:(BOOL)completed {
if (completed) {
NSIndexPath *path = [NSIndexPath indexPathForRow:ld_currentIndex inSection:0];
[self.titleCollectionView scrollToItemAtIndexPath:path atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES];
[self.titleCollectionView reloadData];
NSLog(@">>>>>>>>> %ld", (long)ld_currentIndex);
}
}
/// 設(shè)置默認顯示的是哪個頁面(controller)
- (void)setTheFirstPage{
UIViewController *vc = [self.controllersArr objectAtIndex:ld_currentIndex];
[self.pageViewController setViewControllers:@[vc] direction:UIPageViewControllerNavigationDirectionReverse animated:YES completion:nil];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
TitleCollectionViewCell
@implementation TitleCollectionViewCell
- (instancetype)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
[self createView];
}
return self;
}
- (void)createView{
self.titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.contentView.frame.size.width, self.contentView.frame.size.height)];
[self.contentView addSubview:self.titleLabel];
self.titleLabel.font = [UIFont systemFontOfSize:14];
}
@end
demo分享:pageViewController實現(xiàn)多視圖滑動切換
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
iOS應(yīng)用UI開發(fā)中的字體和按鈕控件使用指南
這篇文章主要介紹了iOS應(yīng)用UI開發(fā)中的字體和按鈕控件使用指南,分別簡單講解了UILabel和UIButton的用法,需要的朋友可以參考下2016-01-01
IOS開發(fā)筆記整理49之詳解定位CLLocation
在項目功能中有一個定位CLLocation的需求,遇到了一些知識難點,經(jīng)過各位大俠的幫助,問題解決,特此分享供大家學(xué)習(xí),希望大家共同學(xué)習(xí)進步2015-11-11
iOS App設(shè)計模式開發(fā)中對建造者模式的運用實例
這篇文章主要介紹了iOS App設(shè)計模式開發(fā)中對建造者模式的運用實例,示例代碼為傳統(tǒng)的Objective-C,需要的朋友可以參考下2016-04-04
iOS復(fù)數(shù)cell下優(yōu)雅的代碼結(jié)構(gòu)詳解
這篇文章主要給大家介紹了關(guān)于iOS復(fù)數(shù)cell下優(yōu)雅的代碼結(jié)構(gòu)的相關(guān)資料,文中通過示例代碼介紹的非常詳細,對大家學(xué)習(xí)或者使用iOS具有一定的參考學(xué)習(xí)價值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04

