解决点击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

细节:

时间: 2024-12-26 19:30:10

解决点击cell执行动画导致的重用问题的相关文章

解决点击cell时,UILabel的背景颜色消失的问题

-(void)setSelected:(BOOL)selected animated:(BOOL)animated{ [super setSelected:selected animated:animated]; _lblGuanFang.backgroundColor = [ColorUtil getColor:@"7ab6f5" alpha:1.0]; } -(void)setHighlighted:(BOOL)highlighted animated:(BOOL)animated

点击cell时动画效果

效果图: 工程图: 代码: RootViewController.h #import <UIKit/UIKit.h> @interface RootViewController : UIViewController <UITableViewDataSource,UITableViewDelegate> { UITableView *myTableView; } @end RootViewController.m #import "RootViewController.h&

jQuery全选与反选,且解决点击只执行一次的问题

<html> <head> <script src="jquery-1.11.1.min.js" type="text/javascript"></script> </head> <body> <input type="checkbox" name="chk_list[]" value="1" />1 <input t

解决点击多次jquery动画animate反应迟钝的问题

最近做了一个网页,用到了animate的动画效果,点击连接就滚动屏幕到相应的位置,可是前几次点击没有问题,随着点击次数的增多,动画响应越来越慢,到后来点击一次要等好几秒才开始滚动,最后我找到了原因,动画没有播放结束,队列越来越长导致的. 解决办法: $('body').stop().animate({scrollTop:aaa},300);在animate前加一个stop即可停止当前动画清空队列马上执行新的动画. 附上stop();的使用方法: stop([clearQueue], [gotoE

JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbind('click').click(function(){ //此处填写逻辑代码 }) ------ 因为利用js在页面加载后添加需要点击事件的代码,发现在点击后会代码会执行两次,因为有toggle效果,导致弹窗出现又很快丢失 查了一些资料,发现这是冒泡的原因,需要在点击事件代码中加入阻止冒泡的方法: e.s

解决Cell重绘导致 重复的问题

IOS在Cell上的优化令人觉得底层框架的成熟,可是有些情形却会造成不必要的麻烦, 当使用了 UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:Identifier]; 有可能会造成画面重复的问题,此句的意思是,从tableView的队列里取出以"Identifier"名称的cell进行重用.所以问题必定会出现! 解决办法如下: UITableViewCell *cell = nil; if (!c

ASP.NET 解决在点击Button执行服务器事件之前验证用户输入并阻塞

在网站项目开发时,为了减少用户的错误性的操作,很多时候我们都需要做一些必要的JS验证来提醒用户,比如:"输入的值不符合规则,请重新输入"."提交后无法修改,您确定要继续吗?"友好性的提示. 这时候我们想到了Button有一个客户端的点击事件(OnClientClick),大家知道,ASP.NET 页面ASPX页面被创建的时候会生成 一段代码 <input type="hidden" name="__EVENTTARGET"

jquery的on绑定点击事件执行两次的解决办法

js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的alert会执行两次,相应地数组删除也执行两次,具体代码如下(其中.tabDel是页面加载之后新生成的元素,故不能用普通的$(‘.tabDel).click(function(){})的方法添加点击事件): 上网找的解决方法大概有一下两种:1.在用 on 绑定 click 事件之前,对该事件解绑,也就是

iOS点击cell查看大图,点击大图还原小图-b

一.项目需求 用collectionView展示很多照片,点击某个照片,用全屏scrollView无限循环的方式查看图片.点击放大的图片,图片缩小到原先的尺寸. 如图gif1.gif所示,点击中间的图片,放大图片,滑动图片.再点击大图,图片回到相应的位置. gif1.gif 如图gif2.gif所示.当前显示的图片不在屏幕中,点击大图后,若图片在屏幕顶部,则回到顶部:若在底部,则回到底部. gif2.gif 二.常见场景 微博.微信的相册:九宫格展示照片,点击某个图片,图片添加到scrollVi