解决点击cell执行动画导致的重用问题
解决点击cell执行动画导致的重用问题
说明:
动画的细节都是裸露的,并没有封装,靠看官来优化了。
效果:
源码:
https://github.com/YouXianMing/UITableViewSelectedAnimation
核心:
//
// YouXianMingCell.h
// SelectedAnimation
//
// Created by YouXianMing on 15/4/17.
// Copyright (c) 2015年 YouXianMing. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface YouXianMingCell : UITableViewCell
@property (nonatomic, strong) UILabel *name;
- (void)showIconAnimated:(BOOL)animated;
- (void)hideIconAnimated:(BOOL)animated;
- (void)showSelectedAnimation;
@end
//
// YouXianMingCell.m
// SelectedAnimation
//
// Created by YouXianMing on 15/4/17.
// Copyright (c) 2015年 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(260, 20, 40, 40)];
_iconView.image = [UIImage imageNamed:@"icon"];
_iconView.alpha = 0.f;
[self addSubview:_iconView];
// 文字
_name = [[UILabel alloc] initWithFrame:CGRectMake(30, 10, 300, 60)];
_name.font = [UIFont fontWithName:@"HelveticaNeue-Thin" size:30];
_name.textColor = [UIColor grayColor];
[self addSubview:_name];
_lineView = [[UIView alloc] initWithFrame:CGRectMake(30, 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(30, 70, 200, 2);
_name.frame = CGRectMake(30 + 50, 10, 300, 60);
_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(30, 70, 200, 2);
_name.frame = CGRectMake(30 + 50, 10, 300, 60);
_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(30, 70, 0, 2);
_name.frame = CGRectMake(30, 10, 300, 60);
_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(30, 70, 0, 2);
_name.frame = CGRectMake(30, 10, 300, 60);
_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, 80)];
tmpView.backgroundColor = [[UIColor yellowColor] colorWithAlphaComponent:0.30];
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
细节: