iOS毫秒倒计时的实现

最新推荐文章于 2021-06-23 10:06:05 发布

WScarlett

最新推荐文章于 2021-06-23 10:06:05 发布

阅读量3.3k

点赞数

文章标签： ios 倒计时计时器

本文链接：https://blog.csdn.net/fhsahfihf/article/details/54344253

版权

app开发中，当展示限时优惠的某些商品时，往往会加一个倒计时，提示用户该商品限时优惠所剩的时间，。那对于开发者来说，这就需要我们去实现的是一个倒计时的功能，这个倒计时根据具体需求，可以以天、小时、分、秒、毫秒作单位。

今天呢，主要说说毫秒计时器。我们知道秒和毫秒之间的进制是1000，也就是说1秒=1000毫秒，那我们做毫秒倒计时器的时候是设置一个时间间隔为1毫秒的计时器，逐一减少毫秒数。但是这样的话太耗时了，所以很多的毫秒计时器中的毫秒数只是0-9之间的数字，这就意味着，这个毫秒计时器的时间间隔是100毫秒，这样相比起1毫秒为间隔的计时器，其消耗就少了很多，同时也达到毫秒计时的效果。

那对于整个毫秒倒计时的实现思路就是：得到未来某个日期的时间戳和当前日期的时间戳，计算这两者之间的时间差，然后设置一个时间间隔为100毫秒的计时器，每隔100毫秒，更新一下倒计时器上相应的数值。

自定义一个UIview，将倒计时封装起来。
一、在MsecCountDownView.h中增加时间戳和计时器这两属性


@interface MsecCountDownView : UIView

@property(nonatomic, assign)double timeInterval;//未来某个日期的时间戳
@property(nonatomic, strong)NSTimer *timer ; //定时器

@end

二、在MsecCountDownView.m实现相关UI及倒计时方法

@interface MsecCountDownView (){
UIView *countdownBackView;
CGFloat _passTime;
}
@property(nonatomic, strong)UILabel *tipLabel;
@property(nonatomic, strong)UILabel *hoursLabel;
@property(nonatomic, strong)UILabel *minutesLabel;
@property(nonatomic, strong)UILabel *secondsLabel;
@property(nonatomic, strong)UILabel *millionSecondsLabel;
@property(nonatomic, strong)UILabel *label1;
@property(nonatomic, strong)UILabel *label2;
@property(nonatomic, strong)UILabel *label3;
@property(nonatomic, strong)UILabel *label4;
@end

创建相关UI

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];

    if (self) {

        countdownBackView=[[UIView alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
        [self addSubview:countdownBackView];
        _tipLabel=[[UILabel alloc] init];
        _tipLabel.frame = CGRectMake(0, 0, 40, countdownBackView.frame.size.height);
        [countdownBackView addSubview:_tipLabel];

        _tipLabel.font = [UIFont systemFontOfSize:12];


        //小时
        _hoursLabel=[[UILabel alloc] initWithFrame:CGRectMake(_tipLabel.frame.origin.x+_tipLabel.frame.size.width, 0, 35, countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_hoursLabel];
        _hoursLabel.font = [UIFont systemFontOfSize:11];

        _label1=[[UILabel alloc] initWithFrame:CGRectMake(_hoursLabel.frame.origin.x+_hoursLabel.frame.size.width, _hoursLabel.frame.origin.y, 8, countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_label1];

        //分钟
        _minutesLabel=[[UILabel alloc] initWithFrame:CGRectMake(_label1.frame.origin.x+_label1.frame.size.width,  _hoursLabel.frame.origin.y, 20, countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_minutesLabel];
        _minutesLabel.font = [UIFont systemFontOfSize:11];

        _label2=[[UILabel alloc] initWithFrame:CGRectMake(_minutesLabel.frame.origin.x+_minutesLabel.frame.size.width,  _hoursLabel.frame.origin.y, 8, countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_label2];

      //秒
        _secondsLabel=[[UILabel alloc] initWithFrame:CGRectMake(_label2.frame.origin.x+_label2.frame.size.width,  _hoursLabel.frame.origin.y, 20 , countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_secondsLabel];


        _secondsLabel.font = [UIFont systemFontOfSize:11];

        _label3=[[UILabel alloc] initWithFrame:CGRectMake(_secondsLabel.frame.origin.x+_secondsLabel.frame.size.width,  _hoursLabel.frame.origin.y, 8 , countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_label3];


        _millionSecondsLabel=[[UILabel alloc] initWithFrame:CGRectMake(_label3.frame.origin.x+_label3.frame.size.width,  _hoursLabel.frame.origin.y, 20, countdownBackView.frame.size.height)];
        [countdownBackView addSubview:_millionSecondsLabel];


           //毫秒

        _millionSecondsLabel.font = [UIFont systemFontOfSize:11];

        _label1.textAlignment=1;
        _label2.textAlignment=1;
        _label3.textAlignment = 1;
        _hoursLabel.textAlignment=1;
        _minutesLabel.textAlignment=1;
        _secondsLabel.textAlignment=1;
        _millionSecondsLabel.textAlignment=1;


        _passTime=0.0;
    }


    return self;
}

生成一个计时器

//得到未来某个日期的时间戳，与当前时间戳相比，得到两者的时间差，生成定时器
- (void)setTimeInterval:(double)timeInterval
{

    _timeInterval = timeInterval ;

    NSDateFormatter *dataFormatter = [[NSDateFormatter alloc] init];
    dataFormatter.dateFormat = @"MM/dd/yyyy HH:mm:ss.SSS";

    //获取当前系统的时间，并用相应的格式转换
    [dataFormatter stringFromDate:[NSDate date]];
    NSString *currentDayStr = [dataFormatter stringFromDate:[NSDate date]];
    NSDate *currentDate = [dataFormatter dateFromString:currentDayStr];

    //优惠结束的时间，也用相同的格式去转换
    NSDate *date = [NSDate dateWithTimeIntervalSince1970:timeInterval/1000.0];
    NSString *deadlineStr = [dataFormatter stringFromDate:date];
    NSDate *deadlineDate = [dataFormatter dateFromString:deadlineStr];

    _timeInterval=[deadlineDate timeIntervalSinceDate:currentDate]*1000;

    if (_timeInterval!=0)
    {

        //时间间隔是100毫秒，也就是0.1秒
        _timer = [NSTimer scheduledTimerWithTimeInterval:0.1f target:self selector:@selector(timerAction) userInfo:nil repeats:YES];

        [[NSRunLoop currentRunLoop] addTimer:_timer forMode:UITrackingRunLoopMode];
    }else{
        [countdownBackView removeFromSuperview];

    }

}

实现每隔100毫秒执行的方法，更新倒计时器上面相应的数值


// 每间隔100毫秒定时器触发执行该方法
- (void)timerAction
{

    [self getTimeFromTimeInterval:_timeInterval] ;


    // 当时间间隔为0时干掉定时器
    if (_timeInterval-_passTime == 0)
    {
        [_timer invalidate] ;
        _timer = nil ;
    }
}

// 通过时间间隔计算具体时间(小时,分,秒,毫秒)
- (void)getTimeFromTimeInterval : (double)timeInterval
{

    //1s=1000毫秒
    _passTime += 100.f;//毫秒数从0-9，所以每次过去100毫秒
    _tipLabel.text=@"还剩：";

    _label3.text=@".";
    _label2.text=@":";
    _label1.text=@":";

    //小时数
    NSString *hours = [NSString stringWithFormat:@"%ld", (NSInteger)((timeInterval-_passTime)/1000/60/60)];
    //分钟数
    NSString *minute = [NSString stringWithFormat:@"%ld", (NSInteger)((timeInterval-_passTime)/1000/60)%60];
    //秒数
    NSString *second = [NSString stringWithFormat:@"%ld", ((NSInteger)(timeInterval-_passTime))/1000%60];
    //毫秒数
    CGFloat sss = ((NSInteger)((timeInterval - _passTime)))%1000/100;


    NSString *ss = [NSString stringWithFormat:@"%.lf", sss];

    if (minute.integerValue < 10) {
        minute = [NSString stringWithFormat:@"0%@", minute];
    }


    self.hoursLabel.text = [NSString stringWithFormat:@"%@",hours];
    self.minutesLabel.text = [NSString stringWithFormat:@"%@",minute];
    self.secondsLabel.text = [NSString stringWithFormat:@"%@",second];
    self.millionSecondsLabel.text = [NSString stringWithFormat:@"%@",ss];

    if (timeInterval - _passTime <= 0) {
        [countdownBackView removeFromSuperview];
        [self removeFromSuperview];
    }

}

三、在ViewController.m给倒计时器赋值，实现自己想要的倒计时



- (void)viewDidLoad {
    [super viewDidLoad];

    msecView=[[MsecCountDownView alloc] initWithFrame:CGRectMake(50, 100, self.view.frame.size.width-100, 16)];
    [self.view addSubview:msecView];

    NSDateFormatter *formatter = [[NSDateFormatter alloc] init];

    [formatter setDateStyle:NSDateFormatterMediumStyle];

    [formatter setTimeStyle:NSDateFormatterShortStyle];

    [formatter setDateFormat:@"yyyy-MM-dd HH:mm:ss.SSS"];


    NSDate* date = [formatter dateFromString:@"2017-04-11 15:10:00.000"];
    //将日期转换成时间戳
    NSInteger timeSp = [[NSNumber numberWithDouble:[date timeIntervalSince1970]] integerValue]*1000;

    msecView.timeInterval=timeSp;

}

这样就实现倒计时的功能了。但是使用倒计时还需要注意一点，当离开该页面的时候，记得把定时器暂停，等回到该页面的时候再启动倒计时。这个可以通过以下两方法实现。


-(void)viewWillAppear:(BOOL)animated{


//    页面出现时，计时器开始
    [msecView.timer setFireDate:[NSDate distantPast]];

}
-(void)viewWillDisappear:(BOOL)animated{
//    页面消失时，暂停提示器
    [msecView.timer setFireDate:[NSDate distantFuture]];
}