iOS CALayer

// 边框宽度
self.purpleView.layer.borderWidth = 10;
// 边框颜色
self.purpleView.layer.borderColor = [UIColor greenColor].CGColor;
// 圆角
self.purpleView.layer.cornerRadius = 10;

//    self.purpleView.layer.masksToBounds = YES;
// 阴影颜色
self.purpleView.layer.shadowColor = [UIColor blueColor].CGColor;
// 阴影偏差
self.purpleView.layer.shadowOffset = CGSizeMake(20, 20);
// 阴影不透明度
self.purpleView.layer.shadowOpacity = 0.5;


// 平移
self.iconView.layer.transform = CATransform3DMakeScale(1.5, 0.5, 0);
// 旋转二维
self.iconView.transform = CGAffineTransformMakeRotation(M_PI_4);
// 旋转三维 方式一
self.iconView.layer.transform = CATransform3DMakeRotation(M_PI_4, 0, 0, 1);

// 旋转三维 方式二
NSValue *value = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 0, 0, 1)];
[self.iconView.layer setValue:value forKeyPath:@"transform"];

// 旋转
[self.iconView.layer setValue:@(M_PI_2) forKeyPath:@"transform.rotation"];

self.iconView.layer.transform = CATransform3DMakeScale(0.5, 2, 0);
[self.iconView.layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeScale(0.5, 2, 0)] forKeyPath:@"transform"];

// 可以传递哪些key path, 在官方文档搜索 "CATransform3D key paths"
[self.iconView.layer setValue:@(-100) forKeyPath:@"transform.translation.x"];

key paths

新建图层

//    CALayer *layer = [[CALayer alloc] init];
CALayer *layer = [CALayer layer];
layer.backgroundColor = [UIColor redColor].CGColor;
layer.bounds = CGRectMake(0, 0, 100, 100);
layer.position = CGPointMake(200, 100);
layer.cornerRadius = 10;
layer.masksToBounds = YES;
layer.contents = (id)[UIImage imageNamed:@"icon"].CGImage;
[self.view.layer addSublayer:layer];

自定义图层

方式一
继承自CALayer
/**
 *  只有明显地调用setNeedsDisplay方法,才会调用drawInContext:方法进行绘制
 */
- (void)drawInContext:(CGContextRef)ctx
{
    // 红色
    CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
    // 添加圆
    CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, 50, 50));
    // 实心绘制
    CGContextFillPath(ctx);
}

自定义View是这样的
- (void)drawRect:(CGRect)rect
{
    CGContextRef ctx =  UIGraphicsGetCurrentContext();
    // 红色
    CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
    // 添加圆
    CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, 50, 50));
    // 实心绘制
    CGContextFillPath(ctx);
}


MyLayer *layer = [MyLayer layer];
layer.bounds = CGRectMake(0, 0, 100, 100);
layer.backgroundColor = [UIColor blueColor].CGColor;
layer.anchorPoint = CGPointZero;
[layer setNeedsDisplay];
[self.view.layer addSublayer:layer];


方式二
CALayer *layer = [CALayer layer];
layer.bounds = CGRectMake(0, 0, 100, 100);
layer.backgroundColor = [UIColor blackColor].CGColor;
layer.anchorPoint = CGPointZero;
layer.position = CGPointMake(100, 100);
layer.delegate = self;
[layer setNeedsDisplay];
[self.view.layer addSublayer:layer];


#pragma mark - 图层的代理方法
- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx
{
    CGContextSetRGBFillColor(ctx, 1, 0, 0, 1);
    CGContextAddRect(ctx, CGRectMake(0, 0, 20, 20));
    CGContextFillPath(ctx);
}

view的完整显示过程

  1. view.layer会准备一个Layer Graphics Contex(图层类型的上下文)
  2. 调用view.layer.delegate(view)的drawLayer:inContext:,并传入刚才准备好的上下文
  3. view的drawLayer:inContext:方法内部又会调用view的drawRect:方法
  4. view就可以在drawRect:方法中实现绘图代码, 所有东西最终都绘制到view.layer上面
  5. 系统再将view.layer的内容拷贝到屏幕, 于是完成了view的显示

推荐阅读更多精彩内容

  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 7,077评论 6 28
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 4,071评论 5 10
  • CALayer简介 CALayer主要是展示内容和动画操作,CALayer不包含在UIKit中,不能响应事件,由于...
    LJ_影子阅读 2,566评论 0 2
  • 每个UIView有一个伙伴称为layer,一个CALayer。UIView实际上并没有把自己画到屏幕上;它绘制本身...
    shenzhenboy阅读 2,353评论 0 17
  • #幸福是需要修出来的~每天进步1%~幸福实修11班~08贾春芬-杭州#20170903(6/30) 【幸福三朵玫瑰...
    chfenj阅读 101评论 3 7
  • - 「黑暗有重量嗎?」 - 「黑暗沒有重量,但當你人生處於黑暗的時期,又為什麼會被他壓垮呢?」 - 「黑暗沒有重量...
    11243a阅读 65评论 0 0