动态展开tableView的cell[1]

动态展开tableView的cell[1]

源码地址:https://github.com/xerxes235/HVTableView

虽然作者写的demo很好看,可是,你很难理解他是怎么玩的-_-!!,不信,你可以去下载他的demo试一下:)

本人运行时的效果如下图:

源码:

RootViewController.m

 //
 //  RootViewController.m
 //  AnimationTableView
 //
 //  Copyright (c) 2014年 Y.X. All rights reserved.
 //

 #import "RootViewController.h"
 #import "HVTableView.h"
 #import "YXCell.h"

 @interface RootViewController ()<HVTableViewDelegate, HVTableViewDataSource>

 @property (nonatomic, strong) HVTableView *showTable;
 @property (nonatomic, strong) NSArray     *picAry;

 @end

 @implementation RootViewController

 - (void)viewDidLoad
 {
     [super viewDidLoad];

     // 图片源
     _picAry = @[[UIImage imageNamed:@"1.jpg"],
                 [UIImage imageNamed:@"2.jpg"],
                 [UIImage imageNamed:@"3.jpg"],
                 [UIImage imageNamed:@"4.jpg"],
                 [UIImage imageNamed:@"5.jpg"],
                 [UIImage imageNamed:@"6.jpg"],
                 [UIImage imageNamed:@"7.jpg"],
                 [UIImage imageNamed:@"8.jpg"],
                 [UIImage imageNamed:@"9.jpg"],
                 [UIImage imageNamed:@"10.jpg"]];

     // tableView
     _showTable = \
         [[HVTableView alloc] initWithFrame:self.view.bounds
                          expandOnlyOneCell:YES
                           enableAutoScroll:YES];
     _showTable.HVTableViewDelegate   = self;
     _showTable.HVTableViewDataSource = self;
     [_showTable reloadData];

     // 加载进视图
     [self.view addSubview:_showTable];
 }

 #pragma mark - 各个代理

 -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
 {
     return ;
 }

 -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
 {
     return _picAry.count;
 }

 //==============================================
 #pragma mark 展开时的cell(可以添加动画)
 //==============================================
 -(void)tableView:(UITableView *)tableView
       expandCell:(UITableViewCell *)cell
    withIndexPath:(NSIndexPath *)indexPath
 {
     YXCell *tmpCell = (YXCell *)cell;
     [UIView animateWithDuration:0.3f animations:^{
         tmpCell.showImageView.frame = CGRectMake(, , , );
     }];

     [UIView animateWithDuration:0.5f animations:^{
         tmpCell.name.frame = CGRectMake(, , , );
     }];
 }

 //==============================================
 #pragma mark 收缩时的cell(可以添加动画)
 //==============================================
 -(void)tableView:(UITableView *)tableView
     collapseCell:(UITableViewCell *)cell
    withIndexPath:(NSIndexPath *)indexPath
 {
     YXCell *tmpCell = (YXCell *)cell;
     [UIView animateWithDuration:0.3f animations:^{
         tmpCell.showImageView.frame = CGRectMake(, , , );
         tmpCell.name.frame = CGRectMake(, , , );
     }];
 }

 //==============================================
 #pragma mark 返回高度
 //==============================================
 -(CGFloat)tableView:(UITableView *)tableView
 heightForRowAtIndexPath:(NSIndexPath *)indexPath
          isExpanded:(BOOL)isexpanded
 {
     if (isexpanded == YES)
     {
         // 展开时的高度
         return ;
     }
     else
     {
         // 没有展开时的高度
         return ;
     }
 }

 //==============================================
 #pragma mark 返回高度
 //==============================================
 -(UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath
                    isExpanded:(BOOL)isExpanded
 {
     static NSString *CellIdentifier = @"aCell";
     YXCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
     if (cell == nil)
     {
         cell = [[YXCell alloc] initWithStyle:UITableViewCellStyleSubtitle
                              reuseIdentifier:CellIdentifier];
     }

     // 选择时没有颜色
     cell.selectionStyle = UITableViewCellSelectionStyleNone;

     // 加载图片
     cell.showImageView.image = _picAry[indexPath.row];

     // 没有展开cell,进行一些设置(不要添加任何动画)
     if (isExpanded == NO)
     {
         cell.showImageView.frame = CGRectMake(, , , );
         cell.name.frame          = CGRectMake(, , , );
     }
     // 展开的cell,进行一些设置(不要添加任何动画)
     else
     {
         cell.showImageView.frame = CGRectMake(, , , );
         cell.name.frame          = CGRectMake(, , , );
     }

     return cell;
 }

 @end

YXCell.h

//
//  YXCell.h
//  AnimationTableView
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface YXCell : UITableViewCell

@property (nonatomic, strong) UILabel     *name;
@property (nonatomic, strong) UIImageView *showImageView;

@end

YXCell.m

//
//  YXCell.m
//  AnimationTableView
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import "YXCell.h"

@implementation YXCell

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self)
    {
        // 尺寸在外面的cell设定
        _showImageView  = [[UIImageView alloc] initWithFrame:CGRectZero];
        [self addSubview:_showImageView];

        _name           = [[UILabel alloc] initWithFrame:CGRectZero];
        _name.font      = [UIFont fontWithName:@"HelveticaNeue-UltraLight" size:.f];
        _name.text      = @"YouXianMing";
        _name.textColor = [UIColor blackColor];
        [self addSubview:_name];

        self.layer.masksToBounds = YES;
    }
    return self;
}

@end

关键的几步:

怎么实现复杂逼格高的动画?这个就需要你的想象力来脑补了-_-!!,没有实现不出来的效果,只有想不出来的效果:)

附录:

其实笔者深刻理解他的原理,然后尝试着自己写了一个,不过,那恶心的重用问题,不自己亲自动手是不理解别人写代码的用心良苦的-_-!!!!!

先共享源码供君尝试:

//
//  YXCell.h
//  ExpendTableView
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface YXCell : UITableViewCell

@property (nonatomic, strong) UIView *showView;

@end

//
//  YXCell.m
//  ExpendTableView
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import "YXCell.h"

@implementation YXCell

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self)
    {
        _showView = [[UIView alloc] initWithFrame:CGRectZero];
        _showView.backgroundColor = [UIColor redColor];
        [self addSubview:_showView];
    }
    return self;
}

@end

//
//  RootViewController.m
//  ExpendTableView
//
//  Copyright (c) 2014年 Y.X. All rights reserved.
//

#import "RootViewController.h"
#import "YXCell.h"

@interface RootViewController ()<UITableViewDataSource, UITableViewDelegate>

{

    BOOL  flag[];

}

@property (nonatomic, strong) UITableView      *tableView;

@end

@implementation RootViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    _tableView = [[UITableView alloc] initWithFrame:self.view.bounds
                                              style:UITableViewStylePlain];
    _tableView.delegate   = self;
    _tableView.dataSource = self;

    [self.view addSubview:_tableView];
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return ;
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return ;
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (flag[indexPath.row] == YES)
    {
        return .f;
    }
    else
    {
        return .f;
    }
}

//==============================================
#pragma mark  根据cell状态进行相关设置
//==============================================
-(UITableViewCell *)tableView:(UITableView *)tableView
        cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellIdentifier = @"aCell";
    YXCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil)
    {
        cell = [[YXCell alloc] initWithStyle:UITableViewCellStyleSubtitle
                             reuseIdentifier:CellIdentifier];
    }

    // 选择时没有颜色
    cell.selectionStyle = UITableViewCellSelectionStyleNone;

    if (flag[indexPath.row] == YES)
    {
        [UIView animateWithDuration:.f animations:^{
            cell.showView.frame = CGRectMake(, , , );
        }];
    }
    else
    {
        cell.showView.frame = CGRectMake(-, , , );
    }

    return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (flag[indexPath.row] == NO)
    {
        for (int i = ; i < ; i++)
        {
            flag[i] = NO;
        }

        flag[indexPath.row] = YES;

        [tableView beginUpdates];
        [tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath]
                         withRowAnimation:UITableViewRowAnimationAutomatic];
        [tableView endUpdates];
    }
    else
    {
        flag[indexPath.row] = NO;

        [tableView beginUpdates];
        [tableView reloadRowsAtIndexPaths:[NSArray arrayWithObject:indexPath]
                         withRowAnimation:UITableViewRowAnimationAutomatic];
        [tableView endUpdates];
    }
}

@end

以下三个地方是相互配合的,但还是难以解决重用问题-_-!!!!