1. CALayer.transform和UIView.transform
* CALayer.transform屬性是是個CATransform3D類型的數(shù)據(jù),默認值為CATransform3DIdentity
* CGAffineTransform 是用于2D層面的, 操作的是UIView或者其他 2D Core Graphics 元素惑申。
* CATransform3D 是 Core Animation的結(jié)構(gòu)體,是用來做更復(fù)雜的關(guān)于 CALayer 的3D操作具伍。
* CATransform3D定義了一個三維變換（4x4的矩陣），用于圖層的偏移圈驼、旋轉(zhuǎn)人芽，縮放，歪斜和透視等效果绩脆。
* 需要了解相關(guān)的3D變換方法：CATransform3DMakeTranslation萤厅，CATransform3DMakeScale，CATransform3DMakeRotation衙伶，以及CATransform3DTranslate祈坠，CATransform3DScale，CATransform3DRotate矢劲。
* CATransform3D.m34表示透視效果赦拘，但需要和CATransform3DRotate配合使用才有效果。也就是前提是z方向上有變化（即沿x軸或者y軸旋轉(zhuǎn)之后）。
Q：如何做出圓角
CALayer
1.圖層
2.顯示和做動畫
3.UIView背后的TA
CALayer 和 UIview的區(qū)別
1.UIView ：負責接收用戶點擊的觸摸屏view扮演的角色
2.CALayer ：負責展示界面
3.UIView是對CALayer的一個封裝
Layer使用
一捎谨、不規(guī)則形狀的圖片
?? UIImageView *imageView = [[UIImageView alloc] init];
? ? imageView.image = [UIImage imageNamed:@"chatImage.jpg"];
? ? imageView.contentMode = UIViewContentModeScaleAspectFill;
? ? imageView.frame=CGRectMake(50, 50, 200, 250);
? ? [self.viewaddSubview:imageView];
? ? UIImageView *imageViewMask = [[UIImageView alloc] init];
//? ? imageViewMask.image = [[UIImage imageNamed:@"imageMask.png"] stretchableImageWithLeftCapWidth:54 topCapHeight:48];
#warning aware!!
? ? //這里需要勘誤一下民效。錄制時當時沒用3x切圖，所以圓角處有點模糊
? ? imageViewMask.image = [[UIImage imageNamed:@"imageMask.png"] stretchableImageWithLeftCapWidth:18 topCapHeight:16];
? ? imageViewMask.frame= imageView.bounds;//將這個不規(guī)則的范圍設(shè)置成imageview的范圍涛救。
? ? imageView.layer.mask= imageViewMask.layer;將這個layer到layer.mask
二畏邢、漸變
CAGradientLayer *layer = [CAGradientLayer layer];
? ? layer.frame=CGRectMake(100, 100, 150, 150);
? ? [layersetColors:@[
? ? ? ? ? ? ? ? ? ? ? (id)[UIColoryellowColor].CGColor,
? ? ? ? ? ? ? ? ? ? ? (id)[UIColorgreenColor].CGColor,
? ? ? ? ? ? ? ? ? ? ? (id)[UIColorblueColor].CGColor,
? ? ? ? ? ? ? ? ? ? ? (id)[UIColorgreenColor].CGColor
? ? ? ? ? ? ? ? ? ? ? ]]; //設(shè)置從左到右的顏色
? ? [layersetLocations:@[@0.25, @0.5, @0.75,@0.95]];//默認分割線,從左到右設(shè)置需要逐級遞增，取值范圍0-1
? ? [layersetStartPoint:CGPointMake(0, 0)];//起點
? ? [layersetEndPoint:CGPointMake(1, 1)];//終點
? ? [self.view.layer addSublayer:layer];
CAGradientLayer? 常用mask layer
?UIImageView *imageView = [[UIImageView alloc] init];
? ? imageView.image = [UIImage imageNamed:@"nature.jpg"];
? ? imageView.contentMode = UIViewContentModeScaleAspectFill;
? ? imageView.frame=CGRectMake(100, 100, 150, 100);
? ? [self.viewaddSubview:imageView];
? ? UIImageView *mirrorImageView = [[UIImageView alloc] init];
? ? mirrorImageView.image= imageView.image;
? ? mirrorImageView.contentMode = UIViewContentModeScaleAspectFill;//內(nèi)容類型
? ? mirrorImageView.transform = CGAffineTransformMakeScale(1, -1);//圖片向下翻轉(zhuǎn)達到一個鏡像的目的检吆。
? ? mirrorImageView.bounds= imageView.bounds;
? ? mirrorImageView.center=CGPointMake(imageView.center.x, imageView.center.y+ imageView.bounds.size.height); //找到圖片的中心
? ? [self.viewaddSubview:mirrorImageView];
//上面這部分是鏡像制作
==========================================================
? ? CAGradientLayer *gradientLayer = [CAGradientLayer layer];//制作遮罩
? ? gradientLayer.frame=CGRectMake(0, 0, imageView.frame.size.width, imageView.frame.size.height);
? ? [gradientLayersetColors:@[(id)[UIColor clearColor].CGColor,
?? ? ? ? ? ? ? ? ? ? ? ? ? ? ? (id)[UIColorcolorWithWhite:0alpha:0.4].CGColor]];
? ? gradientLayer.startPoint=CGPointMake(0, 0.7);
? ? gradientLayer.endPoint=CGPointMake(0, 1);
? ? mirrorImageView.layer.mask= gradientLayer;
CASHapeLayer
1.繪制普通的曲線
- (void)testCAShapeLayerWithoutBezier
{
? ? CAShapeLayer *shapeLayer = [CAShapeLayer layer];
? ? shapeLayer.strokeColor = [UIColor redColor].CGColor;
? ? shapeLayer.fillColor = [UIColor clearColor].CGColor;
? ? [self.view.layeraddSublayer:shapeLayer];
? ? CGMutablePathRef path = CGPathCreateMutable();
? ? CGPathMoveToPoint(path,nil, 50, 200);
? ? CGPathAddCurveToPoint(path,nil, 100, 100, 250, 300, 300, 200);
? ? shapeLayer.path= path;
? ? CGPathRelease(path);
}
- (void)testCAShapeLayerWithBezier
{
? ? CAShapeLayer *shapeLayer = [CAShapeLayer layer];
? ? CGPointstartPoint =CGPointMake(50, 200);
? ? CGPointendPoint =CGPointMake(300, 200);
? ? CGPointcontrolPoint1 =CGPointMake(100, 100);
? ? CGPointcontrolPoint2 =CGPointMake(250, 300);
?//設(shè)置路徑
? ? UIBezierPath *path = [UIBezierPath bezierPath];
? ? [path moveToPoint:startPoint]; //設(shè)置起點
? ? [pathaddCurveToPoint:endPointcontrolPoint1:controlPoint1controlPoint2:controlPoint2]; //用貝塞爾曲線繪制路徑
? ? shapeLayer.path= path.CGPath;
? ? shapeLayer.strokeColor = [UIColor orangeColor].CGColor;
? ? shapeLayer.fillColor = [UIColor clearColor].CGColor;
? ? [self.view.layeraddSublayer:shapeLayer];
}
- (void)testCAShapeLayerWithBezier//繪制一個正方形
{
? ? CAShapeLayer *shapeLayer = [CAShapeLayer layer];
? ? shapeLayer.strokeColor = [UIColor orangeColor].CGColor;//繪制線條顏色
? ? shapeLayer.fillColor = [UIColor clearColor].CGColor;//繪制圖形內(nèi)部顏色
? ? UIBezierPath *path2 = [UIBezierPath bezierPathWithRect:CGRectMake(100, 100, 200, 200)];
? ? shapeLayer.path= path2.CGPath;
? ? [self.view.layeraddSublayer:shapeLayer];
}
- (void)testShapeLayerMask
{
? ? UIView*bgView = [[UIViewalloc]init];
? ? bgView.backgroundColor = [UIColor clearColor];
? ? bgView.frame=CGRectMake(50, 100, 300, 200);
? ? [self.viewaddSubview:bgView];
? ? UIImageView *imageView = [[UIImageView alloc] init];
? ? imageView.image = [UIImage imageNamed:@"nature.jpg"];
? ? imageView.contentMode = UIViewContentModeScaleAspectFill;
? ? imageView.frame= bgView.bounds;
? ? [bgViewaddSubview:imageView];
? ? UIBezierPath *maskPath = [UIBezierPath bezierPath];
? ? [maskPathmoveToPoint:CGPointMake(0, 0)];
? ? CGFloatcurveHeight = 40;
? ? CGFloatcurveBeginHeight = imageView.frame.size.height- curveHeight;
? ? [maskPath addLineToPoint:CGPointMake(0, curveBeginHeight)];
? ? CGPointcurveEndPoint =CGPointMake(imageView.frame.size.width, imageView.frame.size.height- curveHeight);
? ? CGPointcontrolPoint =CGPointMake(imageView.frame.size.width/ 2, imageView.frame.size.height+ 20);
? ? [maskPath addQuadCurveToPoint:curveEndPointcontrolPoint:controlPoint];
? ? [maskPath addLineToPoint:CGPointMake(imageView.frame.size.width, 0)];
? ? [maskPathclosePath];
? ? CAShapeLayer *maskLayer = [CAShapeLayer layer];
? ? maskLayer.frame= imageView.bounds;
? ? maskLayer.path= maskPath.CGPath;
? ? //you can try
//? ? [bgView.layer addSublayer:maskLayer];
? ? bgView.layer.mask= maskLayer;
}
- (void)testCAShapeLayerAnimation
{
? ? CAShapeLayer *shapeLayer = [CAShapeLayer layer];
? ? shapeLayer.frame=CGRectMake(100, 100, 100, 100);
? ? UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:shapeLayer.bounds];//定義了一個圓環(huán)形的路徑
? ? shapeLayer.path= path.CGPath;
? ? shapeLayer.fillColor = [UIColor clearColor].CGColor;//內(nèi)部顏色
? ? shapeLayer.lineWidth= 2.0f;//線條寬度
? ? shapeLayer.strokeColor = [UIColor orangeColor].CGColor;//繪制線條是橘黃色
? ? shapeLayer.strokeEnd= 0;//這樣設(shè)置一開始看不到線條的
? ? [self.view.layer addSublayer:shapeLayer];
? ? CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
? ? pathAnimation.duration= 3.0f;
? ? pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
? ? pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];//從0
? ? pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];//到1
? ? pathAnimation.fillMode = kCAFillModeForwards;//向前進行繪制
? ? pathAnimation.removedOnCompletion=NO;
? ? [shapeLayeraddAnimation:pathAnimationforKey:@"strokeEndAnimation"];
}
- (void)testTextLayer
{
? ? CATextLayer *textLayer = [CATextLayer layer];
? ? textLayer.contentsScale = [UIScreen mainScreen].scale;
? ? textLayer.foregroundColor = [UIColor blackColor].CGColor;
? ? textLayer.backgroundColor = [UIColor orangeColor].CGColor;
? ? textLayer.wrapped=YES;
? ? textLayer.alignmentMode = kCAAlignmentLeft;
? ? //font
? ? UIFont *font = [UIFont systemFontOfSize:12];
? ? CGFontRef fontRef = CGFontCreateWithFontName((__bridge CFStringRef)font.fontName);
? ? textLayer.font= fontRef;
? ? textLayer.fontSize= font.pointSize;
? ? CGFontRelease(fontRef);//這里注意
? ? textLayer.frame=CGRectMake(50, 50, 200, 200);
? ? [self.view.layer addSublayer:textLayer];
? ? NSString *text = @"它聰明、熟悉每個用戶的喜好蹭沛，從海量音樂中挑選出你可能喜歡的音樂臂寝。它通過你每一次操作來記錄你的口味。你提供給云音樂的信息越多摊灭，它就越了解你的音樂喜好咆贬。";
? ? textLayer.string= text;
? ? //rich text 復(fù)文本
? ? NSMutableAttributedString *string = [[NSMutable AttributedString alloc] initWithString:text];
? ? [string addAttribute:(NSString *)kCTForegroundColorAttributeName
?? ? ? ? ? ? ? ? ? value:(__bridge id)[UIColor yellowColor].CGColor
?? ? ? ? ? ? ? ? ? range:NSMakeRange(1, 2)];//指定文本顏色是黃色，區(qū)域是從INdex為1的位置帚呼，向后兩個字展示為黃色
? ? [string addAttribute:(NSString *)kCTFontAttributeName
?? ? ? ? ? ? ? ? ? value:[UIFontfontWithName:@"Arial"size:20]
?? ? ? ? ? ? ? ? ? range:NSMakeRange(1, 2)];//同樣的區(qū)域素征，更改了一下字體。
//kCTUnderlineStyleAttributeName:@(kCTUnderlineStyleSingle)增加了下劃線的效果
//? (__bridge id)kCTForegroundColorAttributeName:(__bridge id)[UIColor blueColor].CGColor 更改了字體的顏色
? ? NSDictionary *attrs = @{(__bridge id)kCTUnderlineStyleAttributeName:@(kCTUnderlineStyleSingle),
? ? ? ? ? ? ? ? ? ? ? ? ? ? (__bridge id)kCTForegroundColorAttributeName:(__bridge id)[UIColor blueColor].CGColor};
? ? [stringsetAttributes:attrsrange:NSMakeRange(text.length- 5, 4)];
? ? textLayer.string= string;
}
- (void)testViewDrawRect
{
? ? NTESTestView *testView = [[NTESTestView alloc] init];//這個類實現(xiàn)了drawrect的方法
? ? [self.viewaddSubview:testView];
? ? testView.frame=CGRectMake(10, 10, 200, 200);
? ? testView.layer.backgroundColor = [UIColor orangeColor].CGColor;
? ? testView.opaque=NO;//當我們自定義UIVIew的drawrect方法時候萝挤，所以需要設(shè)置為NO，才能讓drawrect的方法生效
}
#import? "NTESTestView.h"
- (void)drawRect:(CGRect)rect { ? ?
// Drawing code? ? ?自定義的drawRect
CGContextRef ctx=UIGraphicsGetCurrentContext(); ?? ? ? ?
CGContextAddRect(ctx, CGRectMake(50, 50, 100, 100)); ?? ? ? ? CGContextSetRGBFillColor(ctx, 1, 0, 0, 1); ?? ? ?
? CGContextFillPath(ctx); ?? ? ?
? //avoid using if not override
// [self.layer drawInContext:ctx]; }
- (void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx
{
? ? CGContextAddRect(ctx,CGRectMake(50, 50, 100, 100));
? ? CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
? ? CGContextFillPath(ctx);
}
#import "NTESCustomLayerViewController.h"
- (void)testViewDrawRect
{
? ? NTESTestView *testView = [[NTESTestView alloc] init];
? ? [self.viewaddSubview:testView];
? ? testView.frame=CGRectMake(10, 10, 200, 200);
? ? testView.layer.backgroundColor = [UIColor orangeColor].CGColor;
? ? testView.opaque=NO;
? ? [testView.layer setNeedsDisplay];//需要設(shè)置layer才能觸發(fā)UIView自定義的drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx
}
