iOS 關于千聊錄音動畫的簡單實現(xiàn)

首先看下效果展示:


動畫.gif

  Core Animation(核心動畫)是一組功能強大、效果華麗的動畫API,無論在iOS系統(tǒng)或者在你開發(fā)的App中,都有大量應用。

樓主簡單的利用UIBezierPath繪畫圓,然后利用CABasicAnimationopacity調整視圖的透明度,然后利用CABasicAnimationtransform.scale來實現(xiàn)圓的放大縮小,如果想要了解更多傳送門:
http://www.imlifengfeng.com/blog/?p=548

廢話不多所上代碼
基本都是通過懶加載實現(xiàn)
創(chuàng)建CAShapeLayer

- (CAShapeLayer *)shapeLayer{
    if (_shapeLayer==nil) {
        _shapeLayer = [CAShapeLayer layer];
        _shapeLayer.frame = CGRectMake(100, 100, 100, 100);
        _shapeLayer.fillColor = [UIColor blueColor].CGColor;
        _shapeLayer.strokeColor = [UIColor blackColor].CGColor;
        //通過貝塞爾曲線繪制圓
        CGFloat startAngle = 0.0;
        CGFloat endAngle = M_PI *2;

        UIBezierPath *bezierPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(50, 50) radius:50 startAngle:startAngle endAngle:endAngle clockwise:YES];
        _shapeLayer.path = bezierPath.CGPath;

    }
    return _shapeLayer;
}

添加動畫組這里用到CAAnimationGroup

- (CAAnimationGroup *)animaGroup{
    if (_animaGroup == nil) {
        CABasicAnimation * _opacityAnima = [CABasicAnimation animationWithKeyPath:@"opacity"];
        _opacityAnima.fromValue = @(0.7);
        _opacityAnima.toValue = @(0.3);
        
        CABasicAnimation *expandAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
        expandAnimation.fromValue = [NSNumber numberWithFloat:1]; // 開始時的倍率
        expandAnimation.toValue = [NSNumber numberWithFloat:1.5]; // 結束時的倍率
        
        
        _animaGroup = [CAAnimationGroup animation];
        _animaGroup.animations = @[ expandAnimation,_opacityAnima];
        _animaGroup.duration = 3;
        _animaGroup.repeatCount = HUGE;
        _animaGroup.autoreverses = YES;
    }
    return _animaGroup;
   
}

具體里面的屬性可以點擊上文鏈接了解不多解釋,只實現(xiàn)
動畫開始、停止方法

/Start Animation
- (void)startAnimation{
    [self.layer addSublayer:self.shapeLayer];
    [self.shapeLayer addAnimation:self.animaGroup forKey:@"scaleGroup"];
}
//Stop Animation
- (void)stopAnimation{
    if (_shapeLayer) {
        [self.shapeLayer removeAllAnimations];
        [self.shapeLayer removeFromSuperlayer];

    }
}

代碼地址:https://github.com/lanjiaoli/Animation
有不足的地方大家多多指出,謝謝

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容