前几天搞了 双曲线波浪动画(http://www.jianshu.com/p/7db295fd38eb)
和环形倒计时动画(http://www.jianshu.com/p/d1d16dff33c9)
而且感觉效果还不错,喜欢的人还很多,于是今天打算 在搞一个"仪表式数字跳动动画". 那么什么是仪表式数字跳动动画. 直接上效果

6月-27-2016 11-28-17.gif

一,
看了效果也许就明白仪表式数字跳动动画是什么鬼了(名字是我自己取得)
先梳理一下思路:

  1. 首先可以看到文字在上下滑动 而且可以看到滑动的过程 显然这是一个UIScrollview,上面一次排放列0~9的数字 点击时改变 contentoffest(这里会有一个坑,稍后解释);
    2.就是有几个数字就创建几个UIscrollview 这样就可以实现
    1. 通过上的 UIscrollview 可以动 UItableview 代替 数字放在cell上面

二,
好,思路看起来很简单.我们来实现一下
1.创建自定义view 继承与UIviwe 并且实现初始化方法

- (instancetype)initWithFrame:(CGRect)frame{
if (self = [super initWithFrame:frame]) {
self.NumberTextArray = [NSMutableArray array];//用来存储字符串的没哟个位的字节
self.backgroundColor = [UIColor whiteColor];
}
return self;
}

2.根据数据创建表

- (void)setNumber:(NSInteger)number{
_number = number;
NSString * string = [NSString stringWithFormat:@"%ld",number];
for (NSInteger i = 0; i < string.length; i++) { [self.NumberTextArray addObject:[string substringWithRange:NSMakeRange(i, 1)]];//把数字的每一位放到数组里面
}
[self createTableView];//创建表;
}

3.创建刚才谈到的UItableview 并且创建多个,数字有几位就创建介个

  NSInteger length = [[NSString stringWithFormat:@"%ld",self.number] length];//self.number 是一个自定义的数值 然后根据位数创建表
for (NSInteger i = 0; i < length; i++) {
UITableView * tableView = [[UITableView alloc]initWithFrame:CGRectMake(i* self.frame.size.width/length, 0, self.frame.size.width/length, self.frame.size.height) style:UITableViewStylePlain];//依次创建表 宽度平分
tableView.delegate = self;
tableView.dataSource =self;
tableView.tag = 1000 + i;//添加tag至
[self addSubview: tableView];
NSString * strid = [NSString stringWithFormat:@"AAA%ld",i];//不同的表添加不同的标记值.
[tableView registerNib:[UINib nibWithNibName:@"MYTableViewCell" bundle:nil] forCellReuseIdentifier:strid];
}

4.创建cell且显示数字

- (UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
NSString * strid = [NSString stringWithFormat:@"AAA%ld",tableView.tag - 1000];
MYTableViewCell * CELL = [tableView dequeueReusableCellWithIdentifier:strid forIndexPath:indexPath];
CELL.selectionStyle = UITableViewCellSelectionStyleNone;
if ([self.NumberTextArray[tableView.tag - 1000] isEqualToString:@"."]) {
CELL.MYlabel.text = @".";//判断数字是否有小数点 如果有显示点
}else{
CELL.MYlabel.text = [NSString stringWithFormat:@"%ld",indexPath.row];
//显示数字 0~9
}
return CELL;
}

5.接下来就是关键触发动画(我们这里在点击cell时触发动画)

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
NSInteger length = [[NSString stringWithFormat:@"%ld",self.number] length];
for (NSInteger i = 0; i< length; i++) {
UITableView * tableview = (UITableView*)[self viewWithTag:1000+i];
//获取相应的表
// NSInteger number = [self.NumberTextArray[i] integerValue];得到每一个表最终要是现实数字
// // [tableview setContentOffset:CGPointMake(0, number * 50) animated:YES]; 修改偏移量 数字*cell高度(50)
[tableview setContentOffset:CGPointMake(0, (arc4random()%9) * self.frame.size.height) animated:YES];//这里为了展示选择了随机数
} }

到了这里全部代码就实现了

三,
疑问和思考
个人在实现这个构成中遇到了一点点的问题,和一点点的思考在这返现一下
1.就是我在实现上面第5步 触发动画时第一次用了这个写法

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
NSInteger length = [[NSString stringWithFormat:@"%ld",self.number] length]; for (NSInteger i = 0; i< length; i++) { UITableView * tableview = (UITableView*)[self viewWithTag:1000+i];
// NSInteger number = [self.NumberTextArray[i] integerValue];
[UIView animateWithDuration:2.0 animations:^{
tableview.contentOffset = CGPointMake(0, (arc4random()%9) * self.frame.size.height);
}];//代码很好理解
}
}

其效果如下:

6月-27-2016 12-55-26.gif

其原因是什么? 目前我还不知道,各位道友如果明白 请告知小弟

2.就是如果用了上述第五的的方法setContentOffset:CGPointMake(0, number * 50) animated:YES]; 如何修改里面的动画效果 ?比如
: 如果修改 动画时间 如何修改动画的速度 (先快后慢) 应该怎么搞(这个问题让我很纠结)
3.就是 目前搞这些 都是基于控件组合到一块来的 并没有深入到另一个层面去搞.我觉得这也是目前大多数人员的尴尬状况啊.


关于动画,各位道友如果拥有更多的资料请分享给小弟(渴望学习),共同进步.
以上几乎全部代码 就不发 代码了//////

文/健健锅(简书作者)
原文链接:http://www.jianshu.com/p/0d6f50385861
著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。

iOS 仪表式数字跳动动画-b的更多相关文章

  1. Android TextView数字增长动画效果

    某些app上,新进入一个Activity的时候,上面的一个关键性数字(比如金额)会以一个数字不断变大的动画来显示.刚开始的时候,想到的一个方案是:使用Thead+Handler,给定一个动画总时长与刷 ...

  2. iOS开发UI篇—核心动画(UIView封装动画)

    iOS开发UI篇—核心动画(UIView封装动画) 一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画 ...

  3. iOS CATransition 自定义转场动画

    https://www.jianshu.com/p/39c051cfe7dd CATransition CATransition 是CAAnimation的子类(如下图所示),用于控制器和控制器之间的 ...

  4. iOS开发UI篇—核心动画(转场动画和组动画)

    转自:http://www.cnblogs.com/wendingding/p/3801454.html iOS开发UI篇—核心动画(转场动画和组动画) 一.转场动画简单介绍 CAAnimation的 ...

  5. iOS开发UI篇—核心动画(关键帧动画)

    转自:http://www.cnblogs.com/wendingding/p/3801330.html iOS开发UI篇—核心动画(关键帧动画) 一.简单介绍 是CApropertyAnimatio ...

  6. iOS开发UI篇—核心动画(基础动画)

    转自:http://www.cnblogs.com/wendingding/p/3801157.html 文顶顶 最怕你一生碌碌无为 还安慰自己平凡可贵 iOS开发UI篇—核心动画(基础动画) iOS ...

  7. iOS开发UI篇—核心动画简介

    转自:http://www.cnblogs.com/wendingding/p/3801036.html iOS开发UI篇—核心动画简介 一.简单介绍 Core Animation,中文翻译为核心动画 ...

  8. 超炫数字特效动画AE模板

    下载方式: 网盘地址+迅雷地址+迅雷地址+备份地址 <ignore_js_op> 本AE模板是由Videohive机构出品的超炫数字特效动画AE模板,Videohive The Numbe ...

  9. iOS响应式编程:ReactiveCocoa vs RxSwift 选谁好

    转载: iOS响应式编程:ReactiveCocoa vs RxSwift 选谁好 内容来自stack overflow的一个回答:ReactiveCocoa vs RxSwift – pros an ...

随机推荐

  1. MySQL添加外键时报错 ERROR 1215 (HY000): Cannot add foreign key constraint

    1.数据类型      2.数据表的引擎 数据表 mysql> show tables; +------------------+ | Tables_in_market | +--------- ...

  2. Android怎样改动app不在多任务列表中显示

    在实际开发中,我们希望某些activity或者应用程序不在多任务列表中显示,即长按Home键或者多任务button键不显示近期执行的程序,我们能够在对应应用程序的AndroidManifest.xml ...

  3. SQL高级优化之经常使用的优化策略-2(The Return Of The King)

    1.2 索引 索引不是越多越好,你须要知道索引建立多了.写入数据的效率会减少.怎样使用索引要看你的项目的应用场景,做出合理的測试评估. 1.2.1 统计数量 统计数量上.假设字段(fieldName) ...

  4. 8086FLAG寄存器

    8086中的FLAG寄存器也就是状态标志位寄存器.它用来存储一些指令的计算结果,比如加法减法中的进位:为CPU运行某些命令提供根据,比如DF它决定是往前走指针还是向后走指针:总之状态寄存器存放的被称为 ...

  5. typename使用在模板中区分static成员和类型

    16.19 编写函数,接受一个容器的引用,打印容器中的元素,使用容器的size_type和size成员来控制打印元素的循环. 16.20 重写上一题的函数,使用begin和end返回的迭代器来控制循环 ...

  6. JSP-tag文件使用介绍

    tag文件简单创建和使用 创建标记文件(.tag) 在标记文件中写入信息 在jsp文件中,引入标记文件 通过关键字调用标记文件 举例说明: 标记文件(show.tag) <%@ tag lang ...

  7. 解锁Scott过程中出现的问题及解决办法

    一.conn sys/sys as sysdba; //以DBA的身份登录 出现以下错误 经查 协议适配器错误的问题的原因有三个 监听服务没有起起来.windows平台个一如下操作:开始---程序-- ...

  8. MKServerBuilder.psm1

    MKServerBuilder.psm1 function Test-ElevatedShell { $user = [Security.Principal.WindowsIdentity]::Get ...

  9. UTF-8 BOM对PHP的影响

    今天在用notepad++写代码时 载入一个frameset框架模版后 在页面上一直不显示该页面,查看源码后都正常.然后索性把里面东西全删掉 随便写了几个测试文字可以正常显示. 折腾了好长时间,最后偶 ...

  10. Visual Studio 2013 RTM 中文语言包官方下载地址发布

    如果你下载的是英文版,你想安装一个中文的visual studio 2013,那么你大可不必重新下载安装visual studio 2013,因为微软提供了Visual Studio 2013 RTM ...