65.jpg
項目中需要錄音功能，點擊錄音的時候會有一個環形漸變的圖形圍繞麥克風轉圈的動畫。
Paste_Image.png
實現起來并不困難，我的思路如下:
1、自定義一個RecordView層。該層包含了 麥克風圖標 和 環形轉圈的動畫Layer層。
2、添加一個單擊、長按手勢。
3、使用 CABasicAnimation 動畫來實現 環形圖形的轉圈效果。
4、將動畫開始和結束時的事件通過 Delegate 傳遞到上層。
部分代碼如下:
動畫開始
- (void) startAnimation{
self.isAnimation = YES;
CABasicAnimation* rotationAnimation =
[CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];//"z"還可以是“x”“y”，表示沿z軸旋轉
rotationAnimation.toValue = [NSNumber numberWithFloat:(2 * M_PI)];
rotationAnimation.duration = 1.0f;
rotationAnimation.repeatCount = NSIntegerMax;
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
[self.anmationLayer addAnimation:rotationAnimation forKey:@"rotation"] ;
if (self.delegate && [self.delegate respondsToSelector:@selector(startRecord:)]) {
[self.delegate startRecord:self];
}
}
動畫結束
- (void) endAanimation{
self.isAnimation = NO;
[self.anmationLayer removeAnimationForKey:@"rotation"];
if (self.delegate && [self.delegate respondsToSelector:@selector(endRecord:)]) {
[self.delegate endRecord:self];
}
}
總結： 這個效果并不難實現 主要是對 動畫層的熟悉和應用 。
關于動畫下面這個教程詳細的介紹了ios上各種動畫的正確的打開方式
https://zsisme.gitbooks.io/ios-/content/
另附Demo的下載地址 ：https://github.com/githubliuming/QYRecordView
