CALayer实现圆角阴影效果

最新推荐文章于 2019-09-23 10:29:00 发布

Longshihua

最新推荐文章于 2019-09-23 10:29:00 发布

阅读量1.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： Quartz 2D、Core Animation iOS

本文链接：https://blog.youkuaiyun.com/longshihua/article/details/49892877

iOS 同时被 2 个专栏收录

140 篇文章

订阅专栏

Quartz 2D、Core Animation

12 篇文章

订阅专栏

本文介绍如何在iOS应用中使用CALayer进行图形绘制及图像处理，包括创建阴影图层、容器图层，并实现图像的倒立显示。文中通过具体代码展示了不同形变方法的应用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

直接上代码:

#import "ViewController.h"

#define PHOTO_SIZE  160

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    CGPoint position= CGPointMake(160, 220);
    CGRect  bounds=CGRectMake(0, 0, PHOTO_SIZE,PHOTO_SIZE);
    CGFloat cornerRadius=80;
    CGFloat borderWidth=2;

    //阴影图层
    CALayer *layerShadow=[CALayer layer];
    layerShadow.bounds= bounds;
    layerShadow.position= position;
    layerShadow.cornerRadius = cornerRadius;
    layerShadow.shadowColor = [UIColor grayColor].CGColor;
    layerShadow.shadowOpacity = 1;
    layerShadow.borderColor = [UIColor whiteColor].CGColor;
    layerShadow.borderWidth = borderWidth;
    layerShadow.shadowOffset = CGSizeMake(2, 1);//偏移量的大小根据自己的需求设置.
    [self.view.layer addSublayer:layerShadow];

    //容器图层
    CALayer *layer=[[CALayer alloc]init];
    layer.bounds=bounds;
    layer.position=position;
    layer.cornerRadius=cornerRadius;
    layer.masksToBounds=YES;
    layer.borderColor=[UIColor whiteColor].CGColor;
    layer.borderWidth=borderWidth;

    //方法一:利用图层形变解决图像倒立问题.
    layer.transform=CATransform3DMakeRotation(M_PI, 1, 0, 0);

    //方法三:通过keyPath进行设置

    //[layer setValue:@M_PI forKeyPath:@"transform.rotation.x"];

    //在动画开发中形变往往不是直接设置transform，而是通过keyPath进行设置。这种方法设置形变的本质和前面没有区别，只是利用了KVC可以动态修改其属性值而已，但是这种方式在动画中确实很常用的，因为它可以很方便的将几种形变组合到一起使用。同样是解决动画旋转问题，只要将前面的旋转代码改为下面的代码即可：当然，通过key path设置形变参数就需要了解有哪些key path可以设置.

    //设置图层代理
    layer.delegate=self;

    //添加图层到根图层
    [self.view.layer addSublayer:layer];

    //调用图层setNeedDisplay,否则代理方法不会被调用
    [layer setNeedsDisplay];


}

#pragma mark 绘制图形、图像到图层，注意参数中的ctx是图层的图形上下文，其中绘图位置也是相对图层而言的.

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


    NSLog(@"%@",layer);//这个图层正是上面定义的图层

//    CGContextSaveGState(ctx);
//    
//    //方法二:图形上下文形变，解决图片倒立的问题
//    CGContextScaleCTM(ctx, 1, -1);
//    CGContextTranslateCTM(ctx, 0, -PHOTO_SIZE);

    UIImage *image=[UIImage imageNamed:@"ptjShare"];//事实上如果仅仅就显示一张图片在图层中当然没有必要那么麻烦，直接设置图层contents就可以了，不牵涉到绘图也就没有倒立的问题了。

    //注意这个位置是相对于图层而言的不是屏幕
    CGContextDrawImage(ctx, CGRectMake(0, 0, PHOTO_SIZE, PHOTO_SIZE), image.CGImage);

 //   CGContextRestoreGState(ctx);

}

@end