使用 Snapkit 的自定义视图在使用时不显示

Question

我在swift中设计了一个视图，如下所示。

import UIKit
import SnapKit

@IBDesignable class FlightStopsView: UIView {

    var startPoint: UILabel!
    var endPoint: UILabel!
    var line: UIView!
    var stopsStack: UIStackView!
    var stopCount: UILabel!

    var stops: [Stop]! {
        didSet {
            addStops()
            setNeedsLayout()
            setNeedsDisplay()
        }
    }

    @IBInspectable var lineColor: UIColor! {
        didSet{
            line?.backgroundColor = UIColor.lightGray
            layoutIfNeeded()
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        setUpView()

    }

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

    func setUpView() {

        startPoint = UILabel()
        startPoint.attributedText = "o"
        self.addSubview(startPoint)
        startPoint.snp.makeConstraints { make in
            make.width.equalTo(10)
            make.height.equalTo(10)
            make.leading.equalToSuperview()
            make.centerY.equalToSuperview()
        }

        endPoint = UILabel()
        endPoint.attributedText = "o"
        self.addSubview(endPoint)
        endPoint.snp.makeConstraints { make in
            make.width.equalTo(10)
            make.height.equalTo(10)
            make.trailing.equalToSuperview()
            make.centerY.equalToSuperview()
        }

        line = UIView()
        line.backgroundColor = UIColor.lightGray
        self.addSubview(line)
        line.snp.makeConstraints { make in
            make.height.equalTo(1)
            make.centerY.equalToSuperview()
            make.leading.equalTo(startPoint.snp.trailing).offset(-1)
            make.trailing.equalTo(endPoint.snp.leading).offset(1)
        }

        stopCount = UILabel()
        stopCount.textColor = UIColor.lightGray
        stopCount.font = UIFont.regularFont(Dimens.FontSize.SMALL)
        stopCount.adjustsFontSizeToFitWidth = true
        stopCount.text = "Non Stop"
        self.addSubview(stopCount)
        stopCount.snp.makeConstraints { make in
            make.centerX.equalToSuperview()
            make.top.equalTo(line.snp.bottom).offset(4)
            make.bottom.equalToSuperview()
        }

        stopsStack = UIStackView()
        stopsStack.backgroundColor = .clear
        stopsStack.alignment = .center
        stopsStack.distribution = .fill
        stopsStack.contentMode = .center
        stopsStack.spacing = 30
        self.addSubview(stopsStack)
        stopsStack.snp.makeConstraints{ make in
            make.centerX.equalToSuperview()
            make.top.equalToSuperview()
            make.bottom.equalTo(line.snp.bottom).offset(4.5)
        }

        addStops()
    }

    func addStops() {
        guard stopCount != nil && stopsStack != nil else {
            return
        }

        guard stops != nil else {
            stopCount.text = "Non stop"
            return
        }
        stopCount.text = "\(stops.count) stops"

        for stop in stops {
            let stackChild = UIView()
            let stackChildLabel = UILabel()
            let stackChildPointer = UILabel()

            stackChildLabel.text = stop.stopName
            stackChildLabel.textAlignment = .center
            stackChildLabel.textColor = UIColor.lightGray
            stackChildLabel.font = UIFont.regularFont(Dimens.FontSize.SMALL)
            stackChildLabel.adjustsFontSizeToFitWidth = true
            stackChildLabel.numberOfLines = 2
            stackChildPointer.attributedText = “o”

            stackChild.addSubview(stackChildLabel)
            stackChild.addSubview(stackChildPointer)

            stackChild.snp.makeConstraints { make in
                make.width.equalTo(24)
                make.height.equalToSuperview()
            }

            stackChildPointer.snp.makeConstraints { make in
                make.width.equalTo(10)
                make.height.equalTo(10)
                make.bottom.equalToSuperview()
                make.centerX.equalToSuperview()
            }

            stackChildLabel.snp.makeConstraints{ make in
                make.width.equalTo(20)
                make.top.equalToSuperview()
                make.bottom.equalTo(stackChildPointer.snp.top)
                make.centerX.equalToSuperview()
            }

            stopsStack.addArrangedSubview(stackChild)
        }
    }
}

视图的主要目的是显示两个旅行点之间的停靠点。即，如果使用公共汽车作为交通工具，从目的地到源头有多少站。但是，当运行它在模拟器上时，此视图不会显示在视图中。如果有人能指出我在这里做错了什么，我会很高兴。

Answer 1

问题是您没有将 stackChild 设置为 stopStacks，另一件事是初始化，这在 init?(coder aDecoder: NSCoder) 方法下是必需的，因为在添加 UIView 时UIStoryboard init(frame: CGRect) 不会被调用。

你可以在下面找到他们修改后的代码：

import UIKit
import SnapKit

@IBDesignable class FlightStopsView: UIView {

    var startPoint: UILabel!
    var endPoint: UILabel!
    var line: UIView!
    var stopsStack: UIStackView!
    var stopCount: UILabel!

    var stops: [Stop]! {
        didSet {
            addStops()
            setNeedsLayout()
            setNeedsDisplay()
        }
    }

    @IBInspectable var lineColor: UIColor! {
        didSet{
            line?.backgroundColor = UIColor.lightGray
            layoutIfNeeded()
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        setUpView()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        //Here is the change: Make sure you setupview in case of you are calling it from Storyboard
        setUpView()
    }

    func setUpView() {

        startPoint = UILabel()
        startPoint.text = "0"
        self.addSubview(startPoint)
        startPoint.snp.makeConstraints { make in
            make.width.equalTo(10)
            make.height.equalTo(10)
            make.leading.equalToSuperview()
            make.centerY.equalToSuperview()
        }

        endPoint = UILabel()
        endPoint.text = "0"
        self.addSubview(endPoint)
        endPoint.snp.makeConstraints { make in
            make.width.equalTo(10)
            make.height.equalTo(10)
            make.trailing.equalToSuperview()
            make.centerY.equalToSuperview()
        }

        line = UIView()
        line.backgroundColor = UIColor.lightGray
        self.addSubview(line)
        line.snp.makeConstraints { make in
            make.height.equalTo(1)
            make.centerY.equalToSuperview()
            make.leading.equalTo(startPoint.snp.trailing).offset(-1)
            make.trailing.equalTo(endPoint.snp.leading).offset(1)
        }

        stopCount = UILabel()
        stopCount.textColor = UIColor.lightGray
        stopCount.font = UIFont.regularFont(Dimens.FontSize.SMALL)
        stopCount.adjustsFontSizeToFitWidth = true
        stopCount.text = "Non Stop"
        self.addSubview(stopCount)
        stopCount.snp.makeConstraints { make in
            make.centerX.equalToSuperview()
            make.top.equalTo(line.snp.bottom).offset(4)
            make.bottom.equalToSuperview()
        }

        stopsStack = UIStackView()
        stopsStack.backgroundColor = .clear
        stopsStack.alignment = .center
        stopsStack.distribution = .fill
        stopsStack.contentMode = .center
        stopsStack.spacing = 30
        self.addSubview(stopsStack)
        stopsStack.snp.makeConstraints{ make in
            make.centerX.equalToSuperview()
            make.top.equalToSuperview()
            make.bottom.equalTo(line.snp.bottom).offset(4.5)
        }

        addStops()
    }

    func addStops() {
        guard stopCount != nil && stopsStack != nil else {
            return
        }

        guard stops != nil else {
            stopCount.text = "Non stop"
            return
        }
        stopCount.text = "\(stops.count) stops"

        for stop in stops {
            let stackChild = UIView()
            let stackChildLabel = UILabel()
            let stackChildPointer = UILabel()

            stackChildLabel.text = stop.name
            stackChildLabel.textAlignment = .center
            stackChildLabel.textColor = UIColor.lightGray
            stackChildLabel.font = UIFont.regularFont(Dimens.FontSize.SMALL)
            stackChildLabel.adjustsFontSizeToFitWidth = true
            stackChildLabel.numberOfLines = 2
            stackChildPointer.text = "0"

            stackChild.addSubview(stackChildLabel)
            stackChild.addSubview(stackChildPointer)

            //Here is the change: Although you haven't added your `stackChild` to your main `stopsStack`
            stopsStack.addSubview(stackChild)

            stackChild.snp.makeConstraints { make in
                make.width.equalTo(24)
                make.height.equalToSuperview()
            }

            stackChildPointer.snp.makeConstraints { make in
                make.width.equalTo(10)
                make.height.equalTo(10)
                make.bottom.equalToSuperview()
                make.centerX.equalToSuperview()
            }

            stackChildLabel.snp.makeConstraints{ make in
                make.width.equalTo(20)
                make.top.equalToSuperview()
                make.bottom.equalTo(stackChildPointer.snp.top)
                make.centerX.equalToSuperview()
            }

            stopsStack.addArrangedSubview(stackChild)
        }
    }
}

请告诉我这是否有帮助！

使用 Snapkit 的自定义视图在使用时不显示

Custom View using Snapkit not showing when used

swift

custom-view

snapkit