示例效果图
要求：
- Platform: iOS8.0+
- Language: Swift3.1
- Editor: Xcode8.3+
2018-06-27补充
要想实现任意圆角+阴影，则只能通过两个view（也可以是一个view的多个layer）实现了，其中一个view只负责投影（注意背景色为nil），另外一个负责圆角显示（显示内容主要在这个view上）。
- view方式
// 阴影
self.shadowView.backgroundColor = nil;
self.shadowView.layer.masksToBounds = NO;
self.shadowView.layer.shadowOpacity = 1;
self.shadowView.layer.shadowOffset = CGSizeZero;
self.shadowView.layer.shadowRadius = 10;
// 任意圆角
CGPathRef path = [UIBezierPath bezierPathWithRoundedRect:self.cornerView.bounds
byRoundingCorners:UIRectCornerTopLeft cornerRadii:CGSizeMake(40, 40)].CGPath;
CAShapeLayer *lay = [CAShapeLayer layer];
lay.path = path;
self.cornerView.layer.mask = lay;
- layer方式
// 阴影
self.shadowView.backgroundColor = nil;
self.shadowView.layer.masksToBounds = NO;
self.shadowView.layer.shadowOpacity = 1;
self.shadowView.layer.shadowOffset = CGSizeZero;
self.shadowView.layer.shadowRadius = 10;
CALayer *cornerLayer = [CALayer layer];
cornerLayer.frame = self.shadowView.bounds;
cornerLayer.backgroundColor = self.cornerView.backgroundColor.CGColor;
// 任意圆角
CGPathRef path = [UIBezierPath bezierPathWithRoundedRect:self.cornerView.bounds
byRoundingCorners:UIRectCornerTopLeft cornerRadii:CGSizeMake(40, 40)].CGPath;
CAShapeLayer *lay = [CAShapeLayer layer];
lay.path = path;
cornerLayer.mask = lay;
[self.shadowView.layer addSublayer:cornerLayer];
效果
2018-04-28补充
后来尝试发现：view的圆角、阴影、边框其实是可以共存的（注意不要设置
maskToBounds为YES、并且最为关键的是borderWidth不要设置为0，这样就可以达到圆角-borderWidth导致的圆角，和阴影共存了）
_backView.layer.shadowColor = UIColor.greenColor.CGColor;
_backView.layer.borderColor = _backView.layer.shadowColor; // 边框颜色建议和阴影颜色一致
_backView.layer.borderWidth = 0.000001; // 只要不为0就行
_backView.layer.cornerRadius = 40;
_backView.layer.shadowOpacity = 1;
_backView.layer.shadowRadius = 20;
_backView.layer.shadowOffset = CGSizeZero;
最终效果
1. 圆角
给一个UIView设置圆角主要通过：
view.layer.cornerRadius = 10
也可以设置一些属性，增加绘制效率
// 设置缓存
view.layer.shouldRasterize = true
// 设置抗锯齿边缘
view.layer.rasterizationScale = UIScreen.main.scale
// 内容缩放比
view.layer.contentsScale = UIScreen.main.scale
radius=20, 但这种情况下无法和阴影属性共存
2. 阴影
给一个UIView设置阴影主要通过：
view.shadowColor = color.cgColor
view.shadowOffset = CGSize(width: offsetX, height: offsetY)
view.shadowRadius = radius
view.shadowOpacity = opacity //默认为0
// view.shadowPath = UIBezierPath(rect: view.bounds).CGPath
(10,10) 10 1
3. 任意圆角
如果要给一个view设置任意的一个/多个圆角，那么上面的方法就不适用了，得设置view.layer.mask达到任意圆角/形状的目的：
let corners: UIRectCorner = [UIRectCorner.topLeft, UIRectCorner.topRight]
// 或者设置所有圆角.allCorners
let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
let maskLayer = CAShapeLayer()
maskLayer.path = path.cgPath
maskLayer.frame = bounds
view.layer.mask = maskLayer
(20,20)，这种情况下同样无法和阴影共存
4. 绘制阴影
这种情况下，就无法通过属性实现了，而是绘制矩形，并绘制和其绑定的阴影图形：
override func draw(_ rect: CGRect) {
super.draw(rect)
let path = UIBezierPath(rect: bounds.insetBy(dx: 20, dy: 20))
UIColor.white.setFill() //路径填充颜色
let conext = UIGraphicsGetCurrentContext()
conext?.setShadow(offset: CGSize(width: 10, height: 10), blur: 10, color: UIColor.black.cgColor) //阴影绘制，直接附加到path上了
path.fill()
}
(10,10) 10
5. 任意圆角+阴影
如果同时要实现任意圆角+阴影，只能通过4+3的方式在draw(_ rect: CGRect)方法中：
- 绘制阴影
let corners: UIRectCorner = [UIRectCorner.topLeft, UIRectCorner.topRight]
let shadowPath = UIBezierPath(roundedRect: rect.insetBy(dx: shadowRadius, dy: shadowRadius), byRoundingCorners: corners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius))
let context = UIGraphicsGetCurrentContext()
context?.setShadow(offset: shadowOffset, blur: shadowRadius, color: shadowColor.cgColor)
fillColor.setFill()
shadowPath.fill()
- 绘制圆角
let corners: UIRectCorner = [UIRectCorner.topLeft, UIRectCorner.topRight]
let maskPath = UIBezierPath(roundedRect: rect, byRoundingCorners: corners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius))
let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
maskLayer.frame = rect
layer.mask = maskLayer
但这种情况下要注意设置layoutMargins，避免子view被裁剪
6. 源码
- 支持xib & stroyboard
// CornerShadowView.swift
import UIKit
@IBDesignable
class CornerShadowView: UIView {
// MARK: - IBOutlet
// MARK: - properties
@IBInspectable
public var topLeft: Bool = false{
didSet{
redraw()
}
}
@IBInspectable
public var bottomLeft: Bool = false{
didSet{
redraw()
}
}
@IBInspectable
public var topRight: Bool = false{
didSet{
redraw()
}
}
@IBInspectable
public var bottomRight: Bool = false{
didSet{
redraw()
}
}
@IBInspectable
public var cornerRadius: CGFloat = 10{
didSet{
redraw()
}
}
@IBInspectable
public var shadowOffset: CGSize = .zero{
didSet{
redraw()
}
}
@IBInspectable
public var shadowRadius: CGFloat = 0{
didSet{
redraw()
}
}
@IBInspectable
public var shadowColor: UIColor = .black{
didSet{
redraw()
}
}
@IBInspectable
public var fillColor: UIColor = .white{
didSet{
redraw()
}
}
public var margins: UIEdgeInsets = .zero{
didSet{
redraw()
}
}
// MARK: - initial method
override func draw(_ rect: CGRect) {
super.draw(rect)
var corners: UIRectCorner = []
if topLeft {
corners.insert(.topLeft)
}
if bottomLeft {
corners.insert(.bottomLeft)
}
if topRight {
corners.insert(.topRight)
}
if bottomRight {
corners.insert(.bottomRight)
}
if shadRadius > 0 {
//绘制阴影
let shadowPath = UIBezierPath(roundedRect: rect.insetsWithMargins(margins), byRoundingCorners: corners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius))
let context = UIGraphicsGetCurrentContext()
context?.setShadow(offset: shadOffset, blur: shadowRadius, color: shadowColor.cgColor)
fillColor.setFill()
shadowPath.fill()
}
//绘制mask
let maskPath = UIBezierPath(roundedRect: rect, byRoundingCorners: corners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius))
let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
maskLayer.frame = rect
layer.mask = maskLayer
}
// MARK: - lifecycle
override func awakeFromNib() {
super.awakeFromNib()
}
// MARK: - private method
fileprivate func redraw(){
setNeedsDisplay()
if shadowRadius > 0 {
backgroundColor = UIColor.clear
}
}
}
