1. 程式人生 > >iOS scrollView巢狀tableView,可同時滑動

iOS scrollView巢狀tableView,可同時滑動

效果圖:

 

這個頁面可以分成三個部分:最上面為view,可以放廣告等效果,中間是segment選項,下面的部分可滑動顯示,應使用scrollView,根據選項個數迴圈建立tableView。

建立scrollView,根據segment的個數建立tableView

@property (nonatomic, strong) UIScrollView *scrollView;

@property (nonatomic, strong) UITableView *tableView;

@property (nonatomic, strong) NSMutableArray *tableArray;

 

if(! _tableArray)
{
    _tableArray = [NSMutableArray array]; 
}

self.scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, Tool_GetMaxYWithView(_segmentView), SCREEN_WIDTH, SCREEN_HEIGHT - Tool_GetMaxYWithView(_segmentView))];
        
        self.scrollView.backgroundColor = [UIColor whiteColor];
        
        self.scrollView.delegate = self;
        
 
        // 設定scrollView的滑動範圍
        self.scrollView.contentSize = CGSizeMake(SCREEN_WIDTH * 3, _scrollView.frame.size.height);
        
        self.scrollView.pagingEnabled = YES;
        self.scrollView.scrollEnabled = YES;
        
        for (int i = 0 ; i < 3; i++)
        {
            UITableView *tableView = [[UITableView alloc]initWithFrame:CGRectMake(SCREEN_WIDTH * i, 0, self.scrollView.frame.size.width, self.scrollView.frame.size.height) style:UITableViewStyleGrouped];
            
            tableView.delegate = self;
            tableView.dataSource = self;
            
            [self.scrollView addSubview:tableView];
            [self.tableArray addObject:tableView];
        }
        
        self.tableView = self.tableArray.firstObject;

        [self.view addSubview:self.scrollView];

 

   滑塊選擇的程式碼

_segmentView = [[CustomSelectView alloc]initWithFrame:CGRectMake(0, Tool_GetMaxYWithView(_headView), SCREEN_WIDTH, 50) andItmeTitles:@[@"第一頁",@"第二頁",@"第三頁"] andTitleColor:[UIColor blackColor]];
        
        _segmentView.tinColor = [UIColor redColor];

 [_segmentView segmentedDidSelectHandle:^(NSInteger index)
         {
             
              [self.scrollView setContentOffset:CGPointMake(index * SCREEN_WIDTH, 0) animated:YES];
             self.tableView = [self.tableArray objectAtIndex:index];
             [self.tableView reloadData];

         }];

 

 實現scrollViewDelegate的代理方法

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
    
    if (scrollView == self.scrollView)
    {
        CGFloat a = self.scrollView.contentOffset.x/self.scrollView.frame.size.width;
        
        self.tableView = [self.tableArray objectAtIndex:a];
        
        self.segmentView.selectedSegmentIndex = a;
        
        [self.tableView reloadData];
    }
}

 

實現tableView的代理方法

// 一共有多少組
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    if(self.tableView == self.tableArray[0]) //顯示第一個表格
    {
        return 3;
    }
    else if (self.tableView == self.tableArray[1]) //顯示第二個表格
    {
        return 4;
    }
    else
    {
        return 5;
    }
}

//每組有多少行
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 1;
}

// 具體的cell顯示
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"CellCtr"];
    
    if(!cell)
    {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"CellCtr"];
    }
    
    cell.textLabel.text = [NSString stringWithFormat:@"%ld",indexPath.section];
    
    return cell;
}