制作UIView渐变的边框颜色

时间:2017-10-08 15:58:33

标签: swift uiview

如何制作UIView渐变的边框颜色?

我已从故事板中声明了一个UIView,我知道如何使边框颜色变得坚固。但我无法找到如何制作边框渐变。

 @IBOutlet weak var view: UIView! 

override func awakeFromNib() {
        super.awakeFromNib() 

    let gradient = CAGradientLayer()

    gradient.colors = [UIColor.white.cgColor, UIColor.black.cgColor]

        view.backgroundColor = nil
        view.layer.cornerRadius = view.bounds.width / 2
        view.layer.borderWidth = 3
        view.layer.borderColor = colorOutline.cgColor


        nah.textColor = colorCircleBlue


    }

2 个答案:

答案 0 :(得分:0)

你好 Whatsup

下面我举一个例子来完成你的任务。

我将我的代码放在didSet中,但如果你愿意,也可以把它放在didLoad中。

我也不知道是谁做的,我搜索并发现了这个答案。

@gvuksic explain how create a border gradient on UIView us here

        let gradient = CAGradientLayer()
        gradient.frame =  CGRect(origin: CGPoint.zero, size: self.view.frame.size)
        gradient.colors = [UIColor.blue.cgColor, UIColor.green.cgColor]

        let shape = CAShapeLayer()
        shape.lineWidth = 2
        shape.path = UIBezierPath(rect: self.view.bounds).cgPath
        shape.strokeColor = UIColor.black.cgColor
        shape.fillColor = UIColor.clear.cgColor
        gradient.mask = shape

        self.view.layer.addSublayer(gradient)

答案 1 :(得分:0)

如果要制作圆形渐变框架,请尝试以下操作:

 let gradient = CAGradientLayer()
    gradient.frame =  CGRect(origin: CGPoint.zero, size: self.yourView.frame.size)
    gradient.colors = [UIColor(red: 1, green: 0.2527923882, blue: 1, alpha: 1).cgColor, UIColor(red: 0.1802595352, green: 0.06151589641, blue: 0.2927506345, alpha: 1).cgColor]
    let shape = CAShapeLayer()
    shape.lineWidth = 2
    shape.path = UIBezierPath(roundedRect: yourView.bounds.insetBy(dx: 2, dy: 2), cornerRadius: yourView.frame.width * 0.5).cgPath
    shape.strokeColor = UIColor.black.cgColor
    shape.fillColor = UIColor.clear.cgColor
    gradient.mask = shape
    self.yourView.layer.addSublayer(gradient)

您的视图必须在高度和重量之间具有1的长宽比 //粉色和紫色== [UIColor(红色:1,绿色:0.2527923882,蓝色:1,alpha:1).cgColor,UIColor(红色:0.1802595352,绿色:0.06151589641,蓝色:0.2927506345,alpha:1).cgColor ]