iOS开发之手动绘制时钟模拟器

最新推荐文章于 2021-09-17 22:35:06 发布

qq_22564251

最新推荐文章于 2021-09-17 22:35:06 发布

阅读量919

点赞数

分类专栏： iOS绘图文章标签： ios开发 gcd 生活

本文链接：https://blog.csdn.net/qq_22564251/article/details/44780011

版权

本文介绍如何利用iOS的Core Graphics框架，在应用中实现一个动态更新的时钟模拟器。模拟器包括表盘、时针、分针和秒针，能够根据系统时间实时调整显示。同时，提供了开始和暂停功能，可以控制时钟的转动。通过自定义clock，设置颜色和尺寸，以及使用贝塞尔曲线绘制指针，最终呈现出逼真的时钟效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用系统提供的corez2D框架，将我们现实生活中的钟表在xode中画出来，并显示在应用程序上，钟表上包括表盘、时针、分针、秒针，当我们运行程序的时候，程序将根据系统当前时间去设置该钟表的时间，当点击暂停按钮后，时间模拟器将暂停，当点击开始按钮后不会从你停止的那个时间转动，会跳到系统当前时间再转动。当系统时间发生改变的时候，将获取当前系统的时间，计算出指针的旋转角度，并做出相应旋转，从而达到现实生活中指针转动的效果。

实现原理：

1.自定义clock，通过外面将一些属性值传进来，通过这些值设置表盘的颜色，时针、分针、秒针的颜色

@property(nonatomic,strong)UIColor *clockTintColor;

@property(nonatomic,assign)CGFloat clockBorderWidth;
@property(nonatomic,strong)UIColor *clockBorderColor; 

@property(nonatomic,strong)UIColor *hourHandColor;
@property(nonatomic,assign)CGFloat hourHandWidth;

@property(nonatomic,strong)UIColor *minuteHandColor; 
@property(nonatomic,assign)CGFloat minuteHandWidth;

@property (nonatomic, strong) UIColor *secondHandColor;         
@property (nonatomic, assign) CGFloat secondHandWidth;          

@property (nonatomic, strong) NSDictionary *momentAttribute;    
@property (nonatomic, strong) NSArray *momentList;              

@property (nonatomic, strong) UIColor *centerPointColor;        
@property (nonatomic, assign) CGFloat centerPointRadius;

2.获取上下文对象，通过外部给表盘设置的大小，计算表盘的半径，并将表盘的边框和背景绘制

    CGContextRef context = UIGraphicsGetCurrentContext();
        
    //绘制表盘边框和背景色
    CGContextSetStrokeColorWithColor(context, _clockBorderColor.CGColor);
    CGContextSetFillColorWithColor(context, _clockTintColor.CGColor);
    CGContextSetLineWidth(context, _clockBorderWidth);
    
    _radius = (self.frame.size.width < self.frame.size.height)?self.frame.size.width/2.f : self.frame.size.height/2.f;
    _radius = _radius - _clockBorderWidth;
    CGContextAddArc(context, CGRectGetWidth(self.frame)/2.f, CGRectGetHeight(self.frame)/2.f, _radius, 0.f, 2*M_PI, 0.f);
    CGContextDrawPath(context, kCGPathFillStro