iOS 數字滾動類似於老 - 虎- 機的效果

效果圖具體實現代碼如下 ZCWScrollNumView.h文件 ZCWScrollNumView.m文件控制端代碼 ...

效果圖

具體實現代碼如下

ZCWScrollNumView.h文件

#import <UIKit/UIKit.h>

typedef enum {
    ZCWScrollNumAnimationTypeNone,
    ZCWScrollNumAnimationTypeNormal,
    ZCWScrollNumAnimationTypeFromLast,
    ZCWScrollNumAnimationTypeRand,
    ZCWScrollNumAnimationTypeFast
} ZCWScrollNumAnimationType;

@interface ZCWScrollDigitView : UIView {
    CGFloat _oneDigitHeight;
}

@property (retain, nonatomic) UIView *backgroundView;
@property (retain, nonatomic) UILabel *label;
@property (readonly, nonatomic) NSUInteger digit;
@property (retain, nonatomic) UIFont *digitFont;

- (void)setDigitAndCommit:(NSUInteger)aDigit;
- (void)setDigitFromLast:(NSUInteger)aDigit;
- (void)setDigit:(NSUInteger)aDigit from:(NSUInteger)last;
- (void)setDigitFast:(NSUInteger)aDigit;
- (void)setRandomScrollDigit:(NSUInteger)aDigit length:(NSUInteger)length;

- (void)commitChange;

- (void)didConfigFinish;

@end

@interface ZCWScrollNumView : UIView {
    NSMutableArray *_numberViews;
}

@property (nonatomic) NSUInteger numberSize;
@property (nonatomic) CGFloat splitSpaceWidth;
@property (nonatomic) CGFloat topAndBottomPadding;
@property (readonly, nonatomic) NSUInteger numberValue;
@property (retain, nonatomic) UIView *backgroundView;
@property (retain, nonatomic) UIView *digitBackgroundView;
@property (retain, nonatomic) UIFont *digitFont;
@property (readonly, nonatomic) NSArray *numberViews;
@property (retain, nonatomic) UIColor *digitColor;
@property (nonatomic) NSUInteger randomLength;
- (void)setNumber:(NSUInteger)number withAnimationType:(ZCWScrollNumAnimationType)type animationTime:(NSTimeInterval)timeSpan;

- (void)didConfigFinish;
@end

ZCWScrollNumView.m文件

#import "ZCWScrollNumView.h"

#define kRandomLength 10
#define kDefaultDigitFont   [UIFont systemFontOfSize:14.0]

@implementation ZCWScrollDigitView

@synthesize backgroundView;
@synthesize label;
@synthesize digit;
@synthesize digitFont;
- (void)setDigitAndCommit:(NSUInteger)aDigit {
    self.label.text = [NSString stringWithFormat:@"%zd", aDigit];
    CGRect rect = self.label.frame;
    rect.origin.y = 0;
    rect.size.height = _oneDigitHeight;
    self.label.numberOfLines = 1;
    self.label.frame = rect;
    digit = aDigit;
}
- (void)setDigit:(NSUInteger)aDigit from:(NSUInteger)last{
    if (aDigit == last) {
        [self setDigitAndCommit:aDigit];
        return;
    }
    NSMutableString *str = [NSMutableString stringWithFormat:@"%zd", last];
    int count = 1;
    if (aDigit > last) {
        for (int i = (int)last + 1; i < aDigit + 1; ++i) {
            ++count;
            [str appendFormat:@"\n%d", i];
        }
    } else {
        for (int i = (int)last + 1; i < 10; ++i) {
            ++count;
            [str appendFormat:@"\n%d", i];
        }
        for (int i = 0; i < aDigit + 1; ++i) {
            ++count;
            [str appendFormat:@"\n%d", i];
        }
    }
    self.label.text = str;
    self.label.numberOfLines = count;
    CGRect rect = self.label.frame;
    rect.origin.y = 0;
    rect.size.height = _oneDigitHeight * count;
    self.label.frame = rect;
    digit = aDigit;
}
- (void)setDigitFromLast:(NSUInteger)aDigit {
    [self setDigit:aDigit from:self.digit];
    
}

- (void)setDigitFast:(NSUInteger)aDigit{
    self.label.text = [NSString stringWithFormat:@"%zd\n%zd", self.digit, aDigit];
    self.label.numberOfLines = 2;
    CGRect rect = self.label.frame;
    rect.origin.y = 0;
    rect.size.height = _oneDigitHeight * 2;
    self.label.frame = rect;
    digit = aDigit;
}

- (void)setRandomScrollDigit:(NSUInteger)aDigit length:(NSUInteger)length{
    NSMutableString *str = [NSMutableString stringWithFormat:@"%zd", self.digit];
    for (int i = 1; i < length - 1; ++i) {
        [str appendFormat:@"\n%d", rand() % 10];
    }
    [str appendFormat:@"\n%zd", aDigit];
    self.label.text = str;
    self.label.numberOfLines = length;
    CGRect rect = self.label.frame;
    rect.origin.y = 0;
    rect.size.height = _oneDigitHeight * length;
    self.label.frame = rect;
    digit = aDigit;

}


- (void)commitChange{

    CGRect rect = self.label.frame;
    rect.origin.y = _oneDigitHeight - rect.size.height;
    self.label.frame = rect;
}


- (void)didConfigFinish{
    
    if (self.backgroundView == nil) {
        self.backgroundView = [[UIView alloc] init];
        self.backgroundView.backgroundColor = [UIColor grayColor];
    }
    CGRect backrect = {{0, 0}, self.frame.size};
    self.backgroundView.frame = backrect;
    [self addSubview:self.backgroundView];


    CGSize size= [@"8" sizeWithFont:self.digitFont];
    
    _oneDigitHeight = size.height;
    
    CGRect rect = {{(self.frame.size.width - size.width) / 2, (self.frame.size.height - size.height) / 2}, size};
    UIView *view = [[UIView alloc] initWithFrame:rect];
    view.backgroundColor = [UIColor clearColor];
    view.clipsToBounds = YES;
    rect.origin.x = 0;
    rect.origin.y = 0;
    self.label = [[UILabel alloc] initWithFrame:rect];
    self.label.font = self.digitFont;
    self.label.backgroundColor = [UIColor clearColor];
    [view addSubview:self.label];
    [self addSubview:view];
    [self setDigitAndCommit:self.digit];
    
    
    
}


@end



@implementation ZCWScrollNumView
@synthesize numberSize;
@synthesize numberValue;
@synthesize backgroundView;
@synthesize digitBackgroundView;
@synthesize digitFont;
@synthesize numberViews = _numberViews;
@synthesize splitSpaceWidth;
@synthesize topAndBottomPadding;
- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        [self initScrollNumView];
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder:aDecoder]) {
        [self initScrollNumView];
    }
    return self;
}

- (void)initScrollNumView {
    self.numberSize = 1;
    numberValue = 0;
    self.splitSpaceWidth = 2.0;
    self.topAndBottomPadding = 2.0;
    self.digitFont = kDefaultDigitFont;
    self.randomLength = kRandomLength;
}
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code
}
*/

- (void)setNumber:(NSUInteger)number withAnimationType:(ZCWScrollNumAnimationType)type animationTime:(NSTimeInterval)timeSpan {
    for (int i = 0; i < numberSize; ++i) {
        ZCWScrollDigitView *digitView = [_numberViews objectAtIndex:i];
        NSUInteger digit = [ZCWScrollNumView digitFromNum:number withIndex:i];
        if (digit != [self digitIndex:i] || type == ZCWScrollNumAnimationTypeRand)
            switch (type) {
                case ZCWScrollNumAnimationTypeNone:
                    [digitView setDigit:digit from:digit];
                    break;
                    
                case ZCWScrollNumAnimationTypeNormal:
                    [digitView setDigit:digit from:0];
                    break;
                case ZCWScrollNumAnimationTypeFromLast:
                    [digitView setDigitFromLast:digit];
                    break;
                    
                case ZCWScrollNumAnimationTypeRand:
                    [digitView setRandomScrollDigit:digit length:self.randomLength];
                    break;
                case ZCWScrollNumAnimationTypeFast:
                    [digitView setDigitFast:digit];
                default:
                    break;
            }
    }
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:timeSpan];
    
    for (ZCWScrollDigitView *digitView in _numberViews) {
        [digitView commitChange];
    }
    [UIView commitAnimations];
    numberValue = number;
}

+ (NSUInteger)digitFromNum:(NSUInteger)number withIndex:(NSUInteger)index {
    NSUInteger num = number;
    for (int i = 0; i < index; ++i) {
        num /= 10;
    }
    
    return num % 10;
}

- (NSUInteger)digitIndex:(NSUInteger)index {
    return [ZCWScrollNumView digitFromNum:self.numberValue withIndex:index];
    
}

- (void)didConfigFinish {
    CGRect backRect = {{0, 0}, self.frame.size};
    self.backgroundView.frame = backRect;
    [self addSubview:self.backgroundView];
    _numberViews = [[NSMutableArray alloc] initWithCapacity:self.numberSize];
    CGFloat allWidth = self.frame.size.width;
    CGFloat digitWidth = (allWidth - (self.numberSize + 1) * splitSpaceWidth) / self.numberSize;
    NSData *digitBackgroundViewData = [NSKeyedArchiver archivedDataWithRootObject:self.digitBackgroundView];
    for (int i = 0; i < numberSize; ++i) {
        CGRect rect = {{allWidth - (digitWidth + self.splitSpaceWidth) * (i + 1), self.topAndBottomPadding}, {digitWidth, self.frame.size.height - self.topAndBottomPadding * 2}};
        
        ZCWScrollDigitView *digitView = [[ZCWScrollDigitView alloc] initWithFrame:rect];
        digitView.backgroundView = [NSKeyedUnarchiver unarchiveObjectWithData:digitBackgroundViewData];
        digitView.digitFont = self.digitFont;
        [digitView didConfigFinish];
        [digitView setDigitAndCommit:[self digitIndex:i]];
        if (self.digitColor != nil) {
            digitView.label.textColor = self.digitColor;
        }
        [_numberViews addObject:digitView];
        [self addSubview:digitView];
    }
}
@end

控制端代碼

#import "TianJiCeSuanViewController.h"
#import "ZCWScrollNumView.h"
#import "HXSrollAnimalView.h"

#define kAllFullSuperviewMask      UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleBottomMargin;

@interface TianJiCeSuanViewController ()
@property (weak, nonatomic) IBOutlet UIImageView *BgView;
@property (weak, nonatomic) IBOutlet HXSrollAnimalView *shengxiaoView;
@property (weak, nonatomic) IBOutlet ZCWScrollNumView *weishuView;

@end

@implementation TianJiCeSuanViewController

- (void)viewDidLoad {
    [super viewDidLoad];

//    設置導航欄
    [self setNav];

    [self setscrollNumer];
    [self setscrollAnimal];

    [self.view insertSubview:self.BgView atIndex:0];
}

-(void)setscrollNumer{

    CGRect tmp = self.weishuView.bounds;
    self.weishuView.numberSize = 3
    ;
    UIImage *image = [[UIImage imageNamed:@"bj_numbg"] stretchableImageWithLeftCapWidth:10 topCapHeight:14];
    self.weishuView.backgroundView = [[UIImageView alloc] initWithImage:image];
    UIView *digitBackView = [[UIView alloc] initWithFrame:tmp];
    digitBackView.backgroundColor = [UIColor clearColor];
    digitBackView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
    digitBackView.autoresizesSubviews = YES;
    image = [[UIImage imageNamed:@"money_bg"] stretchableImageWithLeftCapWidth:12 topCapHeight:12];
    UIImageView *bgImageView = [[UIImageView alloc] initWithImage:image];
    bgImageView.frame = tmp;
    bgImageView.autoresizingMask = kAllFullSuperviewMask;
    [digitBackView addSubview:bgImageView];
    image = [[UIImage imageNamed:@"money_bg_mask"] stretchableImageWithLeftCapWidth:12 topCapHeight:12];
    UIImageView *bgMaskImageView = [[UIImageView alloc] initWithImage:image];
    bgMaskImageView.autoresizingMask = kAllFullSuperviewMask;
    bgMaskImageView.frame = tmp;
    [digitBackView addSubview:bgMaskImageView];
    
    self.weishuView.digitBackgroundView = digitBackView;
    self.weishuView.digitColor = [UIColor whiteColor];
    self.weishuView.digitFont = [UIFont systemFontOfSize:17.0];
    [self.weishuView didConfigFinish];
}
-(void)setscrollAnimal{
    
    CGRect tmp = self.shengxiaoView.bounds;
    self.shengxiaoView.numberSize = 3
    ;
    UIImage *image = [[UIImage imageNamed:@"bj_numbg"] stretchableImageWithLeftCapWidth:10 topCapHeight:14];
    self.shengxiaoView.backgroundView = [[UIImageView alloc] initWithImage:image];
    UIView *digitBackView = [[UIView alloc] initWithFrame:tmp];
    digitBackView.backgroundColor = [UIColor clearColor];
    digitBackView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
    digitBackView.autoresizesSubviews = YES;
    image = [[UIImage imageNamed:@"money_bg"] stretchableImageWithLeftCapWidth:12 topCapHeight:12];
    UIImageView *bgImageView = [[UIImageView alloc] initWithImage:image];
    bgImageView.frame = tmp;
    bgImageView.autoresizingMask = kAllFullSuperviewMask;
    [digitBackView addSubview:bgImageView];
    image = [[UIImage imageNamed:@"money_bg_mask"] stretchableImageWithLeftCapWidth:12 topCapHeight:12];
    UIImageView *bgMaskImageView = [[UIImageView alloc] initWithImage:image];
    bgMaskImageView.autoresizingMask = kAllFullSuperviewMask;
    bgMaskImageView.frame = tmp;
    [digitBackView addSubview:bgMaskImageView];
    
    self.shengxiaoView.digitBackgroundView = digitBackView;
    self.shengxiaoView.digitColor = [UIColor whiteColor];
    self.shengxiaoView.digitFont = [UIFont systemFontOfSize:17.0];
    [self.shengxiaoView didConfigFinish];
}

-(void)setNav{
    //    設置導航欄的標題
    self.navigationItem.title = @"天機測算";
    //    設置字體
    [self.navigationController.navigationBar setTitleTextAttributes:
     @{NSFontAttributeName:[UIFont systemFontOfSize:19],
       NSForegroundColorAttributeName:XMGRGBColor(216, 184, 123)}];
    self.navigationItem.rightBarButtonItem = [UIBarButtonItem itemWithImage:@"ico_share" highImage:@"ico_share" target:self action:@selector(share)];
}

-(void)share{
    
}
- (IBAction)qiuShengXiao {
 
    self.shengxiaoView.hidden = NO;
    [self.shengxiaoView setNumber:rand() withAnimationType:HXSScrollNumAnimationTypeRand animationTime:3];

    
}
- (IBAction)qiuWeiShu {
    self.weishuView.hidden = NO;
    [self.weishuView setNumber:rand() withAnimationType:ZCWScrollNumAnimationTypeRand animationTime:3];
}
@end

iOS 數字滾動 類似於老 - 虎- 機的效果

iOS 數字滾動類似於老 - 虎- 機的效果