美文网首页
CALayer的应用

CALayer的应用

作者: Hey_ebc3 | 来源:发表于2019-08-15 14:29 被阅读0次

    再次说明本系列文章是我在通拦学习iOS开发中回顾时觉得有必要再加深印象的地方,如有不准确欢迎批评指正,如果帮到读者理解学习就更好了。

    CALayer

    UIView VS CALayer

    相对于UIView CALayer在更下面一层布局,view持有layer 所以都有view.layer 来对view设置其layer 关于layer有哪些属性及方法不再多说

    CALayer旋转tranform是3D的,UIview是2D的

    CALayer可以做显示(阴影、圆角、边框、遮罩、变换...) 动画

    //CALayer展示

    CALayer* layer1=[[CALayeralloc]init];

    layer1.backgroundColor=[UIColor grayColor].CGColor;

    layer1.frame=CGRectMake(100,100,150,150);

    //layer的坐标系也是在左上角原点

    //设置layer的边框

    layer1.borderColor=[UIColor blackColor].CGColor;

    layer1.borderWidth=2;

    // 设置layer的圆角

    layer1.cornerRadius=20;

    //contents可以用来设置图片

    layer1.contents=(id)[UIImage ImageNamed:@"..."];

    //不让子layer超出父layer的范围

    layer1.masksToBounds=YES;

    属性介绍position 与 anchorPoint

    position相当于view的center ,但当anchorPoint改变时就不是center了而是锚点的坐标,anchorPoint相当于一张纸被一个图钉定住只可以绕着图钉转,这个图钉的位置就是anchorPoint这张纸就是layer,anchorPonit是CGPoint类型的取值范围是(0-1,0-1)

    默认情况下锚点是(0.5,0.5)

    如上述代码将layer1的锚点设置为(0,0),position的坐标就变成的(175,175) frame是(175,175,150,150);

    公式position.x=anchorPonit.x*frame.size.width+frame.origin.x     y值一样,把x换y


    Mask Layer

        UIImageView* image=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"1.jpg"]];

        image.frame=CGRectMake(50,150,200,250);

        image.contentMode=UIViewContentModeScaleAspectFill;

        [self.viewaddSubview:image];

        UIImageView*imageMask=[[UIImageViewalloc]init];

        imageMask.image=[[UIImage imageNamed:@"imageMask.png"]stretchableImageWithLeftCapWidth:14 topCapHeight:28];

        imageMask.frame=image.bounds;

        image.layer.mask=imageMask.layer;

    GAGrandient Layer

        //渐变颜色

        CAGradientLayer*layer=[[CAGradientLayer alloc]init];

        layer.frame=CGRectMake(100,100,150,150);

        [layersetColors:@[

                           (id)[UIColoryellowColor].CGColor,

                           (id)[UIColorgreenColor].CGColor,

                           (id)[UIColorblueColor].CGColor

                           ]];

        //默认为从上至下

        //使用渐变分割线

        [layersetLocations:@[@0.25,@0.5,@0.75]];

        //渐变方向 startpoint endpoint (0-1,0-1);

        [layersetStartPoint:CGPointMake(0, 0)];

        [layersetEndPoint:CGPointMake(1, 0)];

        [self.view.layeraddSublayer:layer];

    //作为mask

    UIImageView *imageView=[[UIImageView alloc]init];  

    imageView.image=[UIImage imageNamed:@"nature.jpg"];    

    imageView.contentMode=UIViewContentModeScaleAspectFill;   

    imageView.frame=CGRectMake(100, 260,150,100);    

     [self.view addSubview:imageView];          

    //镜像效果    

    UIImageView* mirrorImgView=[[UIImageView alloc]init];     

    mirrorImgView.image=imageView.image;     

    mirrorImgView.contentMode=UIViewContentModeScaleAspectFill;     

    //翻转     

    mirrorImgView.transform=CGAffineTransformMakeScale(1, -1);    

    mirrorImgView.frame=CGRectMake(0, 0, 150, 100);     

    mirrorImgView.center=CGPointMake(imageView.center.x, imageView.center.y+imageView.bounds.size.height);   

    [self.view addSubview:mirrorImgView];          

    CAGradientLayer* GDlayer=[CAGradientLayer layer];     

    GDlayer.frame=CGRectMake(0, 0, 150, 100); 

    [GDlayer setColors:@[(id)[UIColor clearColor].CGColor,  (id)[UIColor colorWithWhite:0 alpha:0.5].CGColor ]];    

    [GDlayer setStartPoint:CGPointMake(0, 0.7)];    

    [GDlayer setEndPoint:CGPointMake(0, 1)];     

    mirrorImgView.layer.mask=GDlayer;


    CAShaperLayer

    用以绘制形状、CGPath

        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);

    beizer曲线

        CAShapeLayer* slayer=[CAShapeLayer layer];

        CGPointstartPoint=CGPointMake(50,200);

        CGPointendPoint=CGPointMake(300,200);

        CGPointcontrolPoint1=CGPointMake(100,100);

        CGPointcontrolPoint2=CGPointMake(250,300);

        UIBezierPath* path=[UIBezierPath bezierPath];

        [pathmoveToPoint:startPoint];

        [pathaddCurveToPoint:endPointcontrolPoint1:controlPoint1controlPoint2:controlPoint2];

        slayer.path=path.CGPath;

        slayer.strokeColor=[UIColor redColor].CGColor;

        slayer.fillColor=[UIColor clearColor].CGColor;

        //矩形

        UIBezierPath* path2=[UIBezierPath bezierPathWithRect:CGRectMake(100, 100, 200, 200)];

        slayer.path=path2.CGPath;

        //[self.view.layer addSublayer:slayer];

        //带圆角的矩形 还有圆形等其他图形

        UIBezierPath* path3=[UIBezierPath bezierPathWithRoundedRect:CGRectMake(100, 100, 200, 200) cornerRadius:100];

        slayer.path=path3.CGPath;

        [self.view.layeraddSublayer:slayer];

    //画图 ponit点我是随便写的主要想说明方法

    UIBezierPath *bezierPath=[UIBezierPath bezierPath];

    [bezierPath moveToPoint:CGPointMake(0, 0)];     

    [bezierPath addLineToPoint:CGPointMake(10,20)];     

    [bezierPath addCurveToPoint:CGPointMake(100, 200) controlPoint1:CGPointMake(50, 50) controlPoint2:CGPointMake(70, 120)];     

    [bezierPath closePath];

    自定义Layer 

    调用时要将opaque置为0 当用法二时还要调用一下 setNeedDisplay ,法二的优先级高

    //方法1

    - (void)drawRect:(CGRect)rect {

        CGContextRef ctx=UIGraphicsGetCurrentContext();

        CGContextAddRect(ctx, CGRectMake(50, 50, 100, 100));

        CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);

        CGContextFillPath(ctx);

    }

    //方法二

    -(void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx{

        CGContextAddRect(ctx, CGRectMake(50, 50, 100, 100));

        CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);

        CGContextFillPath(ctx);

    }

    相关文章

      网友评论

          本文标题:CALayer的应用

          本文链接:https://www.haomeiwen.com/subject/ovqzjctx.html