時鐘動畫製作

//  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 = [[UIViewalloc] initWithFrame:CGRectMake(60,100, 200, 200)];
        //設置錶盤背景圖片
        _clockView.backgroundColor = [UIColorcolorWithPatternImage:[UIImageimageNamed:@"42d75fd82eafc032a86bfd4eff1cd4bc"]];
        //設置錶盤圖層圓角半徑
        _clockView.layer.cornerRadius =100;
        //設置錶盤圖層邊線
        _clockView.layer.borderColor = [UIColordarkGrayColor].CGColor;
        //邊框的寬
        _clockView.layer.borderWidth =3.0;
       
        // 秒針
        _secondView = [[UIViewalloc] 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 = [UIColorredColor];//顏色
       
        // 分針
        _minuteView = [[UIViewalloc] 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 = [UIColorblackColor];
        _hourView = [[UIViewalloc] 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 = [UIColorblackColor];
       
        //實例化釘
        _nailView = [[UIViewalloc] initWithFrame:CGRectMake(0,0, 6,6)];
        //中心點
        _nailView.center =_hourView.center;
        //背景顏色
        _nailView.backgroundColor = [UIColoryellowColor];
        //設置釘圓角半徑
        _nailView.layer.cornerRadius =3;
        //設置釘邊線
        _nailView.layer.borderColor = [UIColororangeColor].CGColor;
        //邊框的寬
        _nailView.layer.borderWidth =1.0;
        //把三個針添加到錶盤上
        [_clockView addSubview:_hourView];
        [_clockView addSubview:_minuteView];
        [_clockView addSubview:_secondView];
        [_clockView addSubview:_nailView];
        //把錶盤添加到view上
        [self.viewaddSubview:_clockView];
    }
    return _clockView;
}

- (void)viewDidLoad
{
    [super viewDidLoad];
    //設置背景顏色
    self.view.backgroundColor = [UIColorlightGrayColor];
    [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 = [CADisplayLinkdisplayLinkWithTarget:selfselector:@selector(updateTimer)];
   //執行定時器把定時器放在主運行循環中執行
    [link addToRunLoop:[NSRunLoopmainRunLoop] forMode:NSDefaultRunLoopMode];
}

#define degree2angle(angle)     ((angle) * M_PI /180)
- (void)updateTimer
{
  //  NSLog(@"%s", __func__);
   
    // 實例化日曆對象
    NSCalendar *calendar = [NSCalendarcurrentCalendar];
   
    // 獲取當前時間的秒數
    NSDateComponents *comps = [calendarcomponents:NSCalendarUnitSecondfromDate:[NSDatedate]];
    // 獲取當前時間的分鐘數
    NSDateComponents *minute = [calendarcomponents:NSCalendarUnitMinutefromDate:[NSDatedate]];
    // 獲取當前時間的分鐘數
    NSDateComponents *hour = [calendarcomponents:NSCalendarUnitHourfromDate:[NSDatedate]];
   // 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