Swift版寫法在個人主頁Swift集合中
由于使用masksToBounds切圓角時投影的效果會消失,所以這里的思路是通過layer來設(shè)置埠巨。
如上圖所示历谍,接下來分別實現(xiàn)無邊框陰影、漸變背景色+圓角陰影和邊框圓角陰影
以下屬性可根據(jù)自身需求進行相應(yīng)調(diào)整:
shadowColor // 陰影顏色
shadowOffset // 陰影偏移量
shadowOpacity // 陰影透明度
shadowRadius // 陰影半徑
如上圖(1-1)辣垒,無邊框陰影效果實現(xiàn):
-(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)望侈,漸變背景色+圓角陰影效果實現(xiàn):
-(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{
//漸變背景色設(shè)置
CAGradientLayer *gl = [CAGradientLayer layer];
/*
注意: 若是用的xib布局發(fā)現(xiàn)寬/高不匹配,可重置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)];
//圓角陰影設(shè)置
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)勋桶,邊框圓角陰影效果實現(xiàn):
-(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;
}