iOS开发之简易时钟的制作

效果图如下：

在这上面的时间是会自己走动的，下面我们来看看它是怎么实现的

首先，我们得先准备两张图片，如下

1、定义三个展示时分秒的全局变量，方便使用

{
    CALayer *sLayer;
    CALayer *mLayer;
    CALayer *hLayer;
}

2、将表盘那张image 附在self.view上

    UIImage *image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle]pathForResource:@"表盘.png" ofType:nil]];
    UIImageView *bgView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, image.size.width/3, image.size.height/3)];
    bgView.image = image;
    bgView.center = self.view.center;
    [self.view addSubview:bgView];

3、这样我们就有了表盘的轮廓，但是还没有指针，接下来我们创建3个CALayer，显示指针

 UIImage *image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle]pathForResource:@"指针.png" ofType:nil]];
    
    sLayer = [[CALayer alloc]init];
    sLayer.bounds = CGRectMake(0, 0, image.size.width/8, image.size.height/4);
    sLayer.position = self.view.center;
    sLayer.contents = (id)image.CGImage;
    sLayer.anchorPoint = CGPointMake(0.5, 0.7);
    [self.view.layer addSublayer:sLayer];
    
    mLayer = [[CALayer alloc]init];
    mLayer.bounds = CGRectMake(0, 0, image.size.width/7, image.size.height/5);
    mLayer.position = self.view.center;
    mLayer.anchorPoint = CGPointMake(0.5, 0.7);
    mLayer.contents = (id)image.CGImage;
    [self.view.layer addSublayer:mLayer];
    
    hLayer = [[CALayer alloc]init];
    hLayer.bounds = CGRectMake(0, 0, image.size.width/6, image.size.height/6);
    hLayer.position = self.view.center;
    hLayer.anchorPoint = CGPointMake(0.5, 0.7);
    hLayer.contents = (id)image.CGImage;
    [self.view.layer addSublayer:hLayer];

4、现在整体的轮廓已经有了，最重要的就是实现指针根据时间的运作

    CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(fireTime)];
    [link addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];

调用方法

- (void)fireTime
{
    NSCalendar *calendar = [NSCalendar currentCalendar];
//    获得当前时间的h
//    component： fromDate： 从日历里面的某个日期获得某一组件
    NSInteger h = [calendar component:NSCalendarUnitHour fromDate:[NSDate date]];
    NSInteger m = [calendar component:NSCalendarUnitMinute fromDate:[NSDate date]];
    NSInteger s = [calendar component:NSCalendarUnitSecond fromDate:[NSDate date]];
    
    sLayer.transform = CATransform3DMakeRotation(6*s*M_PI/180, 0, 0, 1);
    mLayer.transform = CATransform3DMakeRotation(6*m*M_PI/180+6*s*M_PI/180/60, 0, 0, 1);
    hLayer.transform = CATransform3DMakeRotation(6*h*M_PI/180+6*m*M_PI/180/60, 0, 0, 1);
}