以编程方式将渐变视图和UILabel添加到UIView不起作用

Question

我有一个Storyboard，其中设置了三个UIView，并连接到Storyboard的UIViewController。

@IBOutlet weak var availableView: UIView!
@IBOutlet weak var maybeAvailableView: UIView!
@IBOutlet weak var notAvailableView: UIView!

我有两个函数可以将UILabel和CAGradientLayer添加到每个UIView。这是用于添加UILabels的。

func setUpLabels(view1: UIView, view2: UIView, view3: UIView) {
    let availableLabel = UILabel()
    let maybeAvailableLabel = UILabel()
    let notAvailableLabel = UILabel()

    availableLabel.text = "Available"
    maybeAvailableLabel.text = "Maybe Available"
    notAvailableLabel.text = "Not Available"

    availableLabel.backgroundColor = .clear
    maybeAvailableLabel.backgroundColor = .clear
    notAvailableLabel.backgroundColor = .clear

    availableLabel.font = UIFont.systemFont(ofSize: 17, weight: UIFont.Weight(rawValue: 10))
    maybeAvailableLabel.font = UIFont.systemFont(ofSize: 17, weight: UIFont.Weight(rawValue: 10))
    notAvailableLabel.font = UIFont.systemFont(ofSize: 17, weight: UIFont.Weight(rawValue: 10))

    availableLabel.textColor = .black
    maybeAvailableLabel.textColor = .black
    notAvailableLabel.textColor = .black

    availableLabel.frame = view1.bounds
    maybeAvailableLabel.frame = view2.bounds
    notAvailableLabel.frame = view3.bounds

    view1.addSubview(availableLabel)
    view2.addSubview(maybeAvailableLabel)
    view3.addSubview(notAvailableLabel)
}

这是用来添加渐变的。

func setGradientBackground(colorTop: UIColor, colorBottom: UIColor, view: UIView) {
let gradientLayer = CAGradientLayer()
gradientLayer.colors = [colorBottom.cgColor, colorTop.cgColor]
gradientLayer.startPoint = CGPoint(x: 1, y: 1)
gradientLayer.endPoint = CGPoint(x: 0, y: 0)
gradientLayer.locations = [0, 1]
gradientLayer.frame = view.bounds

view.layer.insertSublayer(gradientLayer, at: 0)
}

这就是我在viewDidLayoutSubviews中所说的

availableView.layer.masksToBounds = true
maybeAvailableView.layer.masksToBounds = true
notAvailableView.layer.masksToBounds = true

setGradientBackground(colorTop: darkBlue, colorBottom: .systemIndigo, view: notAvailableView)
setGradientBackground(colorTop: .systemRed, colorBottom: .systemOrange, view: maybeAvailableView)
setGradientBackground(colorTop: .systemBlue, colorBottom: .systemTeal, view: availableView)

setUpLabels(view1: availableView, view2: maybeAvailableView, view3: notAvailableView)

但是，viewController或调试层次结构视图中什么也没有出现。我从其他问题中尝试了很多方法，但没有任何改变。

Answer 1

设置渐变背景以查看

// - Parameters:
// - colors: gradient colors
// - opacity: opacity
// - direction: gradient direction
// - radius: radius
func setGradientBackground(_ colors: [UIColor], opacity: Float = 1, direction: GradientColorDirection = .vertical, radius: CGFloat = 25) {
        if let sublayers = self.layer.sublayers {
            for item in sublayers {
                if item is CAGradientLayer {
                    item.removeFromSuperlayer()
                }
            }
        }
        let gradientLayer = CAGradientLayer()
        gradientLayer.opacity = opacity
        gradientLayer.colors = colors.map { $0.cgColor }

        if case .horizontal = direction {
            gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0)
            gradientLayer.endPoint = CGPoint(x: 1.0, y: 0.0)
        }

        gradientLayer.bounds = self.bounds
        gradientLayer.cornerRadius = radius
        gradientLayer.anchorPoint = CGPoint.zero
        self.layer.insertSublayer(gradientLayer, at: 0)
    }

渐变颜色方向

enum GradientColorDirection {
        case vertical
        case horizontal
    }

从上到下遮罩的颜色

 static let topToBottomMask: [UIColor] = {
            return [UIColor.clear, UIColor.black.withAlphaComponent(0.40), UIColor.black.withAlphaComponent(0.43)]
        }()

设置渐变

self.view.setGradientBackground(topToBottomMask, radius: 0)

希望有帮助。

Answer 2

可能是您有任何约束方面的问题。我检查了您的代码（将setGradientBackground(colorTop: .darkBlue, colorBottom: .systemIndigo, view: notAvailableView)更改为setGradientBackground(colorTop: .darkGray, colorBottom: .systemIndigo, view: notAvailableView)，因为我没有此颜色，并且看到了正常的行为：