iOS開發CoreAnimation解讀之三——幾種經常使用Layer的使用解析

iOS開發CoreAnimation解讀之三——幾種經常使用Layer的使用解析

1、CAEmitterLayer

        CAEmitterLayer是CoreAnimation框架中的粒子發射層,在之前的一片博客中有詳細的介紹和範例,這裏再也不重複,地址以下:數組

粒子效果的應用和火焰範例:http://my.oschina.net/u/2340880/blog/485095app

2、CAGradientLayer

        CAGradientLayer是用於色彩梯度展現的layer圖層,經過CAGradientLayer,咱們能夠很輕鬆的建立出有過渡效果的色彩圖。其中屬性以下:框架

/*
顏色數組,設置咱們須要過的的顏色,必須是CGColor對象
*/
@property(nullable, copy) NSArray *colors;
/*
顏色開始進行過渡的位置
這個數組中的元素是NSNumber類型,單調遞增的,而且在0——1之間
例如,若是咱們設置兩個顏色進行過渡,這個數組中寫入0.5,則第一個顏色會在達到layer一半的時候開始向第二個顏色過渡
*/
@property(nullable, copy) NSArray<NSNumber *> *locations;
/*
下面兩個參數用於設置渲染顏色的起點和終點 取值範圍均爲0——1
默認起點爲(0.5 ,0) 終點爲(0.5 ,1),顏色的過渡範圍就是沿y軸從上向下
*/
@property CGPoint startPoint;
@property CGPoint endPoint;
/*
渲染風格 iOS中只支持一種默認的kCAGradientLayerAxial,咱們無需手動設置
*/
@property(copy) NSString *type;

用以下代碼建立一個度過視圖的效果:字體

    CAGradientLayer * layer = [CAGradientLayer layer];
    layer.colors = @[(id)[UIColor redColor].CGColor,(id)[UIColor blueColor].CGColor,(id)[UIColor greenColor].CGColor];
    layer.locations = @[@0.1,@0.7,@1];
    layer.bounds = CGRectMake(0, 0, 100, 100);
    layer.position = CGPointMake(100, 100);
    layer.startPoint = CGPointMake(0, 0);
    layer.endPoint = CGPointMake(1, 1);
    [self.view.layer addSublayer:layer];

效果以下:動畫

3、CAReplicatorLayer

        CAReplocatorLayer是拷貝視圖容器,咱們能夠經過它,將其中的子layer進行拷貝,並進行一些差別處理,其中經常使用屬性方法以下:spa

//拷貝的次數
@property NSInteger instanceCount;
//是否開啓景深效果
@property BOOL preservesDepth;
//當CAReplicatorLayer的子Layer層進行動畫的時候,拷貝的副本執行動畫的延時
@property CFTimeInterval instanceDelay;
//拷貝副本的3D變換
@property CATransform3D instanceTransform;
//拷貝副本的顏色變換
@property(nullable) CGColorRef instanceColor;
//每一個拷貝副本的顏色偏移參數
@property float instanceRedOffset;
@property float instanceGreenOffset;
@property float instanceBlueOffset;
//每一個拷貝副本的透明度偏移參數
@property float instanceAlphaOffset;

例如,經過拷貝一個色塊,使其產平生移排列:.net

    CAReplicatorLayer *reLayer = [CAReplicatorLayer layer];
    reLayer.position = CGPointMake(0, 0);
    CALayer * layer= [CALayer layer];
    [reLayer addSublayer:layer];
    [self.view.layer addSublayer:reLayer];
    layer.bounds = CGRectMake(0, 0, 20, 20);
    layer.position = CGPointMake(30, 100);
    layer.backgroundColor = [UIColor redColor].CGColor;
    //每一個副本向右平移25px
    reLayer.instanceTransform=CATransform3DMakeTranslation(25, 0, 0);
    //若是進行動畫,副本延時一秒執行
    reLayer.instanceDelay = 1;
    //拷貝十個副本
    reLayer.instanceCount = 10;

效果以下:code

4、CAShapeLayer

        CAShapeLayer是圖形layer層,咱們能夠自定義這個層的形狀。先來看其中咱們能夠使用的屬性和方法:orm

@property(nullable) CGPathRef path;

path屬性爲CAShapeLayer設置一個邊界路徑,例如咱們能夠建立一個三角形的路徑經過以下代碼:對象

    CAShapeLayer * layer = [CAShapeLayer layer];
    layer.position=CGPointMake(0,0);
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, 0, 100, 100);
    CGPathAddLineToPoint(path, 0, 300, 100);
    CGPathAddLineToPoint(path, 0, 200, 200);
    CGPathAddLineToPoint(path, 0, 100, 100);
    layer.path=path;

僅僅有路徑,不能將咱們想要的形狀畫出來,下面一些屬性能夠對圖形的一些基礎屬性進行設置:

//設置圖形的填充顏色
@property(nullable) CGColorRef fillColor;
/*
設置圖形的填充規則 選項以下:
非零填充
 NSString *const kCAFillRuleNonZero;
 奇偶填充
 NSString *const kCAFillRuleEvenOdd;
*/
@property(copy) NSString *fillRule;
//設置線條顏色
@property(nullable) CGColorRef strokeColor;
//設置線條的起點與終點 0-1之間
@property CGFloat strokeStart;
@property CGFloat strokeEnd;
//設置線條寬度
@property CGFloat lineWidth;
//設置兩條線段相交時銳角斜面長度
@property CGFloat miterLimit;
/*
設置線條首尾的外觀
可選參數以下
無形狀
 NSString *const kCALineCapButt;
 圓形
 NSString *const kCALineCapRound;
 方形
 NSString *const kCALineCapSquare;
*/
@property(copy) NSString *lineCap;
/*
設置線段的連接方式
棱角
 NSString *const kCALineJoinMiter;
 平滑
 NSString *const kCALineJoinRound;
 折線
 NSString *const kCALineJoinBevel;
*/
@property(copy) NSString *lineJoin;

修改一下上面的代碼,以下:

CAShapeLayer * layer = [CAShapeLayer layer];
    layer.position=CGPointMake(0,0);
    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, 0, 100, 100);
    CGPathAddLineToPoint(path, 0, 300, 100);
    CGPathAddLineToPoint(path, 0, 200, 200);
    CGPathAddLineToPoint(path, 0, 100, 100);
    layer.path=path;
    layer.fillColor= [UIColor redColor].CGColor;
    layer.fillRule = kCAFillRuleEvenOdd;
    layer.strokeColor = [UIColor blueColor].CGColor;
    layer.strokeStart =0;
    layer.strokeEnd =0.5;
    layer.lineWidth = 5;
    layer.miterLimit = 1;
    layer.lineJoin = kCALineJoinMiter;
    [self.view.layer addSublayer:layer];

效果以下:

除此以外,咱們還能夠設置邊界的線條爲虛線,經過下面兩個屬性:

    //設置線段的寬度爲5px 間距爲10px
    /*
    這個數組中還能夠繼續添加,會循環進行設置 例如 5 2 1 3 則第一條線段5px,間距2px,第二條線段1px 間距3px再開始第一條線段
    */
    layer.lineDashPattern = @[@05,@10];
    //設置從哪一個位置開始
    layer.lineDashPhase =5;

以下:

5、CATextLayer

        CATextLayer能夠進行文本的繪製,屬性方法以下:

//渲染的文字字符串
@property(nullable, copy) id string;
//設置字體
@property(nullable) CFTypeRef font;
//設置字號
@property CGFloat fontSize;
//設置文字顏色
@property(nullable) CGColorRef foregroundColor;
//是否換行
@property(getter=isWrapped) BOOL wrapped;
/*
設置截斷模式
 NSString * const kCATruncationNone;
 截斷前部分
 NSString * const kCATruncationStart;
 截斷後部分
 NSString * const kCATruncationEnd;
 截斷中間
 NSString * const kCATruncationMiddle;
*/
@property(copy) NSString *truncationMode;
/*
設置文字對齊模式
 NSString * const kCAAlignmentNatural;
 NSString * const kCAAlignmentLeft;
 NSString * const kCAAlignmentRight;
 NSString * const kCAAlignmentCenter;
 NSString * const kCAAlignmentJustified;
*/
@property(copy) NSString *alignmentMode;

專一技術,熱愛生活,交流技術,也作朋友。

——琿少 QQ羣:203317592

相關文章
相關標籤/搜索