CAShapeLayer在XIB swift iOS中不可见

时间:2018-03-02 12:04:14

标签: ios swift interface-builder xib cashapelayer

我正在使用XIB文件构建自定义视图。但是,我遇到一个问题,我添加到视图(trackLayer)的图层没有显示在xib上(circleLayer是一个动画,我不希望它在xib中呈现,这是我不可能的)。 XIB的所有者类的代码如下所示:

@IBDesignable
class SpinningView: UIView {

@IBOutlet var contentView: SpinningView!

//MARK: Properties
let circleLayer = CAShapeLayer()
let trackLayer = CAShapeLayer()

let circularAnimation: CABasicAnimation = {
    let animation = CABasicAnimation()
    animation.fromValue = 0
    animation.toValue = 1
    animation.duration = 2
    animation.fillMode = kCAFillModeForwards
    animation.isRemovedOnCompletion = false
    return animation
}()

//MARK: IB Inspectables
@IBInspectable var strokeColor: UIColor = UIColor.red {
    ...
}

@IBInspectable var trackColor: UIColor = UIColor.lightGray {
    ...
}

@IBInspectable var lineWidth: CGFloat = 5 {
    ...
}

@IBInspectable var fillColor: UIColor = UIColor.clear {
    ...
}

@IBInspectable var isAnimated: Bool = true {
    ...
}

//MARK: Initialization
override init(frame: CGRect) {
    super.init(frame: frame)
    initSubviews()
}

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)

    setup()
    initSubviews()
}

//MARK: Private functions
private func setup() {
    setupTrack()
    setupAnimationOnTrack()
}

private func setupTrack(){
    trackLayer.lineWidth = lineWidth
    trackLayer.fillColor = fillColor.cgColor
    trackLayer.strokeColor = trackColor.cgColor
    layer.addSublayer(trackLayer)
}

private func setupAnimationOnTrack(){
    circleLayer.lineWidth = lineWidth
    circleLayer.fillColor = fillColor.cgColor
    circleLayer.strokeColor = strokeColor.cgColor
    circleLayer.lineCap = kCALineCapRound
    layer.addSublayer(circleLayer)
    updateAnimation()
}

private func updateAnimation() {
    if isAnimated {
        circleLayer.add(circularAnimation, forKey: "strokeEnd")
    }
    else {
        circleLayer.removeAnimation(forKey: "strokeEnd")
    }
}

//MARK: Layout contraints
override func layoutSubviews() {
    super.layoutSubviews()

    let center = CGPoint(x: bounds.midX, y: bounds.midY)
    let radius = min(bounds.width / 2, bounds.height / 2) - circleLayer.lineWidth / 2

    let startAngle = -CGFloat.pi / 2
    let endAngle = 3 * CGFloat.pi / 2
    let path = UIBezierPath(arcCenter: .zero, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)

    trackLayer.position = center
    trackLayer.path = path.cgPath

    circleLayer.position = center
    circleLayer.path = path.cgPath
}

private func initSubviews() {
    let bundle = Bundle(for: SpinningView.self)
    let nib = UINib(nibName: "SpinningView", bundle: bundle)
    nib.instantiate(withOwner: self, options: nil)
    contentView.frame = bounds
    addSubview(contentView)
}
}

当一个视图在Main.storyboard中被子类化时,我可以看到图像和跟踪图如下IB UIView但是当我转到XIB时,它没有trackLayer(图像周围的圆圈) XIB Image。虽然有人可以说这是有效的以及我为什么要为此烦恼,但我认为正确设计XIB非常重要,因为另一个人可能只是将它看作只有图像的视图(不知道动画功能)< / p>

1 个答案:

答案 0 :(得分:0)

在设计XIB时,@IBDesignable SpinningView不是 的实例。实际上,您正在查看SpinningView来源

因此,它背后的代码没有在那时运行 - 它只在你将SpinningView的实例添加到另一个视图时运行。

看看这个简单的例子:

@IBDesignable
class SpinningView: UIView {

    @IBOutlet var contentView: UIView!
    @IBOutlet var theLabel: UILabel!

    //MARK: Initialization
    override init(frame: CGRect) {
        super.init(frame: frame)
        initSubviews()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        initSubviews()
    }

    private func initSubviews() {
        let bundle = Bundle(for: SpinningView.self)
        let nib = UINib(nibName: "SpinningView", bundle: bundle)
        nib.instantiate(withOwner: self, options: nil)
        contentView.frame = bounds
        addSubview(contentView)

        // this will change the label's textColor in Storyboard
        // when a UIView's class is set to SpinningView
        theLabel.textColor = .red
    }

}

当我设计XIB时,这就是我所看到的:

enter image description here

但是,当我将UIView添加到另一个视图,并将其类指定为SpinningView时,这就是我所看到的:

enter image description here

标签的文字颜色变为红色,因为代码现在正在运行。

考虑它的另一种方式......您将trackColorfillColor等变量定义为@IBInspectable。当您设计XIB时,您在Xcode的“属性检查器”面板中看不到这些属性 - 只有在您选择了SpinningView的{​​{1}}实例时才会看到它们被添加到其他地方。

希望这是有道理的。