CALayer设置圆角

CALayer设置圆角

CALayer,无论是view,button,label,textfield等都有这个属性。通过设置其layer来控制各种属性,比如:bounds、position、backgroundColor、cornerRadius等等。

以下设置CALayer的圆角及其他属性。

    //创建layer
    CALayer *layer = [CALayer layer];
    //设置bounds
    layer.bounds = CGRectMake(0, 0, 100, 100);
    //设置中心点位置(默认中心点)
    layer.position = CGPointMake(200, 200);
    //背景颜色
    layer.backgroundColor = [UIColor orangeColor].CGColor;
    //添加到视图上
    [self.view.layer addSublayer:layer];

设置圆角以及其它内容,使其显示出裁剪内容。(图一:原来图片--图二:裁剪后)

  图一   图二

代码如下:

 1 //  1.圆角
 2     layer.cornerRadius = layer.bounds.size.width/2.0;
 3 //  2.contents设置内容
 4     UIImage *image = [UIImage imageNamed:@"pkq.jpg"];
 5     //需要桥接
 6     layer.contents = (__bridge id)(image.CGImage);
 7 //  3.裁剪
 8     layer.masksToBounds = YES;
 9 //  4.设置边框(边框跟着变成了圆的)
10     layer.borderColor = [UIColor orangeColor].CGColor;
11     layer.borderWidth = 5.f;
12 // 5.阴影和边界剪裁是不能同时使用的,因为阴影本身就是渲染到边界外面的。 因此要重新用一个图层
13     CALayer *shadowLayer = [CALayer layer];
14     //阴影bounds、position与layer.bounds,layer.position相同
15     shadowLayer.bounds = layer.bounds;
16     shadowLayer.position = layer.position;
17     //这里也是重点:阴影需要有剪裁,如果不剪裁,就会出现原始模样
18     shadowLayer.cornerRadius = layer.cornerRadius;
19     shadowLayer.backgroundColor = [UIColor whiteColor].CGColor;
20     //此处将shadowLayer插入到layer之下
21     [self.view.layer insertSublayer:shadowLayer below:layer];
22     //设置阴影--颜色、偏移量、透明度
23     shadowLayer.shadowColor = [UIColor grayColor].CGColor;
24     shadowLayer.shadowOffset = CGSizeMake(8, 8);
25     shadowLayer.shadowOpacity = 1.f;

在设置的时候,应该注意以下几点:

  1. 阴影和边界剪裁是不能同时使用的,因为阴影本身就是渲染到边界外面的。
  2. 因此要重新用一个图层。阴影需要有剪裁,如果不剪裁,就会出现原始模样。
  3. 将shadowLayer插入到layer之下

接下来进行操作,代码如下:

1 //  6.1 位移  旋转  缩放
2     //6.1.1位移
3     layer.transform = CATransform3DMakeTranslation(-100, 100, 0);
4     //6.1.2叠加位移(在现有基础上变化,继6.1.1以后 恢复原来位置)
5     layer.transform = CATransform3DTranslate(layer.transform, 100, -100, 0);
6 //  6.2.1 旋转 (-1,0,1) 倒着转,不转,正着转
7     layer.transform = CATransform3DMakeRotation(M_PI_4, 0, 1, 0);
8 //  6.3缩放(以中心点缩放,view也是)
9     layer.transform = CATransform3DMakeScale(.5, .5, .5);

以上是对layer进行操作,由于将其设置为圆,当其旋转的时候是看不到它的变化的,但是放一张图片就可以看出来。

_translayer的变化

 1 //  6.4 近大远小
 2     _translayer = [CALayer layer];
 3     _translayer.bounds = CGRectMake(0, 0, 100, 100);
 4     _translayer.position = CGPointMake(100, 100);
 5     _translayer.backgroundColor = [UIColor blackColor].CGColor;
 6     [self.view.layer addSublayer:_translayer];
 7     //立体感觉,近大远小
 8     _trans = CATransform3DIdentity;
 9     //300.f指的是到屏幕距离-一般是 800
10     _trans.m34 = 1/100.f;

_translayer设置为全局的变量。  1 _Link = [CADisplayLink displayLinkWithTarget:self selector:@selector(time)] ; 2 [_Link addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSDefaultRunLoopMode];

 3 
 4 - (void)action {
 5     //这是黑色图片的动画,具有3D效果
 6     _trans = CATransform3DRotate(_trans, M_PI * .1 * 1/rate, 1, 0, 0);
 7     _translayer.transform = CATransform3DTranslate(_trans, 0, 0, 1);
 8 }
 9 
10 - (void)time {
11     
12     static int a = 0;
13     if (a != 60/rate) {
14         
15         [self action];
16     }
17   // a ++;
18 }

此处转动比较慢,容易看出近大远小的效果。如果需要转动比较快,改变每秒钟的中的那个角度即可。( M_PI * 自定义可变 * 1/rate)

 

文章错误请指正。转载请标明出处。欢迎查阅。

 

posted @ 2015-10-01 23:28  戎马一书生  阅读(1167)  评论(0编辑  收藏  举报