如何在Swift中制作可设计的UIImage [英] how to make Designable UIImage in Swift

问题描述

我是初学者.我想制作一个包含使Designable UIImage成为可代码的swift文件，所以我不会通过编码来编辑UI元素的显示，而只是在Interface Builder中通过将该swift文件分配给UI类来实现.

I am a beginner. I want to make a swift file that contains a code to make Designable UIImage, so I will not edit the UI element display by coding, just in Interface builder by assigning this swift file to UI class.

我可以在UIButton中做类似的事情，例如，如果我想做圆角并将边框添加到UIButton中，我可以做类似的事情

I can do something similar in UIButton, for example if i want to make round corner and add border to UIButton i can do something like this

import UIKit

@IBDesignable
class DesignableButton: UIButton {

    @IBInspectable var cornerRadiusOfButton : CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadiusOfButton
        }
    }

    @IBInspectable var borderWidth: CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }

    @IBInspectable var borderColor: UIColor? {
        set {
            guard let uiColor = newValue else { return }
            layer.borderColor = uiColor.cgColor
        }
        get {
            guard let color = layer.borderColor else { return nil }
            return UIColor(cgColor: color)
        }
    }


}

对于UIImage，通常我们想使用此代码添加圆角或制作圆形UIImage

for UIImage, usually we want to add round corner or to make circular UIImage by using this code

// round corner
        someImage.layer.cornerRadius = checkinPhoto.bounds.width/20
        someImage.clipsToBounds = true

 //  circular image
        someImage.layer.cornerRadius = someImage.frame.size.width / 2
        someImage.clipsToBounds = true

如何将这些代码制作为UIImage的@IBDesignable代码类，例如上面的Designable UIButton?我试图通过子类化UIImage进行制作，但是我不解释为什么我无法访问layer和clipToBounds

how to make those code to @IBDesignable code class for UIImage like Designable UIButton above? I have tried to make by subclassing UIImage, but i don't why i can't access layer and clipToBounds

推荐答案

您不能将UIImage用作可设计的，因为UIImage不是UIView子类，您需要将其设计成可设计的UIImageView， UIImage本身无法呈现，需要呈现UIImageView

You can't use UIImage as designable because UIImage is not a UIView subclass you need to make designable your UIImageView instead, the UIImage can't be rendered by itself needs a UIImageView to be rendered

使用此类

import UIKit

@IBDesignable
class RoundableImageView: UIImageView {

    @IBInspectable var cornerRadius : CGFloat = 0.0{
        didSet{
            self.applyCornerRadius()
        }
    }

    @IBInspectable var borderColor : UIColor = UIColor.clear{
        didSet{
            self.applyCornerRadius()
        }
    }

    @IBInspectable var borderWidth : Double = 0{
        didSet{
            self.applyCornerRadius()
        }
    }

    @IBInspectable var circular : Bool = false{
        didSet{
            self.applyCornerRadius()
        }
    }

    func applyCornerRadius()
    {
        if(self.circular) {
            self.layer.cornerRadius = self.bounds.size.height/2
            self.layer.masksToBounds = true
            self.layer.borderColor = self.borderColor.cgColor
            self.layer.borderWidth = CGFloat(self.borderWidth)
        }else {
            self.layer.cornerRadius = cornerRadius
            self.layer.masksToBounds = true
            self.layer.borderColor = self.borderColor.cgColor
            self.layer.borderWidth = CGFloat(self.borderWidth)
        }
    }

    override func awakeFromNib() {
        super.awakeFromNib()
        self.applyCornerRadius()
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        applyCornerRadius()
    }

}

这篇关于如何在Swift中制作可设计的UIImage的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！