美文网首页
Section开合效果及header拉伸效果

Section开合效果及header拉伸效果

作者: 倪大头 | 来源:发表于2018-02-04 13:01 被阅读45次

    使用到的全局变量:

    @implementation SpringTableViewHeader
    {
        UITableView *myTableView;
        UIImageView *bannerImg;//header图片
        NSMutableArray *sectionArr;//记录section开合状态的数组
    }
    
    sectionArr = [NSMutableArray arrayWithObjects:@"1",@"0",@"0", nil];//"1"表示展开,"0"表示收起
    

    创建一个TableView和它的header:

    - (void)createView {
        myTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, -kScaleY*200, UI_SCREEN_WIDTH, UI_SCREEN_HEIGHT+kScaleY*200) style:UITableViewStylePlain];
        myTableView.delegate = self;
        myTableView.dataSource = self;
        myTableView.tableHeaderView = [self createHeaderView];
        myTableView.separatorStyle = UITableViewCellSeparatorStyleNone;
        [self.view addSubview:myTableView];
        
        //返回
        UIButton *backBtn = [UIButton buttonWithType:UIButtonTypeCustom];
        backBtn.frame = CGRectMake(6, 25, 37, 34);
        [backBtn addTarget:self action:@selector(backPre) forControlEvents:UIControlEventTouchUpInside];
        [backBtn setImage:[UIImage imageNamed:@"返回"] forState:UIControlStateNormal];
        [self.view addSubview:backBtn];
    }
    
    - (UIView *)createHeaderView {
        UIView *headerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, UI_SCREEN_WIDTH, kScaleY*500)];
        headerView.clipsToBounds = YES;
        
        bannerImg = [[UIImageView alloc]initWithFrame:headerView.frame];
        bannerImg.image = [UIImage imageNamed:@"swim"];
        bannerImg.contentMode = UIViewContentModeScaleAspectFill;
        [headerView addSubview:bannerImg];
        
        return headerView;
    }
    
    #pragma mark - tableViewDelegate
    - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
        return sectionArr.count;
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
        if ([sectionArr[section] isEqualToString:@"1"]) {
            return 4;
        }
        return 0;
    }
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
        static NSString *identifier = @"springCell";
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:identifier];
        if (cell == nil) {
            cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifier];
        }
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
        [self setCell:cell withIndexPath:indexPath];
        
        return cell;
    }
    
    - (void)setCell:(UITableViewCell *)cell withIndexPath:(NSIndexPath *)indexPath {
        [cell.contentView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
        
        UILabel *cellLabel = [[UILabel alloc]init];
        cellLabel.text = [NSString stringWithFormat:@"第%ld行",indexPath.row];
        cellLabel.textColor = [UIColor colorWithHexString:@"#333333" alpha:1];
        cellLabel.font = [UIFont fontWithName:LightFont size:17];
        [cellLabel sizeToFit];
        cellLabel.center = CGPointMake(kScaleX*15+cellLabel.frame.size.width/2, kScaleY*50/2);
        [cell.contentView addSubview:cellLabel];
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
        return kScaleY*50;
    }
    
    - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
     
    }
    
    - (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
        UIView *sectionHeader = [[UIView alloc]initWithFrame:CGRectMake(0, 0, UI_SCREEN_WIDTH, kScaleY*65)];
        sectionHeader.backgroundColor = [UIColor whiteColor];
        UITapGestureRecognizer *sectionHeaderTap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(sectionHeaderAction:)];
        sectionHeader.tag = section;
        [sectionHeader addGestureRecognizer:sectionHeaderTap];
        
        UILabel *sectionTitle = [[UILabel alloc]init];
        sectionTitle.text = [Utils iphoneType];
        sectionTitle.textColor = [UIColor colorWithHexString:@"#333333" alpha:1];
        sectionTitle.font = [UIFont fontWithName:LightFont size:15];
        [sectionTitle sizeToFit];
        sectionTitle.center = CGPointMake(kScaleX*15+sectionTitle.frame.size.width/2, kScaleY*65/2);
        [sectionHeader addSubview:sectionTitle];
        
        UIView *sectionLine = [[UIView alloc]initWithFrame:CGRectMake(kScaleX*15, kScaleY*65-1, kScaleX*360, 1)];
        sectionLine.backgroundColor = [UIColor colorWithHexString:@"#d8d8d8" alpha:1];
        [sectionHeader addSubview:sectionLine];
        
        return sectionHeader;
    }
    
    - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
        return kScaleY*65;
    }
    

    点击section的开合效果:

    - (void)sectionHeaderAction:(UITapGestureRecognizer *)tap {
        if ([sectionArr[tap.view.tag] isEqualToString:@"1"]) {
            [sectionArr replaceObjectAtIndex:tap.view.tag withObject:@"0"];
        }else {
            [sectionArr replaceObjectAtIndex:tap.view.tag withObject:@"1"];
        }
        [myTableView reloadSections:[NSIndexSet indexSetWithIndex:tap.view.tag] withRowAnimation:UITableViewRowAnimationNone];
    }
    

    header图片拉伸效果:

    - (void)scrollViewDidScroll:(UIScrollView *)scrollView {
        CGFloat downHight = -scrollView.contentOffset.y;//下拉的距离
        CGRect frame = bannerImg.frame;
        if (downHight < 0) {
            frame.size.height = kScaleY*500;
            bannerImg.frame = frame;
        }else if (downHight < kScaleY*200) {
            frame.size.height = kScaleY*500 + downHight;
            bannerImg.frame = frame;
        }else {
            frame.size.height = kScaleY*500 + kScaleY*200;
            bannerImg.frame = frame;
            
            myTableView.contentOffset = CGPointMake(0, -kScaleY*200);//最多往下拉动的距离,防止漏出白边
        }
    }
    

    相关文章

      网友评论

          本文标题:Section开合效果及header拉伸效果

          本文链接:https://www.haomeiwen.com/subject/idevaxtx.html