ios 两个单独的背景颜色的顶部和底部的看法控制器

a14dhokn  于 2023-06-07  发布在  iOS
关注(0)|答案(1)|浏览(171)

问题:

我想以编程方式为视图控制器设置两种不同的背景颜色。

代码:

self.view.backgroundColor = .systemBackground

func setGradientBackground() {
        
        let colorTop = UIColor.black.cgColor
        let colorBottom = backgroundGray.cgColor
                    
        let gradientLayer = CAGradientLayer()
        gradientLayer.colors = [colorTop, colorBottom]
        gradientLayer.startPoint = CGPoint(x: 0, y: 0)
        gradientLayer.endPoint = CGPoint(x: 1, y: -1)
        //gradientLayer.locations = [0.0, 1.0]
        gradientLayer.frame = self.view.bounds
                
        self.view.layer.insertSublayer(gradientLayer, at:0)
    }

我需要使用梯度系统来获得这个吗?梯度系统是很好的梯度,我想更多的一个坚实的顶部和底部的颜色。
如何获得

下面图像的所需输出

kknvjkwl

kknvjkwl1#

因此,基于这个答案How to Apply Gradient to background view of iOS Swift App
我修改了CAGradientLayer#locationsCAGradientLayer#colors,以在颜色之间提供“硬”停止

import UIKit
import PlaygroundSupport

PlaygroundPage.current.needsIndefiniteExecution = true

var greeting = "Hello, playground"

class Gradient: UIView {
    var startColor:   UIColor = .white { didSet { updateColors() }}
    var endColor:     UIColor = .red { didSet { updateColors() }}
    
    override class var layerClass: AnyClass { CAGradientLayer.self }
    
    var gradientLayer: CAGradientLayer { layer as! CAGradientLayer }
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }

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

    private func commonInit() {
        updatePoints()
        updateLocations()
        updateColors()
    }
    
    func updatePoints() {
        gradientLayer.startPoint = diagonalMode ? .init(x: 1, y: 0) : .init(x: 0, y: 0.5)
        gradientLayer.endPoint   = diagonalMode ? .init(x: 0, y: 1) : .init(x: 1, y: 0.5)
    }

    func updateLocations() {
        gradientLayer.locations = [0, 0.5, 0.5, 1.0]
    }

    func updateColors() {
        gradientLayer.colors = [startColor.cgColor, startColor.cgColor, endColor.cgColor, endColor.cgColor]
    }
}

let view = Gradient(frame: CGRect(x: 0, y: 0, width: 400, height: 400))

我还可以考虑设计一个复合/复合视图,一个有两个视图来管理背景颜色,第三个是放在它们的顶部,作为“内容”视图。但这需要更多的杂耍。

相关问题