Uicountinglabel the animation effect of digital change-B

In most financial apps or where other apps need a digital display, there are often the following animations:

Animation effects

How do you do it?

First, download Uicountinglabel

: Https://github.com/dataxpress/UICountingLabel
Uicountinglabel only supports shaping and floating-point style, and the amount shown in most financial apps (with the thousand-bit separator) is not displayed, but the solution is given to achieve these effects!

Second, the use of UICountingLabel1. Initialization

Uicountinglabel inherits UILabel, initializes and UILabel as follows:

UICountingLabel* myLabel = [[UICountingLabel alloc] initWithFrame:CGRectMake(10, 10, 100, 40)]; [self.view addSubview:myLabel];

2. Set the text style

You can set this:

myLabel.format = @"%d";

You can also use the Block settings:

myLabel.formatBlock = ^NSString* (CGFloat value) {         NSInteger years = value / 12;    NSInteger months = (NSInteger)value % 12;    if (years == 0) {        return [NSString stringWithFormat: @"%ld months", (long)months];     }    else {        return [NSString stringWithFormat: @"%ld years, %ld months", (long)years, (long)months];     } };

3. Setting the range of changes and animation time

[myLabel countFrom:50 to:100 withDuration:5.0f];

It's so easy!

Third, the example effect 1. Changes in integer style numbers

The code is as follows:

UICountingLabel *myLabel = [[UICountingLabel alloc] initWithFrame:CGRectMake(20, CGRectGetMaxY(titleLabel.frame)+1, 280, 45)]; myLabel.textAlignment = NSTextAlignmentCenter; myLabel.font = [UIFont fontWithName:@"Avenir Next" size:48]; myLabel.textColor = [UIColor colorWithRed:236/255.0 green:66/255.0 blue:43/255.0 alpha:1]; [self.view addSubview:myLabel];//设置格式myLabel.format = @"%d";//设置变化范围及动画时间[self.myLabel countFrom:0                          to:100                withDuration:1.0f];

As follows:

Integer style

2. Changes in floating-point number style numbers

The code is as follows:

UICountingLabel *myLabel = [[UICountingLabel alloc] initWithFrame:CGRectMake(20, CGRectGetMaxY(titleLabel.frame)+1, 280, 45)]; myLabel.textAlignment = NSTextAlignmentCenter; myLabel.font = [UIFont fontWithName:@"Avenir Next" size:48]; myLabel.textColor = [UIColor colorWithRed:236/255.0 green:66/255.0 blue:43/255.0 alpha:1]; [self.view addSubview:myLabel];//设置格式myLabel.format = @"%.2f";//设置变化范围及动画时间[self.myLabel countFrom:0.00                          to:3198.23                withDuration:1.0f];

As follows:

Floating-point style

3. Floating-point number styles with thousand-bit separators

Since Uicountinglabel does not have this style, it is necessary to modify the Uicountinglabel file slightly.
First UICountingLabel.h Add an attribute to the header file, such as:

Add positiveFormat Property

Then UICountingLabel.m add the following code to the file inside the - (void)setTextValue:(CGFloat)value method:

Add this piece of code

This way, Uicountinglabel can implement this style.

The following is the beginning of implementing this style, the code is as follows:

UICountingLabel *myLabel = [[UICountingLabel alloc] initWithFrame:CGRectMake(20, CGRectGetMaxY(titleLabel.frame)+1, 280, 45)]; myLabel.textAlignment = NSTextAlignmentCenter; myLabel.font = [UIFont fontWithName:@"Avenir Next" size:48]; myLabel.textColor = [UIColor colorWithRed:236/255.0 green:66/255.0 blue:43/255.0 alpha:1]; [self.view addSubview:myLabel];//设置格式myLabel.format = @"%.2f";//设置分隔符样式myLabel.positiveFormat = @"###,##0.00";//设置变化范围及动画时间[self.myLabel countFrom:0.00                     to:3048.64           withDuration:1.0f];

As follows:

Floating-point number with thousand separator

Uicountinglabel animating Digital changes-B