CAShapeLayer

普通CALayer在被初始化時是需要給一個frame值的,這個frame值一般都與給定view的bounds值一致,它本身是有形狀的,而且是矩形.

CAShapeLayer在初始化時也需要給一個frame值,但是,它本身沒有形狀,它的形狀來源于你給定的一個path,然后它去取CGPath值,它與CALayer有著很大的區別

CAShapeLayer有著幾點很重要:

  • 它依附于一個給定的path,必須給與path,而且,即使path不完整也會自動首尾相接
  • strokeStart以及strokeEnd代表著在這個path中所占用的百分比
  • CAShapeLayer動畫僅僅限于沿著邊緣的動畫效果,它實現不了填充效果

"CyleView.h"

@interface CyleView : UIView
{
    
    CAShapeLayer *layer;
    
}

- (void)strokeStart:(CGFloat)value;
- (void)strokeEnd:(CGFloat)value;

@end

"CyleView.m"

@implementation CyleView

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self)
    {
        layer = [CAShapeLayer layer];
        layer.frame = self.bounds;
        
        UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(self.frame.size.height / 2.0f,
                                                                               self.frame.size.height / 2.0f)
                                                            radius:self.frame.size.height / 2.f
                                                        startAngle:0
                                                          endAngle:M_PI * 2
                                                         clockwise:YES];
        
        layer.strokeColor   = [UIColor orangeColor].CGColor;   // 邊緣線的顏色
        layer.fillColor     = [UIColor clearColor].CGColor;   // 閉環填充的顏色
        layer.lineCap       = kCALineCapRound;               // 邊緣線的類型
        layer.path          = path.CGPath;                    // 從貝塞爾曲線獲取到形狀
        layer.lineWidth     = 5.0f;                           // 線條寬度
        layer.strokeStart   = 0.0f;
        layer.strokeEnd     = 0.0f;
        /*
         如果默認是一個圓圈
        layer.strokeStart = 0.0;
        layer.strokeEnd = 1.0;
         
         */
        [self.layer addSublayer:layer];
    }
    return self;
}

- (void)strokeStart:(CGFloat)value
{
    layer.speed = 1;
    layer.strokeStart = value;
}

- (void)strokeEnd:(CGFloat)value
{
    layer.speed = 1;
    layer.strokeEnd = value;
}


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

推薦閱讀更多精彩內容