自制圆形时钟⏰

如果想着做一个类似的家里的圆形时钟的样式的钟表,可以使用这样的方法:

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic ,weak)CALayer *second;

@property (nonatomic ,weak)CALayer *minute;

@property (nonatomic ,weak)CALayer *hour;

@end

@implementation ViewController

  • (void)viewDidLoad {

**super** viewDidLoad\]; **self**.view.backgroundColor = \[UIColor cyanColor\]; //创建表盘 CALayer \*clock = \[\[CALayer alloc\]init\]; //大小 clock.bounds = CGRectMake(0, 0, 200, 200); //位置 clock.position = CGPointMake(200, 200); //内容 clock.contents = (**__bridge** **id** **_Nullable**)(\[UIImage imageNamed:@"clock"\].CGImage); \[**self**.view.layer addSublayer:clock\]; //圆角 clock.cornerRadius = 100; //裁剪 clock.masksToBounds = **YES**; //创建秒针 CALayer \*second = \[\[CALayer alloc\]init\]; **self**.second = second; //大小 second.bounds = CGRectMake(0, 0, 2, 100); //位置 second.position = clock.position; //颜色 second.backgroundColor = \[UIColor redColor\].CGColor; //锚点 second.anchorPoint = CGPointMake(0.5, 0.8); \[**self**.view.layer addSublayer:second\]; //创建分针 CALayer \*minute = \[\[CALayer alloc\]init\]; **self**.minute = minute; //大小 minute.bounds = CGRectMake(0, 0, 3, 80); //位置 minute.position = clock.position; //颜色 minute.backgroundColor = \[UIColor blueColor\].CGColor; //锚点 minute.anchorPoint = CGPointMake(0.5, 0.8); \[**self**.view.layer addSublayer:minute\]; //创建时针 CALayer \*hour = \[\[CALayer alloc\]init\]; **self**.hour = hour; //大小 hour.bounds = CGRectMake(0, 0, 4, 60); //位置 hour.position = clock.position; //颜色 hour.backgroundColor = \[UIColor purpleColor\].CGColor; //锚点 hour.anchorPoint = CGPointMake(0.5, 0.8); \[**self**.view.layer addSublayer:hour\]; CADisplayLink \*link = \[CADisplayLink displayLinkWithTarget:**self** selector:**@selector**(timeChange)\]; \[link addToRunLoop:\[NSRunLoop mainRunLoop\] forMode:NSDefaultRunLoopMode\]; \[**self** timeChange\]; } -(**void**)timeChange{ NSDate \*date = \[NSDate date\]; // // NSDateFormatter \*formatter = \[\[NSDateFormatter alloc\]init\]; // formatter.dateFormat = @"ss"; // NSString \*ms = \[formatter stringFromDate:date\]; // CGFloat msValue = \[ms floatValue\]; NSCalendar \*cal = \[NSCalendar currentCalendar\]; CGFloat ms = \[cal component:NSCalendarUnitNanosecond fromDate:date\]; CGFloat s= \[cal component:NSCalendarUnitSecond fromDate:date\]; CGFloat m = \[cal component:NSCalendarUnitMinute fromDate:date\]; CGFloat h = \[cal component:NSCalendarUnitHour fromDate:date\]; //秒针角度 CGFloat angle = (2 \* M_PI/60) / 1000000000; CGFloat angle1 = 2 \* M_PI / 60; **self**.second.affineTransform = CGAffineTransformMakeRotation(angle1 \* s + angle \* ms); //分针角度 CGFloat minuteAngle = 2 \* M_PI / 60; **self**.minute.affineTransform = CGAffineTransformMakeRotation(minuteAngle \* m + angle1 \* s / 60 + angle \* ms / 60); //时针角度 CGFloat hourAngle = 2 \* M_PI / 12; **self**.hour.affineTransform = CGAffineTransformMakeRotation(hourAngle \* h + minuteAngle \* m / 12 + angle1 \* s / 60 + angle \* ms / 60); } - (**void**)didReceiveMemoryWarning { \[**super** didReceiveMemoryWarning\]; // Dispose of any resources that can be recreated. } **@end 当然还要有一个这样的表盘,** ![](https://file.jishuzhan.net/article/1721764295437455362/b44ce457bb5194d593c49f2c48cd168a.webp) 其实代码实现主要是用的CALayer的一些动画效果实现的。

相关推荐
游戏开发爱好者810 小时前
日常开发与测试的 App 测试方法、查看设备状态、实时日志、应用数据
android·ios·小程序·https·uni-app·iphone·webview
黑码哥11 小时前
ViewHolder设计模式深度剖析:iOS开发者掌握Android列表性能优化的实战指南
android·ios·性能优化·跨平台开发·viewholder
2501_9151063212 小时前
app 上架过程,安装包准备、证书与描述文件管理、安装测试、上传
android·ios·小程序·https·uni-app·iphone·webview
2501_9151063212 小时前
使用 Sniffmaster TCP 抓包和 Wireshark 网络分析
网络协议·tcp/ip·ios·小程序·uni-app·wireshark·iphone
熊猫钓鱼>_>13 小时前
移动端开发技术选型报告:三足鼎立时代的开发者指南(2026年2月)
android·人工智能·ios·app·鸿蒙·cpu·移动端
徐同保1 天前
通过ip访问nginx的服务时,被第一个server重定向了,通过设置default_server解决这个问题
ios·iphone
2501_915918412 天前
在 iOS 环境下查看 App 详细信息与文件目录
android·ios·小程序·https·uni-app·iphone·webview
2501_916007472 天前
没有 Mac 用户如何上架 App Store,IPA生成、证书与描述文件管理、跨平台上传
android·macos·ios·小程序·uni-app·iphone·webview
夏幻灵2 天前
HTTPS全面解析:原理、加密机制与证书体
ios·iphone
TheNextByte12 天前
如何在iPhone上恢复已删除的笔记的综合指南
笔记·ios·iphone