iOS 시계 개발 사례 공유

본 논문 의 사례 는 iOS 시계 개발 과정 을 소개 하 였 으 며,여러분 께 참고 하 시기 바 랍 니 다.구체 적 인 내용 은 다음 과 같 습 니 다.
사고방식 은 바로 CALayer 의 암시 적 애니메이션 을 이용 하여 실현 하 는 것 이다.UIView 의 비 근 층,즉 수 동 으로 만 든 layer 는 그 속성 이 변 할 때 기본적으로 애니메이션 효 과 를 발생 시 키 기 때문에 이러한 속성 을 애니메이션 속성 이 라 고도 부른다.예 를 들 어 bounds,backgroundColor,position.
시계 안의 시계 판 은 하나의 UIView 이 고,세 개의 바늘 은 세 개의 수 동 으로 만 든 layer 이다.
먼저 storyboard 에 UIImageView 를 만들어 서 디스크 그림 을 설정 합 니 다.

그리고 viewdLoad 에서 세 개의 바늘 을 초기 화하 고 타 이 머 를 설정 하여 현재 시간 을 가 져 옵 니 다.현재 시간 에 대응 하 는 시침 분침 초침 을 각각 대응 하 는 각 도 를 가 리 킵 니 다.

//
// ViewController.m
//     
//
// Created by Daniel on 16/4/7.
// Copyright © 2016  Daniel. All rights reserved.
//
 
#define kClockWH _clockView.bounds.size.width
 
//         
#define preSecondA 6
 
//         
#define preMinuteA 6
 
//         
#define preHourA 30
 
//         
#define preHourMinute 0.5
 
//         
#define preMinuteSecond 0.1
 
#define angle2raditon(a) ((a) / 180.0 * M_PI)
 
#import "ViewController.h"
 
@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIImageView *clockView;
 
/**    */
@property(nonatomic, strong) CALayer *secondL;
 
/**    */
@property(nonatomic, strong) CALayer *minuteL;
 
/**    */
@property(nonatomic, strong) CALayer *hourL;
 
@end
 
@implementation ViewController
 
- (void)viewDidLoad {
 [super viewDidLoad];
  
 //    
 [self setUpHourLayer];
  
 //    
 [self setUpMinuteLayer];
 
 //    
 [self setUpSecondLayer];
  
 //     
 [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];
  
 //          ，               
 [self timeChange];
  
}
 
- (void)timeChange {
  
 //        
 NSCalendar *calendar = [NSCalendar currentCalendar];
  
 NSDateComponents *cmp = [calendar components:NSCalendarUnitSecond | NSCalendarUnitMinute | NSCalendarUnitHour fromDate:[NSDate date]];
  
 //   
 NSInteger second = cmp.second;
  
 //   
 NSInteger minute = cmp.minute;
  
 //    
 NSInteger hour = cmp.hour;
  
 //        
 CGFloat secondA = second * preSecondA;
  
 //        
 CGFloat minuteA = minute * preMinuteA + second * preMinuteSecond;
  
 //        
 CGFloat hourA = hour * preHourA + minute * preHourMinute;
  
 //    
 _secondL.transform = CATransform3DMakeRotation(angle2raditon(secondA), 0, 0, 1);
  
 //    
 _minuteL.transform = CATransform3DMakeRotation(angle2raditon(minuteA), 0, 0, 1);
  
 //    
 _hourL.transform = CATransform3DMakeRotation(angle2raditon(hourA), 0, 0, 1);
  
}
 
#pragma mark -      
- (void)setUpHourLayer {
  
 CALayer *hourL = [CALayer layer];
  
 //       
 hourL.backgroundColor = [UIColor blackColor].CGColor;
  
 //      
 hourL.anchorPoint = CGPointMake(0.5, 1);
  
 //             
 hourL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);
  
 hourL.cornerRadius = 4;
  
 //    bounds
 hourL.bounds = CGRectMake(0, 0, 4, kClockWH * 0.5 - 40);
  
 //      clockView   
 [_clockView.layer addSublayer:hourL];
  
 _hourL = hourL;
  
}
 
 
#pragma mark -      
- (void)setUpMinuteLayer {
  
 CALayer *minuteL = [CALayer layer];
  
 //       
 minuteL.backgroundColor = [UIColor blackColor].CGColor;
  
 //      
 minuteL.anchorPoint = CGPointMake(0.5, 1);
  
 //             
 minuteL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);
  
 minuteL.cornerRadius = 4;
  
 //    bounds
 minuteL.bounds = CGRectMake(0, 0, 4, kClockWH * 0.5 - 20);
  
 //      clockView   
 [_clockView.layer addSublayer:minuteL];
  
 _minuteL = minuteL;
  
}
 
#pragma mark -      
- (void)setUpSecondLayer {
  
 CALayer *secondL = [CALayer layer];
  
 //       
 secondL.backgroundColor = [UIColor redColor].CGColor;
  
 //      
 secondL.anchorPoint = CGPointMake(0.5, 1);
  
 //             
 secondL.position = CGPointMake(kClockWH * 0.5, kClockWH * 0.5);
  
  
 //    bounds
 secondL.bounds = CGRectMake(0, 0, 1.5, kClockWH * 0.5 - 20);
  
 //      clockView   
 [_clockView.layer addSublayer:secondL];
  
 _secondL = secondL;
  
}
 
 
@end

효과 그림:

이상 은 본 고의 모든 내용 이 므 로 여러분 들 이 IOS 프로 그래 밍 을 배 우 는 데 도움 이 되 기 를 바 랍 니 다.