Swift版写法在个人主页Swift集合中
由于使用masksToBounds切圆角时投影的效果会消失,所以这里的思路是通过layer来设置。
如上图所示,接下来分别实现无边框阴影、渐变背景色+圆角阴影和边框圆角阴影
以下属性可根据自身需求进行相应调整:
shadowColor // 阴影颜色
shadowOffset // 阴影偏移量
shadowOpacity // 阴影透明度
shadowRadius // 阴影半径
如上图(1-1),无边框阴影效果实现:
-(UIView *)bgView{
if (!_bgView) {
_bgView = [[UIView alloc]initWithFrame:CGRectMake(50, 200, [UIScreen mainScreen].bounds.size.width-100, 100)];
}
return _bgView;
}
[self.view addSubview:self.bgView];
[self setViewShadow:self.bgView];
- (void)setViewShadow:(UIView *)curView{
curView.backgroundColor = [UIColor whiteColor];
curView.layer.shadowColor = [UIColor colorWithRed:129/255.0 green:174/255.0 blue:254/255.0 alpha:0.28].CGColor;
curView.layer.shadowOffset = CGSizeMake(0,2);
curView.layer.shadowOpacity = 1;
curView.layer.shadowRadius = 14;
curView.layer.cornerRadius = 4;
}
如上图(1-2),渐变背景色+圆角阴影效果实现:
-(UIButton *)loginBtn{
if (!_loginBtn) {
_loginBtn = [UIButton buttonWithType:UIButtonTypeCustom];
_loginBtn.frame = CGRectMake(50, CGRectGetMaxY(self.bgView.frame)+50, [UIScreen mainScreen].bounds.size.width-100, 50);
[_loginBtn setTitle:@"登录" forState:UIControlStateNormal];
[_loginBtn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
}
return _loginBtn;
}
[self.view addSubview:self.loginBtn];
[self setViewColorShadow:self.loginBtn];
- (void)setViewColorShadow:(UIView *)curView{
//渐变背景色设置
CAGradientLayer *gl = [CAGradientLayer layer];
/*
注意: 若是用的xib布局发现宽/高不匹配,可重置gradient.frame = CGRectMake(0, 0, view的宽度, view的高度)
*/
gl.frame = curView.bounds;
gl.startPoint = CGPointMake(0, 0);
gl.endPoint = CGPointMake(1, 1);
gl.colors = @[(__bridge id)[UIColor colorWithRed:10/255.0 green:182/255.0 blue:254/255.0 alpha:1.0].CGColor,(__bridge id)[UIColor colorWithRed:73/255.0 green:90/255.0 blue:255/255.0 alpha:1.0].CGColor];
gl.locations = @[@(0.0),@(1.0f)];
//圆角阴影设置
gl.shadowColor = [UIColor colorWithRed:51/255.0 green:145/255.0 blue:255/255.0 alpha:0.4].CGColor;
gl.shadowOffset = CGSizeMake(0,6);
gl.shadowOpacity = 1;
gl.shadowRadius = 7;
gl.cornerRadius = curView.bounds.size.height*0.5;
[curView.layer addSublayer:gl];
}
如上图(1-3),边框圆角阴影效果实现:
-(UIButton *)borderBtn{
if (!_borderBtn) {
_borderBtn = [UIButton buttonWithType:UIButtonTypeCustom];
_borderBtn.frame = CGRectMake(100, CGRectGetMaxY(self.loginBtn.frame)+50, [UIScreen mainScreen].bounds.size.width-200, 50);
[_borderBtn setTitle:@"获取验证码" forState:UIControlStateNormal];
[_borderBtn setTitleColor:[UIColor colorWithRed:2/255.0 green:116/255.0 blue:223/255.0 alpha:1.0] forState:UIControlStateNormal];
}
return _borderBtn;
}
[self.view addSubview:self.borderBtn];
[self setViewBorderShadow:self.borderBtn];
- (void)setViewBorderShadow:(UIView *)curView{
curView.backgroundColor = [UIColor whiteColor];
curView.layer.shadowColor = [UIColor colorWithRed:51/255.0 green:145/255.0 blue:255/255.0 alpha:0.4].CGColor;
curView.layer.shadowOffset = CGSizeMake(0,3);
curView.layer.shadowOpacity = 1;
curView.layer.shadowRadius = 5;
curView.layer.borderWidth = 1;
curView.layer.borderColor = [UIColor colorWithRed:2/255.0 green:119/255.0 blue:228/255.0 alpha:1.0].CGColor;
curView.layer.cornerRadius = curView.bounds.size.height*0.5;
}