scrollerView和tableView组合使用(网易新闻demo)

搭建界面

1. 界面sb内部拖拽两个scrollerView(1.titleScrollerView2.contentScrollerView)

2. 对titleScrollerView做布局

• 利用for循环添加labe (为什么不使用button 是因为button 对于label来说功能多,但是这里我们只需要点击,所以不用button)

1.
-(void)setUpTitleScrollView{

//建议这里的 i 写成NSInteger类型  ,为了以后很多使用情况,因为系统能够根据你的32 还是64位 去用那种类型  

  for(int i=0,i<7;i++)
    {
    UILabel*label=[UILabel alloc]init];
    label.text=
    label.frame=
    label.backgroudColor=
     [ label addGestureRecognizer:[UITapGestureRecognizer alloc]initWithTarGet:self action:@selector:(labelClick:)]];
     //这里要明白,label不是继承至UIControl 所有没有addTarget方法
     //但是可以添加手势监听器,有了这个手势不管你是不是按钮都可以监听事件
     
     //默认label的用户交互功能是关闭的
      label.userInteractionEnabled=YES;
      [self.titleScrollView addSubview:label];    
}
  //设置contentsize
  1.self.titleScrollView.contentSize=CGSizeMake(7*labelW,0);
  2.self.contentScrollView.contentSize=CGSizeMake(7*self.contentScrollView.frame.size.width,0);
 
    
  };
 2. 
  //实现顶部label点击事件
  
  

3.通过索引(可以自己定义个index 将tag标记赋值给index)来确定我们点击的是哪一个label

3.1
//label拿到tag
label.tag=i;

3.2
//监听顶部label点击事件中使用tag
-(void)LABELClick:(UITapGestureRecognizer*)tap{

 NSInteger index=tap.view.tag;

***用这个tag做什么事情呢??   
答:是为了在点击label过后contenOffset定位到相应的tableView(先偏移到相应的位置再进行加载tableView)***

4.拿到索引(通过label.tag=i给点击的label确定了索引)确定偏移位置

注意了: 拿索引(点击的label)的时候如果你使用的是[self.titleScrolView.subviews indexOfObject:tap.view] ;通过这种方式的时候必须将垂直水平滚动条隐藏(sb右边直接勾去或者代码的方式隐藏),不然subviews 也包括那两个

总结以上拿到索引的两种方法:
1. 
tap.view.tag    (tag 是标记控件的索引,可以自己定义数字,这里我们使用的是在创建控件的时候将i赋值给tag    tag:NSInteger类型)
2. 
self.titleScrollView.subviews

拿到索引的作用:

答: 得到偏移量的 X ;
点击头部label的时候contentScrollerView 偏移相应的 X

-(void)labelClick:(UITapGestureRecognizer*)tap{
//1.拿取点击label的索引
NSIndex index=tap.view.tag;
//根据索引,让底部scrollView滚动到对应的位置
//2.计算偏移
CGPoint offset=self.contentScrollView.contentOffset;
offset.x=index*self.contentScrollView.frame.size.width;
//3.执行动画偏移
[self.contentScrollView setContentOffset:offset animated:YES];


}


***4.通过sb拖拽几个控件在contentScrollView上面,并给contentScrollView开启pageInable ;点击titleScrollView的时候就能很明确的看到翻页效果***

通过上面的代码就可以实现点击顶部标题label,底部的contentScrollerView确实能够偏移到相应的位置

注意:contentSize和contentOffset的区别(不懂一定再复习一下)

5.偏移效果达到,进行加载tableView

添加控制器

• 准备好控制器<TableViewController>(也可以一口气创建完)创建类继承自UITableViewController
• HomeViewControlelr中添加子控制器[self setupChildVc];
• 实现添加子控制器方法{
  方法内部为:通过不同控制器创建相应不同的对象
  }

加载不同tableview 需要监听 contentScrollview的滚动,所以设置代理为控制器,并且遵守协议,且实现相应的方法

• 根据索引从childViewControllers中取出要显示的控制器

自动滚动需要调用这个方法,在这个方法中加载要显示的VC
-(void)scrollviewDidEndScrollingAnimation:(UIScrollView*)scrollView{
1. 当前位置需要显示的控制器的索引
2. 取出要显示的控制器
3. 如果当前控制器显示过了,就直接返回
4. 添加控制器的view 到contentScrollView中;


}

手指松开scrollView后,scrolView停止减速完毕就会调用这个
-(void)scrollViewDidEndDecelerating:(UIScrollView*)scrollView{

}