iOS 按钮阴影和圆角的设置

- (void)viewDidLoad {
[super viewDidLoad];

UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(100, 100, 100, 30)];
btn.backgroundColor = [UIColor redColor];
btn.titleLabel.textColor = [UIColor whiteColor];
[btn addTarget:self action:@selector(testAction:) forControlEvents:UIControlEventTouchUpInside];
[btn setTitle:@"哈哈哈哈" forState:UIControlStateNormal];
btn.layer.cornerRadius = 15;
btn.layer.shadowPath = [UIBezierPath bezierPathWithRect:btn.bounds].CGPath;//阴影的位置
btn.layer.shadowColor = [UIColor orangeColor].CGColor;//阴影颜色
btn.layer.shadowOffset = CGSizeMake(0, 10);//阴影的大小，x往右和y往下是正
btn.layer.shadowRadius = 5;     //阴影的扩散范围，相当于blur radius，也是shadow的渐变距离，从外围开始，往里渐变shadowRadius距离
btn.layer.shadowOpacity = 1;    //阴影的不透明度
btn.layer.masksToBounds = NO;   //很重要的属性，可以用此属性来防止子元素大小溢出父元素，如若防止溢出，请设为 true
[self.view addSubview:btn];
}

1. shadowPath : 设置 CALayer 背景(shodow)的位置
2. shadowOffset : shadow 在 X 和 Y 轴 上延伸的方向，即 shadow 的大小
3. shadowOpacity : shadow 的透明效果，默认是0，所以一定要设置一下这个值
4. shadowRadius : shadow 的渐变距离，从外围开始，往里渐变 shadowRadius 距离
5. masksToBounds : 很重要的属性，可以用此属性来防止子元素大小溢出父元素，如若防止溢出，请设为 true
6. borderWidth 和 boarderColor : 边框颜色和宽度，很常用
7. bounds : 对于我来说比较难的一个属性，测了半天也没完全了解，只知道可以用来控制 UIView 的大小，但是不能控制 位置
8. opacity : UIView 的透明效果
9. cornerRadius : UIView 的圆角

有朋友留言说，既要圆角阴影，还要设置图片，这是个好想法。
于是我摸索了下，要让图片成圆角的样式，就必须把UIButton的masksToBounds属性设置为YES，但是这样一来，阴影效果就没有了，为啥阴影效果没有了呢？那是因为UIButton的layer也相当于UIButton的一个子组件，父组件都不让子组件超出父组件的尺寸范围，那阴影自然就显示不出来了，所以想到一个办法就是，给UIButton的父view添加一个layer，这个layer的位置跟UIButton重合，它起的作用就是负责阴影和圆形，这样UIButton的masksToBounds就可以设置为YES了。讲这么多，show me code

 CALayer *layer = [CALayer layer];
layer.frame = CGRectMake(100, 200, 200, 30);
layer.backgroundColor = [UIColor redColor].CGColor;
layer.shadowOffset = CGSizeMake(0, 10);
layer.shadowColor = [UIColor orangeColor].CGColor;
layer.shadowOpacity = 1;
layer.cornerRadius = 15;
[self.view.layer insertSublayer:layer atIndex:0];
UIButton *button = [[UIButton alloc] initWithFrame:layer.frame];
[self.view addSubview:button];
button.layer.masksToBounds =YES;
[button setImage:[UIImage imageNamed:@"button2"] forState:UIControlStateNormal];
button.layer.cornerRadius = layer.cornerRadius;

最终的效果图如下：

image.png

如果还有更好的方法或者其他问题，欢迎留言！

参考文章：
IOS CALayer 详解