點選Cell控制UITableViewCell的展開及關閉

weixin_33912445發表於2016-06-11

先給大家看效果圖~

1758964-ad74fe5ee7281a92.gif
cell的展開.gif

這篇分享源自會飛的烏龜愛看海博主的 http://www.jianshu.com/p/5439a989097d ,我自己稍加修改,然後在這兒呈現給各位看官。
本篇文章,cell的展開實際上就是改變cell的高度,然後重新整理改變高度的cell所在行就行了,具體其他的效果筆者在此不做贅述,具體原因是不會,各位可根據自己的情況實現。
下面是程式碼部分。
首先在storyBoard裡面畫一個tableView,並在ViewController的延展裡設為屬性。

//
//  ViewController.m
//  CellExpandAndShrink
//
//  Created by Dom on 16/6/11.
//  Copyright © 2016年 YG. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()<UITableViewDataSource,UITableViewDelegate>
@property (weak, nonatomic) IBOutlet UITableView *tableView;

///上一次選中的行
@property (nonatomic, assign) NSInteger selectedRow;
///記錄被開啟的行號的陣列
@property (nonatomic, strong) NSMutableArray *open;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    [self initTableView];
}

- (NSMutableArray *)open
{
    if (_open == nil) {
        _open = [NSMutableArray array];
    }
    return _open;
}

- (void)initTableView
{
    self.tableView.dataSource = self;
    self.tableView.delegate = self;
}

#pragma mark - UITableView Delegate Method
// 返回cell個數
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 10;
}

// 返回每行的高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([self.open containsObject:[NSString stringWithFormat:@"%ld",indexPath.row]]) {
        return 100;
    }
    else {
        return 40;
    }
}

// 請求資料來源代理為tableView插入需要的cell
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *reusid = @"cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reusid];
    if (!cell) {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:reusid];
    }
    
    if ([self.open containsObject:[NSString stringWithFormat:@"%ld",indexPath.row]]) {
        // 開啟之後
        cell.textLabel.text = @"快點關上~~~討厭~~~";
    }
    else {
        // 正常狀態下
        cell.textLabel.text = @"點選可以開啟我噢";
    }
    
    return cell;
}

// 監聽點選的cell
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"上一次選中的行號--%ld  本次點選的行號--%ld",(long)self.selectedRow,(long)indexPath.row);
    
    if ([self.open containsObject:[NSString stringWithFormat:@"%ld",indexPath.row]]) {
        // 包含,說明之前已經點選過,這次點選跟上一次是一樣的,從開啟陣列中移除
        [self.open removeObject:[NSString stringWithFormat:@"%ld",indexPath.row]];
    }
    else {
        // 不包含,說明這行是第一次點選,直接加進去就可以了
        [self.open addObject:[NSString stringWithFormat:@"%ld",indexPath.row]];
    }
    
    // 記錄點選的行號
    self.selectedRow = indexPath.row;
    
    NSLog(@"%@",self.open);
    
    // 重新整理點選的行
    [self.tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationFade];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

寫到這兒就沒有然後了,動態圖的效果就可以展示出來了。
這個工程比較簡單,GitHub就不傳了。最後感謝各位看官。

相關文章