当前位置: > > > Swift - 在UIView上绘制图形阴影

Swift - 在UIView上绘制图形阴影

阴影是在图形中呈现深度的一种好办法,使用阴影可以让图像更加具有立体感。

1,设置阴影的三个要素
(1)阴影颜色
(2)阴影偏移量
(3)阴影模糊程度

2,保存和恢复图形上下文
(1)使用 CGContextSetShadowWithColor() 方法创建和设置阴影以后,阴影会被应用到绘制的任何东西上,而且会一直持续下去。
(2)但如果想要先绘制一个带阴影的对象,然后再绘制一个不带阴影的对象。就需要使用 CGContextSaveGState() 和 CGContextRestoreGState() 来进行保存和恢复图形上下文。(应用阴影前先保存,绘制完毕后恢复上下文设置,再绘制其他图形。)

3,下面是使用样例
外层的圆角矩形使用阴影,内部再绘制一个没有阴影的小矩形。
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let viewRect = CGRect(x: 50, y: 50, width: 100, height: 100)
        let view1 = MyCanvas(frame: viewRect)
        self.view.addSubview(view1)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

class MyCanvas: UIView {
    override init(frame: CGRect) {
        super.init(frame: frame)
        //把背景色设为透明
        self.backgroundColor = UIColor.clearColor()
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    override func drawRect(rect: CGRect) {
        //获取绘制上下文
        let context = UIGraphicsGetCurrentContext()
        
        //计算要在其中绘制的矩形
        let pathRect = CGRectInset(self.bounds,
            self.bounds.size.width * 0.1,
            self.bounds.size.height * 0.1)
        
        //创建一个圆角矩形路径
        let rectanglePath = UIBezierPath(roundedRect: pathRect, cornerRadius: 20)
        
        //保存绘制设置
        CGContextSaveGState(context)
        
        //准备阴影
        let shadowColor = UIColor.blackColor().CGColor
        let shadowOffet = CGSize(width: 3, height: 3)
        let shadowBlurRadius:CGFloat = 5.0
        
        //创建和应用阴影
        CGContextSetShadowWithColor(context, shadowOffet, shadowBlurRadius, shadowColor)
        
        //绘制带有阴影的路径
        UIColor.blueColor().setFill()
        rectanglePath.fill()
        
        //还原绘制设置
        CGContextRestoreGState(context)
        
        //绘制另一个矩形(不带阴影)
        let pathRect2 = CGRectInset(self.bounds,
            self.bounds.size.width * 0.3,
            self.bounds.size.height * 0.3)
        let rectanglePath2 = UIBezierPath(rect: pathRect2)
        UIColor.yellowColor().setFill()
        rectanglePath2.fill()
    }
}
评论0