[英]How to add corner radius and shadow to a UIView in iOS
autolayout(Constraints)后如何制作视图的圆角半径和阴影(即使视图也有一些子视图)以及编写代码的方法。 如果我在viewdidload 和 viewDidAppear中编写代码,我无法获得确切的角半径和阴影?
这是我在 viewWillLayoutSubview 中执行的代码,我可以获得拐角半径,但无法获得阴影效果。 如果我删除 view.layer.masksToBounds = true 我可以得到阴影,但它不是角落,仅适用于基本视图而不适用于其子视图..
view.layer.cornerRadius = 10
view.layer.masksToBounds = true
view.layer.borderWidth = 1.0
view.layer.borderColor = UIColor.black.cgColor
view.layer.shadowColor = UIColor.black.cgColor
view.layer.shadowOffset = CGSize(width: 3, height: 3)
view.layer.shadowOpacity = 0.7
view.layer.shadowRadius = 4.0
viewShadow.layer.cornerRadius = 12
viewShadow.layer.masksToBounds = true;
viewShadow.backgroundColor = UIColor.white
viewShadow.layer.shadowColor = UIColor.lightGray.cgColor
viewShadow.layer.shadowOpacity = 0.8
viewShadow.layer.shadowOffset = CGSize(width: 0.0, height: 0.0)
viewShadow.layer.shadowRadius = 6.0
viewShadow.layer.masksToBounds = false
这取决于某些条件
1.如果您从故事板设置自动布局约束并且视图的大小(高度,宽度)是固定的,那么您可以在 viewDidLoad 中设置角半径。
2.如果您从故事板设置自动布局约束并且视图的大小(高度,宽度)为比例,那么设置角半径的安全位置是viewWillLayoutSubview。
3.如果您以编程方式设置约束,那么也可能存在某些条件。viewWillAppear、viewDidAppear、viewWillLayoutSubview、viewDidLayoutSubview 都可以根据您的情况方便使用。
无法设置
layer.masksToBounds = true
并获得阴影,因为 maskToBounds 将剪辑掉在视图范围内的所有内容。 并且由于阴影被放置在边界上,所以它也会剪辑。 唯一的方法是让所有子视图远离边界。
另一种方法是。
将您的视图添加为另一个视图的子视图,我们称之为父视图。 将阴影添加到父视图
layer.cornerRadius = 10
layer.masksToBounds = false
在您看来添加
layer.cornerRadius = 10
layermasksToBounds = true
这将起作用。
添加此代码,然后在故事板中签入属性检查器后,它会显示您设置边框颜色、阴影、半径。
extension UIView {
@IBInspectable
var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
@IBInspectable
var borderWidth: CGFloat {
get {
return layer.borderWidth
}
set {
layer.borderWidth = newValue
}
}
@IBInspectable
var borderColor: UIColor? {
get {
return UIColor(cgColor: layer.borderColor!)
}
set {
layer.borderColor = newValue?.cgColor
}
}
@IBInspectable
var shadowRadius: CGFloat {
get {
return layer.shadowRadius
}
set {
layer.shadowColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1).cgColor
layer.shadowOffset = CGSize(width: 0, height: 2)
layer.shadowOpacity = 0.5
layer.masksToBounds = false
layer.shadowRadius = shadowRadius
}
}
}
添加父视图,parentView->View
为 parentView 设置 shadow 和 cornerRadius,maskToBounds = false
为视图设置cornerRadius,maskToBounds = true
试试这个答案:
UIView * paintView=[[UIView alloc]initWithFrame:CGRectMake(50, 150, 320, 430)];
[paintView setBackgroundColor:[UIColor yellowColor]];
paintView.layer.masksToBounds = NO;
paintView.layer.cornerRadius = 5;
paintView.layer.shadowOffset = CGSizeMake(-.2f, .2f);
paintView.layer.shadowRadius = 3;
paintView.layer.shadowOpacity = 0.8;
paintView.layer.shadowColor = [[UIColor redColor] CGColor];
UIBezierPath *path = [UIBezierPath bezierPathWithRect:paintView.bounds];
paintView.layer.shadowPath = path.CGPath;
[self.view addSubview:paintView];
要同时添加圆角半径和阴影,您需要通过添加另一个相同大小的视图或子视图来伪造此视图。
因此,首先,添加您的视图,假设 containerView 就像您的父视图/超级视图一样,我们将通过以下方式向其正常添加阴影:
containerView.backgroundColor = .clear
containerView.layer.shadowColor = UIColor.lightGray.cgColor
// or if you'd like to add shadow color in black, it's what you prefer
//containerView.layer.shadowColor = UIColor.black.cgColor
containerView.layer.shadowOffset = .zero
containerView.layer.shadowOpacity = 0.3
// shadow radius is optional, you can add or comment it
containerView.layer.shadowRadius = 8
containerView.layer.masksToBounds = false
然后您可以通过以下方式在containerView
上创建子视图:
containerView.addSubview(subContainerView)
subContainerView.backgroundColor = .white
subContainerView.layer.cornerRadius = 8
subContainerView.layer.masksToBounds = true
containerView
会将阴影反射到subContainerView
,它实际上是角半径。
注意:如果您想更改视图的背景颜色,请更改subContainerView
背景。
你可以试试这个:
func addShadow(container : UIView){
container.layer.shadowColor = UIColor.black.cgColor
container.layer.shadowOffset = CGSize(width: 1.0, height: 1.0)
container.layer.shadowOpacity = 0.2
container.layer.shadowRadius = 5.0
container.layer.masksToBounds = false
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.