CALayer实现圆角阴影效果

原创 2015年11月17日 20:42:29

直接上代码:

#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
版权声明:本文为博主原创文章,未经博主允许不得转载。

(一一九)通过CALayer实现阴影、圆角、边框和3D变换

在每个View上都有一个CALayer作为父图层,View的内容作为子层显示,通过layer的contents属性决定了要显示的内容,通过修改过layer的一些属性可以实现一些华丽的效果。 下面以一个...

iOS效果 :(1) CALayer 图层阴影,边框,圆角,圆型图片的阴影

圆形 圆角 边框 阴影 自定义阴影

css技巧:实现圆角、阴影、透明效果

CSS技巧:圆角效果 切1个透明的圆形图片(这个图片要求圆角内测是透明的,而外侧是不透明的),用绝对定位来显示4个圆角,这样做的好处是只使用1个图片,即可以实现任何大小,任何背景颜色的box圆角,代码...

使图片产生3D、阴影、圆角效果

  • 2013年11月29日 10:22
  • 270KB
  • 下载

css3圆角阴影效果

  • 2014年09月10日 16:31
  • 903B
  • 下载

CALayer控件(通过操作这个CALayer对象,可以很方便地调整UIView的一些界面属性,比如:阴影、圆角大小、边框宽度和颜色等)

【CALayer控件(通过操作这个CALayer对象,可以很方便地调整UIView的一些界面属性,比如:阴影、圆角大小、边框宽度和颜色等)】 一、简单介绍 在iOS中,你能看得见摸得着的东西基本上...

CSS3 圆角和阴影效果

index div{ color: #0A0F5A; si

为圆角矩形卡片底部添加阴影效果

目录1.先上效果 2.再上代码 3.最后原理 1.效果2.代码不需要渐变颜色的阴影,直接使用solid填充颜色既可 ...

css3边框——圆角效果(border-radius)、阴影(box-shadow)、边框应用图片(border-image)

1.圆角效果(border-radius)

CSS圆角阴影边框的实现.txt

  • 2014年03月05日 11:43
  • 4KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:CALayer实现圆角阴影效果
举报原因:
原因补充:

(最多只允许输入30个字)