在 Swift 中制作渐变背景 - 正确的方法

Posted

技术标签:

【中文标题】在 Swift 中制作渐变背景 - 正确的方法【英文标题】:Making Gradient Background in Swift - The Right Way 【发布时间】:2016-05-13 14:18:48 【问题描述】:

这是我的渐变背景代码。当我将它应用到我的视图时,它会隐藏我在那个 VC 上的所有东西,就像它在前面,而其他所有东西都被推后。如何制作不干扰元素的渐变视图?

我使用 @IBDesignable 只是为了看看它在 Storyboard 中的外观。

import UIKit

@IBDesignable
class GradientView: UIView 

    private let gradientLayer = CAGradientLayer()

    var color1 = ColorPalette.GrdTop
    var color2 = ColorPalette.GrdBottom

    override init(frame: CGRect) 
        super.init(frame: frame)
        configureGradient()
    

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

    func configureGradient() 
        gradientLayer.startPoint = CGPoint(x: 0, y: 0)
        gradientLayer.endPoint = CGPoint(x: 1, y: 1)
        updateColors()
        layer.addSublayer(gradientLayer)
    

    override func layoutSubviews() 
        super.layoutSubviews()
        gradientLayer.frame = bounds
    

    private func updateColors() 
        gradientLayer.colors = [color1.CGColor, color2.CGColor]
    

    override func prepareForInterfaceBuilder() 
        super.prepareForInterfaceBuilder()
        configureGradient()
    

【问题讨论】:

【参考方案1】:

就像它在前面,其他所有东西都被推后

因为它在前面。想想你的这行代码:

layer.addSublayer(gradientLayer)

这会将渐变层置于该层的所有其他子层之前。视图的子视图由其层的子层显示,因此渐变层覆盖了该视图的当前子视图。

如果您愿意,可以将图层一直插入到后面 (insertSublayer:atIndex:)。不过,优雅的解决方案是实现 the layerClass class method 以使该视图返回 CAGradientLayer。现在您不必添加渐变到您的 GradientView;相反,您的 GradientView 一个渐变,您可以根据需要配置该渐变。

【讨论】:

如果我没记错的话,@Kira Arik 也可能想要为CAGradientLayer() 设置一个掩码 感谢您的建议,但这对我来说似乎很难。我还是个初学者,所以...我可能不得不请人帮助我解决这个问题。无论如何,谢谢。

以上是关于在 Swift 中制作渐变背景 - 正确的方法的主要内容,如果未能解决你的问题,请参考以下文章

在 Swift 中的按钮上设置背景渐变

如何在android中制作渐变背景

如何在 React 中使用单色制作渐变背景?

有没有办法在界面生成器中制作渐变背景颜色?

swift Swift - 渐变和背景与重新定位

请问一下CSS3样式中如何让背景渐变与背景图片共存啊!