Создайте анимацию хронометра для iOS с помощью CABasicAnimation и CAShapeLayer.

Я сделал анимацию для хронометра в викторине. Я хочу показать в анимации фон в UIImageView * cronometro, но моя анимация показывает весь UIImageView.

Я хочу сделать это в анимации:

Хроно OK

но у меня есть это:

Хроно неправильно

Это мой код:

//Chrono animation

-(void) startCronometro{

    //Set timer
    contoAllaRovescia = TIME;

    [cronometro setImage:[UIImage imageNamed:@"cronoStart.png"]];

    maskLayer = [CAShapeLayer layer];

    CGFloat maskHeight = cronometro.frame.size.height;
    CGFloat maskWidth = cronometro.frame.size.width;

    CGPoint centerPoint;
    centerPoint = CGPointMake(cronometro.frame.size.width/2, (cronometro.frame.size.height/2) + 3);//+3 because the image is not centered in UIImageView

    //Make the radius of our arc large enough to reach into the corners of the image view.
    CGFloat radius = sqrtf(maskWidth * maskWidth + maskHeight * maskHeight)/2;

    //Don't fill the path, but stroke it in black.
    maskLayer.fillColor = [[UIColor clearColor] CGColor];
    maskLayer.strokeColor = [[UIColor blackColor] CGColor];

    maskLayer.lineWidth = 30;

    CGMutablePathRef arcPath = CGPathCreateMutable();

    //Move to the starting point of the arc so there is no initial line connecting to the arc
    CGPathMoveToPoint(arcPath, nil, centerPoint.x, centerPoint.y-radius/2);

    //Create an arc at 1/2 our circle radius, with a line thickess of the full circle radius
    CGPathAddArc(arcPath, nil, centerPoint.x, centerPoint.y, radius/2, 3*M_PI/2, -M_PI/2, NO);

    maskLayer.path = arcPath;//[aPath CGPath];//arcPath;

    //Start with an empty mask path (draw 0% of the arc)
    maskLayer.strokeEnd = 0.1;

    CFRelease(arcPath);

    //Install the mask layer into out image view's layer.
    cronometro.layer.mask = maskLayer;

    //Set our mask layer's frame to the parent layer's bounds.
    cronometro.layer.mask.frame = cronometro.layer.bounds;

    //Create an animation that increases the stroke length to 1, then reverses it back to zero.
    CABasicAnimation *swipe = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    swipe.duration = TIME;
    swipe.delegate = self;
    // [swipe setValue:@"string" forKey:@"key"];
    swipe.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    swipe.fillMode = kCAFillModeForwards;
    swipe.removedOnCompletion = NO;
    swipe.toValue = [NSNumber numberWithFloat: 1.0];

    [maskLayer addAnimation: swipe forKey: @"strokeEnd"];

    //Aggiorno l'etichetta del conto alla rovescia ogni 0.1 millisecondi
    timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(whileCronometro) userInfo:nil repeats:YES];

}

Спасибо.


person Byteros    schedule 16.09.2013    source источник
comment
Почему бы вам просто не сделать отдельный слой для фона? Что делает NSTimer и используете ли вы его?   -  person David Rönnqvist    schedule 16.09.2013
comment
Я использую NSTimer для обновления UILabel. Я могу отделить слой, но я думаю, что уменьшение размера maskLayer является лучшим решением, потому что я хочу избежать выделения второго UIImageView.   -  person Byteros    schedule 16.09.2013
comment
Но зачем вообще маскировать фон? Разве не лучше с чистым фоном и анимацией только синей заливки (без маски)   -  person David Rönnqvist    schedule 16.09.2013
comment
Дэвид, это решение, но не лучшее.   -  person Byteros    schedule 16.09.2013


Ответы (1)


Я думаю, вам нужно использовать анимацию KeyFrame. Вам нужно передать свой путь к анимации Key Frame. Таким образом, она будет вращаться по этому пути. Ссылка : Анимация ключевых кадров

person h999    schedule 23.09.2013