自制圆形时钟⏰

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

#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的一些动画效果实现的。

相关推荐
玫瑰花开一片一片13 分钟前
Flutter IOS 真机 Widget 错误。Widget 安装后系统中没有
flutter·ios·widget·ios widget
烎就是我2 小时前
100行代码swift从零实现一个iOS日历
ios·swift
鸿蒙布道师17 小时前
鸿蒙NEXT开发通知工具类(ArkTs)
android·ios·华为·harmonyos·arkts·鸿蒙系统·huawei
鸿蒙布道师17 小时前
鸿蒙NEXT开发网络相关工具类(ArkTs)
android·ios·华为·harmonyos·arkts·鸿蒙系统·huawei
余生大大1 天前
关于Safari浏览器在ios<16.3版本不支持正则表达式零宽断言的解决办法
ios·正则表达式·safari
爱分享的程序员1 天前
前端跨端框架的开发以及IOS和安卓的开发流程和打包上架的详细流程
android·前端·ios
Macle_Chen1 天前
ios开发中xxx.debug.dylib not found
ios·bug·debug.dylib
WDeLiang2 天前
Flutter 环境搭建
flutter·ios·visual studio code
lilili啊啊啊2 天前
iOS 应用性能测试工具对比:Xcode Instruments、克魔助手与性能狗
测试工具·ios·iphone·xcode·克魔
264玫瑰资源库3 天前
嘻游电玩三端客户端部署实战:PC + Android + iOS 环境全覆盖教程
android·ios