UITableView中cell点击的绚丽动画效果

  • 时间:
  • 浏览:1
  • 来源:uu快3开奖_uu快3娱乐_输钱

核心地方:

效果图:

源码:

//
//  YouXianMingCell.m
//  CellAnimation
//
//  Created by YouXianMing on 14/12/27.
//  Copyright (c) 2014年 YouXianMing. All rights reserved.
//

#import "YouXianMingCell.h"

@interface YouXianMingCell ()

@property (nonatomic, strong) UIImageView *iconView;
@property (nonatomic, strong) UIView      *lineView;
@property (nonatomic, strong) UIView      *rectView;

@end

@implementation YouXianMingCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        
        _rectView                   = [[UIView alloc] initWithFrame:CGRectMake(262, 23, 35, 35)];
        _rectView.layer.borderWidth = 1.f;
        _rectView.layer.borderColor = [UIColor grayColor].CGColor;
        [self addSubview:_rectView];
        
        // 图标
        _iconView       = [[UIImageView alloc] initWithFrame:CGRectMake(2100, 20, 40, 40)];
        _iconView.image = [UIImage imageNamed:@"icon"];
        _iconView.alpha = 0.f;
        [self addSubview:_iconView];
        
        // 文字
        _name           = [[UILabel alloc] initWithFrame:CGRectMake(100, 10, 100, 100)];
        _name.font      = [UIFont fontWithName:@"HelveticaNeue-Thin" size:100];
        _name.textColor = [UIColor grayColor];
        [self addSubview:_name];
        
        _lineView                 = [[UIView alloc] initWithFrame:CGRectMake(100, 70, 0, 2)];
        _lineView.alpha           = 0.f;
        _lineView.backgroundColor = [UIColor redColor];
        [self addSubview:_lineView];
    }
    
    return self;
}

- (void)showIconAnimated:(BOOL)animated {
    if (animated) {
        _iconView.transform = CGAffineTransformMake(2, 0, 0, 2, 0, 0);
        
        [UIView animateWithDuration:0.5
                              delay:0
             usingSpringWithDamping:7
              initialSpringVelocity:4
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             _iconView.alpha     = 1.f;
                             _iconView.transform = CGAffineTransformMake(1, 0, 0, 1, 0, 0);
                             
                             _lineView.alpha     = 1.f;
                             _lineView.frame     = CGRectMake(100, 70, 100, 2);
                             
                             _name.frame         = CGRectMake(100 + 100, 10, 100, 100);
                             
                             _rectView.layer.borderColor  = [UIColor redColor].CGColor;
                             _rectView.transform          = CGAffineTransformMake(0.8, 0, 0, 0.8, 0, 0);
                             _rectView.layer.cornerRadius = 4.f;
                         }
                         completion:^(BOOL finished) {
                             
                         }];
    } else {
        _iconView.transform = CGAffineTransformMake(1, 0, 0, 1, 0, 0);
        _iconView.alpha     = 1.f;
        
        _lineView.alpha     = 1.f;
        _lineView.frame     = CGRectMake(100, 70, 100, 2);
        
        _name.frame         = CGRectMake(100 + 100, 10, 100, 100);
        
        _rectView.layer.borderColor  = [UIColor redColor].CGColor;
        _rectView.transform          = CGAffineTransformMake(0.8, 0, 0, 0.8, 0, 0);
        _rectView.layer.cornerRadius = 4.f;
    }
}

- (void)hideIconAnimated:(BOOL)animated {
    if (animated) {
        [UIView animateWithDuration:0.5
                              delay:0
             usingSpringWithDamping:7
              initialSpringVelocity:4
                            options:UIViewAnimationOptionCurveEaseInOut
                         animations:^{
                             _iconView.alpha     = 0.f;
                             _iconView.transform = CGAffineTransformMake(0.5, 0, 0, 0.5, 0, 0);
                             
                             _lineView.alpha     = 0.f;
                             _lineView.frame     = CGRectMake(100, 70, 0, 2);
                             
                             _name.frame         = CGRectMake(100, 10, 100, 100);
                             
                             _rectView.layer.borderColor  = [UIColor grayColor].CGColor;
                             _rectView.transform          = CGAffineTransformMake(1, 0, 0, 1, 0, 0);
                             _rectView.layer.cornerRadius = 0;
                         }
                         completion:^(BOOL finished) {
                             
                         }];
    } else {
        _iconView.alpha     = 0.f;
        
        _lineView.alpha     = 0.f;
        _lineView.frame     = CGRectMake(100, 70, 0, 2);
        
        _name.frame         = CGRectMake(100, 10, 100, 100);
        
        _rectView.layer.borderColor  = [UIColor grayColor].CGColor;
        _rectView.transform          = CGAffineTransformMake(1, 0, 0, 1, 0, 0);
        _rectView.layer.cornerRadius = 0;
    }
}

- (void)showSelectedAnimation {
    UIView *tmpView         = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)];
    tmpView.backgroundColor = [[UIColor yellowColor] colorWithAlphaComponent:0.100];
    tmpView.alpha           = 0.f;
    
    [self addSubview:tmpView];
    
    
    [UIView animateWithDuration:0.20 delay:0 options:UIViewAnimationOptionCurveEaseIn animations:^{
        tmpView.alpha = 0.8f;
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:0.20 delay:0.1 options:UIViewAnimationOptionCurveEaseOut animations:^{
            tmpView.alpha = 0.f;
        } completion:^(BOOL finished) {
            [tmpView removeFromSuperview];
        }];
    }];
}

@end

测试图片:

我人个视频教程系类   iOS中CALayer的使用

UITableView中cell点击的绚丽动画效果

YouXianMingCell.h 与 YouXianMingCell.m