[翻译] JTNumberScrollAnimatedView
JTNumberScrollAnimatedView
本人视频教程系类 iOS中CALayer的使用
效果:
Use JTNumberScrollAnimatedView for have a nice animation for display number. It's easy to use, easy to customize.
使用 JTNumberScrollAnimatedView来展示一个效果非常不错的显示数字变化的动画效果的控件,使用很简单,非常容易定制。
Usage
Basic usage - 基本的使用
You can use JTNumberScrollAnimatedView
like a normal view.
你可以像使用一个普通的view一样来使用JTNumberScrollAnimatedView
#import <UIKit/UIKit.h> #import "JTNumberScrollAnimatedView.h" @interface ViewController : UIViewController @property (weak, nonatomic) IBOutlet JTNumberScrollAnimatedView *animatedView; @end
You just have to call setValue
with a NSNumber and use startAnimation
for launch the animation.
你只需要调用setValue方法然后执行startAnimation方法就能显示效果。
- (void)viewDidLoad
{
[super viewDidLoad]; [self.animatedView setValue:@249];
} - (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated]; [self.animatedView startAnimation];
}
WARNING - 注意
For now the value
must be a positive integer.
现在,这个值必须是正的不能是负数。
Customization - 定制
You can easily change some properties of the animation. Each caracter have its own column
.
你可以很简单的修改以下的一些属性
textColor
font
duration
durationOffset
, delay between the end of the animation of each columndensity
, number of characters by column for the animationminLength
, you can force the minimum count of columnsisAscending
, the direction of the scroll
If you change one of this properties, you have to call setValue
for update the view.
如果你修改了其中的一个属性,你需要调用 setValue 来更新画面。
Requirements
- iOS 7 or higher iOS7 或者更高版本
- Automatic Reference Counting (ARC) ARC
//
// JTNumberScrollAnimatedView.h
// JTNumberScrollAnimatedView
//
// Created by Jonathan Tribouharet
// #import <UIKit/UIKit.h> @interface JTNumberScrollAnimatedView : UIView @property (strong, nonatomic) NSNumber *value; @property (strong, nonatomic) UIColor *textColor;
@property (strong, nonatomic) UIFont *font;
@property (assign, nonatomic) CFTimeInterval duration;
@property (assign, nonatomic) CFTimeInterval durationOffset;
@property (assign, nonatomic) NSUInteger density;
@property (assign, nonatomic) NSUInteger minLength;
@property (assign, nonatomic) BOOL isAscending; - (void)startAnimation;
- (void)stopAnimation; @end
//
// JTNumberScrollAnimatedView.m
// JTNumberScrollAnimatedView
//
// Created by Jonathan Tribouharet
// #import "JTNumberScrollAnimatedView.h" @interface JTNumberScrollAnimatedView(){
NSMutableArray *numbersText;
NSMutableArray *scrollLayers;
NSMutableArray *scrollLabels;
} @end @implementation JTNumberScrollAnimatedView - (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if(!self){
return nil;
} [self commonInit]; return self;
} - (id)initWithCoder:(NSCoder *)aDecoder
{
self = [super initWithCoder:aDecoder];
if(!self){
return nil;
} [self commonInit]; return self;
} - (void)commonInit
{
self.duration = 1.5;
self.durationOffset = .;
self.density = ;
self.minLength = ;
self.isAscending = NO; self.font = [UIFont systemFontOfSize:[UIFont systemFontSize]];
self.textColor = [UIColor blackColor]; numbersText = [NSMutableArray new];
scrollLayers = [NSMutableArray new];
scrollLabels = [NSMutableArray new];
} - (void)setValue:(NSNumber *)value
{
self->_value = value; [self prepareAnimations];
} - (void)startAnimation
{
[self prepareAnimations];
[self createAnimations];
} - (void)stopAnimation
{
for(CALayer *layer in scrollLayers){
[layer removeAnimationForKey:@"JTNumberScrollAnimatedView"];
}
} - (void)prepareAnimations
{
for(CALayer *layer in scrollLayers){
[layer removeFromSuperlayer];
} [numbersText removeAllObjects];
[scrollLayers removeAllObjects];
[scrollLabels removeAllObjects]; [self createNumbersText];
[self createScrollLayers];
} - (void)createNumbersText
{
NSString *textValue = [self.value stringValue]; for(NSInteger i = ; i < (NSInteger)self.minLength - (NSInteger)[textValue length]; ++i){
[numbersText addObject:@""];
} for(NSUInteger i = ; i < [textValue length]; ++i){
[numbersText addObject:[textValue substringWithRange:NSMakeRange(i, )]];
}
} - (void)createScrollLayers
{
CGFloat width = roundf(CGRectGetWidth(self.frame) / numbersText.count);
CGFloat height = CGRectGetHeight(self.frame); for(NSUInteger i = ; i < numbersText.count; ++i){
CAScrollLayer *layer = [CAScrollLayer layer];
layer.frame = CGRectMake(roundf(i * width), , width, height);
[scrollLayers addObject:layer];
[self.layer addSublayer:layer];
} for(NSUInteger i = ; i < numbersText.count; ++i){
CAScrollLayer *layer = scrollLayers[i];
NSString *numberText = numbersText[i];
[self createContentForLayer:layer withNumberText:numberText];
}
} - (void)createContentForLayer:(CAScrollLayer *)scrollLayer withNumberText:(NSString *)numberText
{
NSInteger number = [numberText integerValue];
NSMutableArray *textForScroll = [NSMutableArray new]; for(NSUInteger i = ; i < self.density + ; ++i){
[textForScroll addObject:[NSString stringWithFormat:@"%ld", (number + i) % ]];
} [textForScroll addObject:numberText]; if(!self.isAscending){
textForScroll = [[[textForScroll reverseObjectEnumerator] allObjects] mutableCopy];
} CGFloat height = ;
for(NSString *text in textForScroll){
UILabel * textLabel = [self createLabel:text];
textLabel.frame = CGRectMake(, height, CGRectGetWidth(scrollLayer.frame), CGRectGetHeight(scrollLayer.frame));
[scrollLayer addSublayer:textLabel.layer];
[scrollLabels addObject:textLabel];
height = CGRectGetMaxY(textLabel.frame);
}
} - (UILabel *)createLabel:(NSString *)text
{
UILabel *view = [UILabel new]; view.textColor = self.textColor;
view.font = self.font;
view.textAlignment = NSTextAlignmentCenter; view.text = text; return view;
} - (void)createAnimations
{
CFTimeInterval duration = self.duration - ([numbersText count] * self.durationOffset);
CFTimeInterval offset = ; for(CALayer *scrollLayer in scrollLayers){
CGFloat maxY = [[scrollLayer.sublayers lastObject] frame].origin.y; CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"sublayerTransform.translation.y"];
animation.duration = duration + offset;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; if(self.isAscending){
animation.fromValue = [NSNumber numberWithFloat:-maxY];
animation.toValue = @;
}
else{
animation.fromValue = @;
animation.toValue = [NSNumber numberWithFloat:-maxY];
} [scrollLayer addAnimation:animation forKey:@"JTNumberScrollAnimatedView"]; offset += self.durationOffset;
}
} @end
[翻译] JTNumberScrollAnimatedView的更多相关文章
- 《Django By Example》第五章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者@ucag注:大家好,我是新来的翻译, ...
- 《Django By Example》第四章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:祝大家新年快乐,这次带来<D ...
- [翻译]开发文档:android Bitmap的高效使用
内容概述 本文内容来自开发文档"Traning > Displaying Bitmaps Efficiently",包括大尺寸Bitmap的高效加载,图片的异步加载和数据缓存 ...
- 【探索】机器指令翻译成 JavaScript
前言 前些时候研究脚本混淆时,打算先学一些「程序流程」相关的概念.为了不因太枯燥而放弃,决定想一个有趣的案例,可以边探索边学. 于是想了一个话题:尝试将机器指令 1:1 翻译 成 JavaScript ...
- 《Django By Example》第三章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:第三章滚烫出炉,大家请不要吐槽文中 ...
- 《Django By Example》第二章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:翻译完第一章后,发现翻译第二章的速 ...
- 《Django By Example》第一章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:本人目前在杭州某家互联网公司工作, ...
- 【翻译】Awesome R资源大全中文版来了,全球最火的R工具包一网打尽,超过300+工具,还在等什么?
0.前言 虽然很早就知道R被微软收购,也很早知道R在统计分析处理方面很强大,开始一直没有行动过...直到 直到12月初在微软技术大会,看到我软的工程师演示R的使用,我就震惊了,然后最近在网上到处了解和 ...
- ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第一章:创建基本的MVC Web站点
在这一章中,我们将学习如何使用基架快速搭建和运行一个简单的Microsoft ASP.NET MVC Web站点.在我们马上投入学习和编码之前,我们首先了解一些有关ASP.NET MVC和Entity ...
随机推荐
- 从svn检出项目的注意事项
提交到svn的时候,选择忽略.project,.settings,.classpath等文件,检出项目的时候就不能选择 [做为工作作为工作空间的项目检出].而应该选择做为新项目检出. 然后选择工程的类 ...
- Android MediaPlayer 常用方法介绍
Android MediaPlayer 常用方法介绍 方法:create(Context context, Uri uri) 解释:静态方法,通过Uri创建一个多媒体播放器. 方法:create(Co ...
- 【Qt开发】常用控件--QSpinBox和QDoubleSpinBox
QSpinBox和QDoubleSpinBox 是UI设计常用的控件. QSpinBox可用于显示和输入整数,并可以在显示框中添加前缀或后缀. QDoubleSpinBox可用于显示和输入小数,并可以 ...
- 微服务Kong(四)——添加插件
在本节中,您将学习到,如何配置使用KONG的插件来管理您的API.KONG的核心原则之一就是通过插件来实现API的扩展.插件可以使您更为简单的扩展和管理您的API. 在以下的步骤中,您将通过配置key ...
- webstorm中es6语法报错,.vue文件中es6语法报错
1.webstorm中es6语法报错,解决方法: 打开 Settings => Languages & Frameworks => Javascript把 Javascript L ...
- TypeScript 乱糟笔记
数组头上插一个值. var arr: Array<String> = ['a', 'b', 'c'];arr.unshift('d'); object删除元素. var obj: Obje ...
- 第10天:apply和call、bind、函数作为参数、返回值使用、闭包、递归的样例
apply和call apply和call都可以改变this的指向 函数的调用,改变this的指向 函数名字.apply(对象,[参数1,参数2,.....]) 方法名字.apply(对象,[参数1, ...
- 四:SpringCloud-Hystrix
八:Hystrix断路器 1. 概述 1.1 分布式系统面临的问题 ==复杂分布式体系结构中的应用程序有数十个依赖关系,每个依赖关系在某些时候将不可避免地失败.== 上图中的请求需要调用A, P, H ...
- java一些对象概念扫盲帖(DO VO DTO PO)
资料来源:http://virusswb.blog.51cto.com/115214/458636 BO:Business Object,业务对象.主要是承载业务数据的实体.处理业务逻辑的时候使用,数 ...
- 线程不安全的类不要轻易做为static变量使用,及如何使用ThreadLocal将共享变量变为独享变量
参考原文:<关于SimpleDateFormat安全的时间格式化线程安全问题>