时钟动画制作

//  CZViewController.m
//  04- 定位点动画（时钟动画）
//
//  Created by apple on 16/07/14.
//  Copyright (c) 2014 年 itcast. All rights reserved.
//

效果图
 
#import "CZViewController.h"

@interface CZViewController ()
// 钟表
@property ( nonatomic, strong) UIView *clockView;
// 秒针
@property ( nonatomic, strong) UIView *secondView;
// 分针
@property ( nonatomic, strong) UIView *minuteView;
// 时针
@property ( nonatomic, strong) UIView *hourView;
// 固定的钉
@property ( nonatomic, strong) UIView *nailView;
@end

@implementation CZViewController
/**
 1. 画钟表
 2. 画秒针
 3. 时钟动画让秒针旋转
 */

// 懒加载创建表盘
- ( UIView *)clockView
{
    if ( _clockView == nil) {
        // 实例化表盘
        _clockView = [[ UIView alloc] initWithFrame: CGRectMake( 60, 100, 200, 200)];
        // 设置表盘背景图片
        _clockView. backgroundColor = [ UIColor colorWithPatternImage:[ UIImage imageNamed: @"42d75fd82eafc032a86bfd4eff1cd4bc"]];
        // 设置表盘图层圆角半径
        _clockView. layer. cornerRadius = 100;
        // 设置表盘图层边线
        _clockView. layer. borderColor = [ UIColor darkGrayColor]. CGColor;
        // 边框的宽
        _clockView. layer. borderWidth = 3.0;
       
        // 秒针
        _secondView = [[ UIView alloc] initWithFrame: CGRectMake( 0, 0, 2.0, 100.0)];
//        _secondView.center = CGPointMake(100, 55);
        // center 本质上就是 layer 的 position
        _secondView. center = CGPointMake( 100, 100); // 中心点
        _secondView. layer. anchorPoint = CGPointMake( 0.5, 0.75); // 定位点
        _secondView. backgroundColor = [ UIColor redColor]; // 颜色
       
        // 分针
        _minuteView = [[ UIView alloc] initWithFrame: CGRectMake( 0, 0, 4.0, 80.0)];
        //        _secondView.center = CGPointMake(100, 55);
        // center 本质上就是 layer 的 position
        _minuteView. center = CGPointMake( 100, 100);
        _minuteView. layer. anchorPoint = CGPointMake( 0.5, 0.85);
        _minuteView. backgroundColor = [ UIColor blackColor];
        _hourView = [[ UIView alloc] initWithFrame: CGRectMake( 0, 0, 6.0, 60.0)];
        //        _secondView.center = CGPointMake(100, 55);
       
        // 时针
        // center 本质上就是 layer 的 position
        _hourView. center = CGPointMake( 100, 100);
        _hourView. layer. anchorPoint = CGPointMake( 0.5, 0.9);
        _hourView. backgroundColor = [ UIColor blackColor];
       
        // 实例化钉
        _nailView = [[ UIView alloc] initWithFrame: CGRectMake( 0, 0, 6, 6)];
        // 中心点
        _nailView. center = _hourView. center;
        // 背景颜色
        _nailView. backgroundColor = [ UIColor yellowColor];
        // 设置钉圆角半径
        _nailView. layer. cornerRadius = 3;
        // 设置钉边线
        _nailView. layer. borderColor = [ UIColor orangeColor]. CGColor;
        // 边框的宽
        _nailView. layer. borderWidth = 1.0;
        // 把三个针 添加到表盘上
        [ _clockView addSubview: _hourView];
        [ _clockView addSubview: _minuteView];
        [ _clockView addSubview: _secondView];
        [ _clockView addSubview: _nailView];
        // 把表盘添加到 view 上
        [ self. view addSubview: _clockView];
    }
    return _clockView;
}

- ( void)viewDidLoad
{
    [ super viewDidLoad];
    // 设置背景颜色
    self. view. backgroundColor = [ UIColor lightGrayColor];
    [ self clockView];
   
    // 秒针旋转
//    self.secondView.transform = CGAffineTransformMakeRotation(M_PI_2);
    // 时钟动画，定时器
   // [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(updateTimer) userInfo:nil repeats:YES];
   
    //CADisplayLink 也是一个定时器 用于刷新
   
    // 声明一个定时器
    // link 默认是 1/60 秒执行一次
    CADisplayLink *link = [ CADisplayLink displayLinkWithTarget: self selector: @selector(updateTimer)];
   // 执行定时器 把定时器放在主运行循环中执行
    [link addToRunLoop:[ NSRunLoop mainRunLoop] forMode: NSDefaultRunLoopMode];
}

#define degree2angle(angle)     ((angle) * M_PI / 180 )
- ( void)updateTimer
{
  //  NSLog(@"%s", __func__);
   
    // 实例化日历对象
    NSCalendar *calendar = [ NSCalendar currentCalendar];
   
    // 获取当前时间的秒数
    NSDateComponents *comps = [calendar components: NSCalendarUnitSecond fromDate:[ NSDate date]];
    // 获取当前时间的分钟数
    NSDateComponents *minute = [calendar components: NSCalendarUnitMinute fromDate:[ NSDate date]];
    // 获取当前时间的分钟数
    NSDateComponents *hour = [calendar components: NSCalendarUnitHour fromDate:[ NSDate date]];
   // NSLog(@"%.2f", 10/0.3);
   
    // 设置秒针的旋转
    CGFloat angle = degree2angle(comps. second * 360 / 60);
    self. secondView. transform = CGAffineTransformMakeRotation(angle);
    // 设置分针的旋转
    CGFloat angleM = degree2angle(minute. minute * 360 / 60);
    self. minuteView. transform = CGAffineTransformMakeRotation(angleM);
    // 设置时针的旋转
    CGFloat angleH = degree2angle(hour. hour* 30 + minute. minute/ 10.0 * 5);
    self. hourView. transform = CGAffineTransformMakeRotation(angleH);
   // (hour*30) + (minutes/10)*6
}

@end