實現類似微信語音播放動畫的效果

要求就是點擊播放按鈕，小喇叭開始動，當語音結束后，停止動畫。如圖：

這需要用到UIImageView的幀動畫，該動畫可以讓一系列圖片在特定的時間內按順序顯示出來。需要的素材如下：

audio_icon_1

*****分割線*****

audio_icon_2

*******分割線*******
audio_icon_3

代碼如下：

// 添加播放時候的動畫圖片
[_audioBtn addSubview:self.animationview];
[_audioBtn setImage:[UIImage imageNamed:@"audio_icon_3"] forState:UIControlStateNormal];
_audioBtn.userInteractionEnabled = YES;

//動畫的imageview
- (UIImageView *)animationview{
    if (!_animationview) {
        _animationview = [[UIImageView alloc] initWithFrame:CGRectMake(11.25, 5, 15, 15)];
        NSArray *myImages = [NSArray arrayWithObjects: [UIImage imageNamed:@"audio_icon_3"],[UIImage imageNamed:@"audio_icon_1"],[UIImage imageNamed:@"audio_icon_2"],[UIImage imageNamed:@"audio_icon_3"],nil];
        
        _animationview.animationImages = myImages;
        _animationview.animationDuration = 1; 
        _animationview.animationRepeatCount = 0; //動畫重復次數，0表示無限循環 
    }
    return _animationview;
}

點擊按鈕的事件

//點擊播放按鈕時，動畫開始
[self.animationview startAnimating];
[self.audioBtn setImage:nil forState:UIControlStateNormal];
//在語音結束后，停止動畫
[self.animationview stopAnimating];
[self.audioBtn setImage:[UIImage imageNamed:@"audio_icon_3"] forState:UIControlStateNormal];