iOS12-Swift5-Xcode10-如何直接在Storyboard的attributes inspector上给view设圆角和阴影

1,294 阅读1分钟

如何直接在Storyboard的attributes inspector上给view设圆角(Rounded Corner)和阴影(Shadow)?

在项目中新建一个Swift文件,用来扩展UIView的功能:

import UIKit

extension UIView {
    
    @IBInspectable
    var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
        }
    }
    
    @IBInspectable
    var borderWidth: CGFloat {
        get {
            return layer.borderWidth
        }
        set {
            layer.borderWidth = newValue
        }
    }
    
    @IBInspectable
    var borderColor: UIColor? {
        get {
            if let color = layer.borderColor {
                return UIColor(cgColor: color)
            }
            return nil
        }
        set {
            if let color = newValue {
                layer.borderColor = color.cgColor
            } else {
                layer.borderColor = nil
            }
        }
    }
    
    @IBInspectable
    var shadowRadius: CGFloat {
        get {
            return layer.shadowRadius
        }
        set {
            layer.shadowRadius = newValue
        }
    }
    
    @IBInspectable
    var shadowOpacity: Float {
        get {
            return layer.shadowOpacity
        }
        set {
            layer.shadowOpacity = newValue
        }
    }
    
    @IBInspectable
    var shadowOffset: CGSize {
        get {
            return layer.shadowOffset
        }
        set {
            layer.shadowOffset = newValue
        }
    }
    
    @IBInspectable
    var shadowColor: UIColor? {
        get {
            if let color = layer.shadowColor {
                return UIColor(cgColor: color)
            }
            return nil
        }
        set {
            if let color = newValue {
                layer.shadowColor = color.cgColor
            } else {
                layer.shadowColor = nil
            }
        }
    }
}

前面三个是加了圆角属性 后面四个是加了阴影属性

回到storyboard,点击任意一个UIView(rootview,button,label等),右边栏选择attributes inspector,将会看到:

屏幕快照 2019-05-03 下午6.49.19.png

好了可以愉快的玩耍了。

 

如果要给imageview加阴影的话,需要把imageview放在一个相同大小的UIView上面,然后给这个UIView加阴影即可:

屏幕快照 2019-05-03 下午7.09.49.png
屏幕快照 2019-05-03 下午7.10.47.png
  注:各个阴影属性在这篇文章里有介绍:如何动态的给view添加阴影shadow

 

广告时间:小弟的iOS12零基础视频教程(每章皆可试听):

m.study.163.com/provider/48…