Recréer l'animation de Siri Button Glow

Existe-t-il un moyen de dupliquer l'animation du button siri? Il semble absolument magnifique, mais je n'ai aucune idée pour le moment comment commencer … y a-t-il des png préformatés en ligne qui sont tournés? ou est-ce fait avec CoreAnimation?

Je crois que l'animation de Siri est faite avec CAEmitterLayer et CAEmitterCell et ensuite animée avec l'animation de base, mais je peux me tromper totalement. Voici un code qui imite l'effet:

// create emitter layer self.emitterLayer = [CAEmitterLayer layer]; self.emitterLayer.frame = CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height); self.emitterLayer.emitterMode = kCAEmitterLayerOutline; self.emitterLayer.emitterShape = kCAEmitterLayerLine; self.emitterLayer.renderMode = kCAEmitterLayerAdditive; [self.emitterLayer setEmitterSize:CGSizeMake(4, 4)]; // create the ball emitter cell CAEmitterCell *ball = [CAEmitterCell emitterCell]; ball.color = [[UIColor colorWithRed:111.0/255.0 green:80.0/255.0 blue:241.0/255.0 alpha:0.10] CGColor]; ball.contents = (id)[[UIImage imageNamed:@"ball.png"] CGImage]; // ball.png is simply an image of white circle [ball setName:@"ball"]; self.emitterLayer.emitterCells = [NSArray arrayWithObject:ball]; [self.view.layer addSublayer:self.emitterLayer]; float factor = 1.5; // you should play around with this value [self.emitterLayer setValue:[NSNumber numberWithInt:(factor * 500)] forKeyPath:@"emitterCells.ball.birthRate"]; [self.emitterLayer setValue:[NSNumber numberWithFloat:factor * 0.25] forKeyPath:@"emitterCells.ball.lifetime"]; [self.emitterLayer setValue:[NSNumber numberWithFloat:(factor * 0.15)] forKeyPath:@"emitterCells.ball.lifetimeRange"]; // animation code CAKeyframeAnimation* circularAnimation = [CAKeyframeAnimation animationWithKeyPath:@"emitterPosition"]; CGMutablePathRef path = CGPathCreateMutable(); CGRect pathRect = CGRectMake(0, 0, 200, 200); // define circle bounds with rectangle CGPathAddEllipseInRect(path, NULL, pathRect); circularAnimation.path = path; CGPathRelease(path); circularAnimation.duration = 2; circularAnimation.repeatDuration = 0; circularAnimation.repeatCount = 3; circularAnimation.calculationMode = kCAAnimationPaced; [self.emitterLayer addAnimation:circularAnimation forKey:@"circularAnimation"]; 

Les classs CAEmitterCell et CAEmitterLayer ont de nombreuses propriétés, consultez donc les documents pour en savoir plus.

Je vous suggère de le faire avec des files PNG qui sont affichés un par un de telle sorte qu'une animation lisse résulte. C'est beaucoup plus facile que de programmer une animation codée. Le button a déjà été recréé par Arron Hunt: Siri Button Photoshop File

Btw. Une animation d'image-object est vraiment facile à mettre en œuvre:

 - (void)viewDidLoad { [super viewDidLoad]; NSArray * imageArray = [[NSArray alloc] initWithObjects: [UIImage imageNamed:@"1.png"], [UIImage imageNamed:@"2.png"], [UIImage imageNamed:@"3.png"], [UIImage imageNamed:@"4.png"], [UIImage imageNamed:@"5.png"], [UIImage imageNamed:@"6.png"], [UIImage imageNamed:@"7.png"], [UIImage imageNamed:@"8.png"], [UIImage imageNamed:@"9.png"], [UIImage imageNamed:@"10.png"], [UIImage imageNamed:@"11.png"], [UIImage imageNamed:@"12.png"], nil]; UIImageView * ryuJump = [[UIImageView alloc] initWithFrame: CGRectMake(100, 125, 150, 130)]; ryuJump.animationImages = imageArray; ryuJump.animationDuration = 1.1; ryuJump.contentMode = UIViewContentModeBottomLeft; [self.view addSubview:ryuJump]; [ryuJump startAnimating]; } 

Source: http://www.icodeblog.com/2009/07/24/iphone-programming-tutorial-animating-a-game-sprite/

UIImageView a une propriété appelée animationImages que vous pouvez utiliser pour spécifier une list d'images qu'il va lire en séquence, comme un GIF animé. C'est probablement le moyen le plus simple de le faire si vous voulez contrôler précisément l'effet.

Quelque chose de similaire pourrait également être fait avec CoreAnimation en utilisant une seule image et en animant sa propriété view.transform en utilisant CGAffineTransformMakeRotation (angle).