iOS时钟开发案例分享

2020-07-26 03:23:13

字体：大中小

来源：转载

供稿：网友

本文实例为大家介绍了iOS时钟开发过程，供大家参考，具体内容如下

思路就是利用CALayer的隐式动画来实现。因为UIView的非根层也就是手动创建的layer在其属性发生变化时会默认会产生动画效果，这些属性也叫作可动画属性。比如bounds、backgroundColor、position。

时钟里面表盘就是一个UIView，而三根针就是三个手动创建的layer。

先在storyboard上弄一个UIImageView，设置表盘图片

然后在viewDidLoad中初始化三根针，并设置定时器，获取当前时间，将当前时间对应的时针分针秒针分别指向对应的角度。

//// ViewController.m// 时钟效果//// Created by Daniel on 16/4/7.// Copyright © 2016年 Daniel. All rights reserved.// #define kClockWH _clockView.bounds.size.width //一秒钟秒针转多少度#define preSecondA 6 //一分钟分针转多少度#define preMinuteA 6 //一小时时针转多少度#define preHourA 30 //每分钟时针转多少度#define preHourMinute 0.5 //每秒钟分针转多少度#define preMinuteSecond 0.1 #define angle2raditon(a) ((a) / 180.0 * M_PI) #import "ViewController.h" @interface ViewController ()@property (weak, nonatomic) IBOutlet UIImageView *clockView; /** 秒针 */@property(nonatomic, strong) CALayer *secondL; /** 分针 */@property(nonatomic, strong) CALayer *minuteL; /** 时针 */@property(nonatomic, strong) CALayer *hourL; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad];   //添加时针 [self setUpHourLayer];   //添加分针 [self setUpMinuteLayer];  //添加秒针 [self setUpSecondLayer];   //添加定时器 [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];   //开始运行时就获取时间，这样在启动时就不会有停顿的感觉 [self timeChange];  } - (void)timeChange {   //获取当前系统时间 NSCalendar *calendar = [NSCalendar currentCalendar];   NSDateComponents *cmp = [calendar components:NSCalendarUnitSecond | NSCalendarUnitMinute | NSCalendarUnitHour fromDate:[NSDate date]];   //获取秒 NSInteger second = cmp.second;   //获取分 NSInteger minute = cmp.minute;   //获取小时 NSInteger hour = cmp.hour;   //计算秒针转多少度 CGFloat secondA = second * preSecondA;   //计算分针转多少度 CGFloat minuteA = minute * preMinuteA + second * preMinuteSecond;   //计算时针转多少度 CGFloat hourA = hour * preHourA + minute * preHourMinute;   //旋转秒针 _secondL.transform = CATransform3DMakeRotation(angle2raditon(secondA), 0, 0, 1);   //旋转分针 _minuteL.transform = CATransform3DMakeRotation(angle2raditon(minuteA), 0, 0, 1);   //旋转时针 _hourL.transform = CATransform3DMakeRotation(angle2raditon(hourA), 0, 0, 1);  } #pragma mark - 初始化时针- (void)setUpHourLayer {   CALayer *hourL = [CALayer layer];   //设置秒针背景色 hourL.backgroundColor = [UIColor blackColor].CGColor;   //设置秒针锚点 hourL.anchorPoint = CGPointMake(0.5, 1);   //设置秒针锚点在父控件的位置 hourL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);   hourL.cornerRadius = 4;   //设置秒针bounds hourL.bounds = CGRectMake(0, 0, 4, kClockWH * 0.5 - 40);   //把秒针添加到clockView图层上 [_clockView.layer addSublayer:hourL];   _hourL = hourL;  }  #pragma mark - 初始化分针- (void)setUpMinuteLayer {   CALayer *minuteL = [CALayer layer];   //设置秒针背景色 minuteL.backgroundColor = [UIColor blackColor].CGColor;   //设置秒针锚点 minuteL.anchorPoint = CGPointMake(0.5, 1);   //设置秒针锚点在父控件的位置 minuteL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);   minuteL.cornerRadius = 4;   //设置秒针bounds minuteL.bounds = CGRectMake(0, 0, 4, kClockWH * 0.5 - 20);   //把秒针添加到clockView图层上 [_clockView.layer addSublayer:minuteL];   _minuteL = minuteL;  } #pragma mark - 初始化秒针- (void)setUpSecondLayer {   CALayer *secondL = [CALayer layer];   //设置秒针背景色 secondL.backgroundColor = [UIColor redColor].CGColor;   //设置秒针锚点 secondL.anchorPoint = CGPointMake(0.5, 1);   //设置秒针锚点在父控件的位置 secondL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);     //设置秒针bounds secondL.bounds = CGRectMake(0, 0, 1.5, kClockWH * 0.5 - 20);   //把秒针添加到clockView图层上 [_clockView.layer addSublayer:secondL];   _secondL = secondL;  }  @end

效果图：