其实原理很简单,就是childViewControllers来存储TableViewController类,滑动的时候根据位置切换,显示不同的数据 废话少说,直接上代码(文章底部附有 Demo 地址,Demo 里面的 scrollView 和按钮滚动结合更为完美,实现了滑页面按钮也滑动的功能)
第一步.创建上面的按钮
//创建按钮
-(void)creatBut{
//按钮的 scroll
self.butScroll.contentSize = CGSizeMake(SCREEN_WIDTH/5*10, 0);
//承载 tableView 的 scroll
self.TBScroll.contentSize = CGSizeMake(SCREEN_WIDTH*10, 0);
//创建按钮
for (int i = 0; i<10; i++) {
TBModel *model = [[TBModel alloc] init];
UIButton *but = [UIButton buttonWithType:UIButtonTypeCustom];
[but setTitle:[NSString stringWithFormat:@"%d",i] forState:UIControlStateNormal];
[but setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
but.frame = CGRectMake(SCREEN_WIDTH/5*i, 0, SCREEN_WIDTH/5 , self.butScroll.frame.size.height);
but.tag = i+10;
[but addTarget:self action:@selector(butScrollClick:) forControlEvents:UIControlEventTouchUpInside];
//给 model 赋值,方便切换的时候展示不同的数据的判断
model.numStr = [NSString stringWithFormat:@"%d",i];
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(SCREEN_WIDTH/5*i, but.frame.size.height-2, SCREEN_WIDTH/5, 2)];
label.backgroundColor = [UIColor blueColor];
if (i != 0) {
label.hidden = YES;
}
[self.labelArr addObject:label];
[self creatChild:model];
[self.butScroll addSubview:label];
[self.butScroll addSubview:but];
}
[self scrollViewDidEndScrollingAnimation:self.TBScroll];
}
第二步.把创建好的TableViewController存储到childViewControllers
//把TableViewController添加到ChildViewControllers,为了下面调用
-(void)creatChild:(TBModel *)model{
TBTableViewController *tb = [[TBTableViewController alloc] init];
tb.numStr = model.numStr;
[self addChildViewController:tb];
}
第三步.判断承载 tableView 的 scrollView 滚动位置,加载tableView并切换不同数据
-(void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView{
//获取页面停留的位置
NSInteger index = scrollView.contentOffset.x/SCREEN_WIDTH;
//从childViewControllers取出对应的 tableViewController
UITableViewController *tb = self.childViewControllers[index];
#warning mark 当加载的是 collectionView 的时候,需要实现UICollectionViewFlowLayout方法,要不程序会崩溃 UICollectionViewFlowLayout * fl = [[UICollectionViewFlowLayout alloc] init]; fl.scrollDirection = UICollectionViewScrollDirectionVertical; UICollectionViewController *coll = self.VC.childViewControllers[index]; [coll initWithCollectionViewLayout:fl];
//当这个 tableView 加载过,就直接返回原来加载的,减少加载所需的资源
if ([tb isViewLoaded]) {
return;
}
tb.view.frame = CGRectMake(SCREEN_WIDTH*index, 0, SCREEN_WIDTH, self.TBScroll.frame.size.height);
[scrollView addSubview:tb.view];
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
//重新调用 scroll 方法 加载页面
[self scrollViewDidEndScrollingAnimation:scrollView];
[self changeLabelLocation:scrollView.contentOffset.x/SCREEN_WIDTH];
}
最后一步.把按钮的点击和承载tableView的 scrollView 滑动结合起来
//上面按钮的点击方法
-(void)butScrollClick:(UIButton *)but{
[self changeLabelLocation:but.tag-10];
}
//下面横线的影藏和显示,同时滑动加载 tableView 的 scroll,让按钮点击的位置和 tableView 对应
-(void)changeLabelLocation:(NSInteger)index{
for (int i = 0; i<self.labelArr.count; i++) {
UILabel *label = self.labelArr[i];
if (i == index) {
label.hidden = NO;
}else{
label.hidden = YES;
}
}
[self.TBScroll setContentOffset:CGPointMake(SCREEN_WIDTH*index, 0) animated:YES];
}
