滑动cell的时候执行动画效果

效果图:

源码:

//
//  ViewController.m
//  AniTab
//
//  Created by XianMingYou on 15/2/26.
//  Copyright (c) 2015年 XianMingYou. All rights reserved.
//

#import "ViewController.h"
#import "ShowCell.h"

@interface ViewController ()<UITableViewDataSource, UITableViewDelegate>

@property (nonatomic, strong) UITableView     *tableView;
@property (nonatomic, strong) NSMutableArray  *dataSource;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // 初始化数据源
    self.dataSource = [NSMutableArray new];
    for (int i = 0; i < 40; i++) {
        [self.dataSource addObject:[NSString stringWithFormat:@"%02d YouXianMing", i]];
    }

    // 初始化tableView
    self.tableView = [[UITableView alloc] initWithFrame:self.view.bounds
                                                  style:UITableViewStylePlain];
    [self.view addSubview:self.tableView];
    self.tableView.delegate   = self;
    self.tableView.dataSource = self;
    [self.tableView registerClass:[ShowCell class]
           forCellReuseIdentifier:@"ShowCell"];
}

#pragma mark - tableView代理
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return self.dataSource.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    ShowCell *cell = [tableView dequeueReusableCellWithIdentifier:@"ShowCell"];
    [cell accessData:self.dataSource[indexPath.row]];

    return cell;
}

#pragma mark cell显示的时候
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
    ShowCell *showCell = (ShowCell *)cell;
    [showCell show];
}

#pragma mark cell消失的时候
- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath*)indexPath {
    ShowCell *showCell = (ShowCell *)cell;
    [showCell hide];
}

#pragma mark cell高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return 100;
}

@end

cell源码:

//
//  ShowCell.h
//  AniTab
//
//  Created by XianMingYou on 15/2/26.
//  Copyright (c) 2015年 XianMingYou. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ShowCell : UITableViewCell

/**
 *  动画显示
 */
- (void)show;

/**
 *  动画隐藏
 */
- (void)hide;

/**
 *  处理数据
 *
 *  @param data 数据源
 */
- (void)accessData:(id)data;

@end
//
//  ShowCell.m
//  AniTab
//
//  Created by XianMingYou on 15/2/26.
//  Copyright (c) 2015年 XianMingYou. All rights reserved.
//

#import "ShowCell.h"

@interface ShowCellStoreValue : NSObject
@property (nonatomic) CGRect startRect;
@property (nonatomic) CGRect endRect;
@end
@implementation ShowCellStoreValue
@end

@interface ShowCell ()

@property (nonatomic, strong) UILabel            *label;
@property (nonatomic, strong) ShowCellStoreValue *storeValue;

@end

@implementation ShowCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
        self.label = [[UILabel alloc] initWithFrame:CGRectMake(10, 30, 300, 50)];
        self.label.font = [UIFont italicSystemFontOfSize:30.f];
        [self addSubview:self.label];

        self.storeValue = [ShowCellStoreValue new];
        self.storeValue.startRect = self.label.frame;
        self.storeValue.endRect   = CGRectMake(10, 30 + 20, 300, 50);
    }

    return self;
}

- (void)accessData:(id)data {
    NSString *str = data;
    if ([str isKindOfClass:[NSString class]]) {
        self.label.text = str;
    }
}

/**
 *  动画显示
 */
- (void)show {
    [UIView animateWithDuration:1.f animations:^{
        self.label.frame = self.storeValue.endRect;
    }];
}

- (void)hide {
    [self.label.layer removeAllAnimations];
    self.label.frame = self.storeValue.startRect;
}

@end

原理:

时间: 2024-11-05 19:02:41

滑动cell的时候执行动画效果的相关文章

[ jquery选择器 :animated ] 此选择器匹配所有正在执行动画效果的元素

此选择器匹配所有正在执行动画效果的元素 实例: <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title> <meta http-equiv='description' content='this is my page'> <meta http-equiv='keywords' content='keyword1,keyword2,keyw

随着ScrollView的滑动,渐渐的执行动画View

今天是实现了一个小功能的东西.看看效果图: 实现方式: 1.自定义ScrollView   复写onScrollChange方法,来计算滑动的位置. 2.自定义接口,通过接口来在ScrollView中控制,滑动的高度的进度. 3.在自定义View中去执行动画. 代码实现: 1.ScrollView   最主要的代码只有计算滑动位置的代码了,其实也是很简单的,获取子View的个数,每次都去for循环,去计算字View的位置,以及当前ScrollView的top bottom 代码: @Overri

22.调用delay()方法延时执行动画效果

delay()方法的功能是设置一个延时值来推迟动画效果的执行,它的调用格式为: $(selector).delay(duration) 其中参数duration为延时值,它的单位是毫秒,当超过延时值时,动画继续执行. 例如,当页面中图片动画正在执行时,点击“延时”按钮调用delay()方法推迟2000毫秒后继续执行,如下图所示: 在浏览器中显示的效果: 从图中可以看出,当图片动画正在执行时,点击“延时”按钮,调用delay()方法中止当前正在执行的图片动画效果,当超过设置的延时值时,动画效果继续

鼠标滑动到当前页面触发动画效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>浏览器滑动到当前界面触发动画</title> <style> * { margin:0; padding:0; }//reset css .box { width:100%; height:1500px; background:gray; } .tw

点击单个cell高度变化的动画效果

效果 说明 1. 点击单个cell的时候,其展开与缩放动画实现起来是很麻烦的,做过相关需求的朋友一定知道其中的坑 2. 本例子只是提供了一个解决方案,为了简化操作,将cell高度封装到了Model当中 源码 https://github.com/YouXianMing/TableViewTapAnimation // // Model.h // TableViewTapAnimation // // Created by YouXianMing on 15/9/18. // Copyright

滑动菜单栏SlidingMenu动画效果的实现

经过上一篇文章的学习,相信大家对开源项目SlidingMenu的用法已经有了一个非常深入的了解,那么这一章博 主就来教大家滑动菜单栏滑动时动画效果的实现.博主这里用了三个不同动画效果的基础示例来教大家如何去实现, 等 大家 弄懂了之后完全可以做到举一反三,去实现更多不同的动画效果,让你的应用软件给用户带来眼前一亮的效 果. 一.SlidingMenu动画效果示例一 1.示例一效果图 该示例实现了滑动时缩放的效果,看左边的效果图可以明显的感觉到,滑动菜单栏刚刚打开时的图片比右边的效 果图 滑动菜单

滑动菜单栏(三)SlidingMenu动画效果的实现

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9262931 经过上一篇文章的学习,相信大家对开源项目SlidingMenu的用法已经有了一个非常深入的了解,那么这一章博 主就来教大家滑动菜单栏滑动时动画效果的实现.博主这里用了三个不同动画效果的基础示例来教大家如何去实现, 等大家弄懂了之后完全可以做到举一反三,去实现更多不同的动画效果,让你的应用软件给用户带来眼前一亮的 效果. 一.SlidingMenu动画效果示例一

【转】Android 实现蘑菇街购物车动画效果

原文出处:http://blog.csdn.net/wangjinyu501/article/details/38400479 1.思路 目前想到两种方式实现这种效果,一是使用Tween动画,直截了当的进行一个移动,蘑菇街就是使用这样的方法.二是使用WindowManager创建一个View,然后对这个View进行移动. 2.实现 本文先用方式一方法实现,之后会用方式二方法实现. 方式一: Activity代码: 1 package com.kince.mogujie; 2 3 import a

CSS3 动画效果带来的bug

css3 动画效果比如transition:all 2s linear;这种用来计算及时的物体坐标的话会带来一定的问题 比如把一个DIV从A点移动到B点.JS为DIV.style.left=B; 但是当我们使用上面的transition属性后,A点移动到B点是2秒内完成的,当执行JS代码时候,DIV还没到应该的位置,那么,在Div.style.left=B; console.log(Div.offsetLeft); 这样console出来的是起点坐标而不是终点坐标. 即使你让其JS线程主动挂起使