美文网首页
iOS实现一个电子时钟

iOS实现一个电子时钟

作者: Shawn_Wang | 来源:发表于2017-07-23 22:24 被阅读165次

    最近在学习iOS-Core Animation相关东西。学以致用,这里用寄宿图和拉伸过滤来实现一个电子时钟。
    最终效果如下:


    1.gif

    实现思路很简单,就是利用图层寄宿图的contentsRect特性来实现。

    这里简单介绍一下图层寄宿图。

    寄宿图

    图层CALayer和View一样,可以给它设置一个image用来展示,给CALayer设置image就是寄宿图。

    UIImage *digitImage = [UIImage imageNamed:@"Digits"];
    view.layer.contents = (__bridge id)digitImage.CGImage;
            view.layer.contentsRect = CGRectMake(0, 0, 0.1, 1);
            view.layer.contentsGravity = kCAGravityResizeAspect;
    //        set nearest-neighbour
            view.layer.magnificationFilter = kCAFilterNearest;
    

    这里涉及到4点:
    1.设置寄宿图,用CALayer的contents属性来设置。
    2.设置拉伸contentsGravity,和view的contentMode一样,这里不过是设置寄宿图的拉伸效果而已。
    3.设置拉伸过滤kCAFilterNearest。说白了就是放大缩小的效果。
    4.CALayer的contentsRect。图层的这个属性用于展示寄宿图的展示区域。默认为(0,0,1,1)表示整个区域。这么说吧这里面都是按照比例来计算的。如果你要展示图层左上角四分之一的区域那么设置contentsRect为(0, 0, 0.5, 0.5)。如果展示右下角四分之一区域,那么为(0.5, 0.5, 0.5, 0.5)。使用contentRects的好处是一次加载图片,然后分别展示图片的不同区域。
    本例子中只有一张图片

    digit

    通过一次加载该图片,然后设置contentsRect来更改不同的位置即可。

    最后附上关键代码:

    - (void)viewDidLoad {
        [super viewDidLoad];
        UIImage *digitImage = [UIImage imageNamed:@"Digits"];
        
        for (UIView *view in self.digitViews) {
            view.layer.contents = (__bridge id)digitImage.CGImage;
            view.layer.contentsRect = CGRectMake(0, 0, 0.1, 1);
            view.layer.contentsGravity = kCAGravityResizeAspect;
    //        set nearest-neighbour
            view.layer.magnificationFilter = kCAFilterNearest;
        }
        self.timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:@selector(digitClockRunning) userInfo:nil repeats:YES];
        [self digitClockRunning];
    }
    
    - (void)setDigit:(NSUInteger)digitNumber forView:(UIView *)view {
        view.layer.contentsRect = CGRectMake(digitNumber * 0.1, 0, 0.1, 1);
    }
    
    - (void)digitClockRunning {
        
        NSCalendar *calendar = [[NSCalendar alloc] initWithCalendarIdentifier:NSCalendarIdentifierGregorian];
        NSCalendarUnit unit = NSCalendarUnitHour | NSCalendarUnitMinute | NSCalendarUnitSecond;
        NSDateComponents *components = [calendar components:unit fromDate:[NSDate date]];
        [self setDigit:(components.hour / 10) forView: self.digitViews[0]];
        [self setDigit:components.hour % 10 forView:self.digitViews[1]];
        [self setDigit:components.minute / 10 forView:self.digitViews[2]];
        [self setDigit:components.minute % 10 forView:self.digitViews[3]];
        [self setDigit:components.second / 10 forView:self.digitViews[4]];
        [self setDigit:components.second % 10 forView:self.digitViews[5]];
    }
    
    

    PS:另外注意,如果代码里面使用NSTimer,会出现无法释放的情况,解决办法是使用一个第三方的库HWWeakTimer来解决。
    ** 如果喜欢,点个赞吧 **

    相关文章

      网友评论

          本文标题:iOS实现一个电子时钟

          本文链接:https://www.haomeiwen.com/subject/jbqvkxtx.html