如何在 UINavigationBar 上应用渐变颜色？答案

【问题标题】：How to apply gradient colors on UINavigationBar?如何在 UINavigationBar 上应用渐变颜色？
【发布时间】：2016-08-30 20:53:10
【问题描述】：

我正在尝试在 UINavigationBar 上应用 Chameleon 库中的 Gradient Colors。 This 教程建议我们可以使用 UINavigationBar.appearance() 将主题应用于 UINavigationBar 的所有实例。所以这意味着我可以执行以下操作来设置渐变：

UINavigationBar.appearance().barTintColor = UIColor(gradientStyle:UIGradientStyle.LeftToRight,  
  withFrame: CGRectMake(0, 0, UINavigationBar.appearance().frame.width, UINavigationBar.appearance().frame.height), 
  andColors:[UIColor.flatMagentaColorDark(), UIColor.flatLimeColor()])

但问题是我无法获取 UINavigationBar 实例的高度和宽度。上面代码中的withFrame 参数是必需的。有没有办法一次性将渐变应用到所有实例？

【问题讨论】：

如果您将颜色设置为像红色这样简单的颜色，此代码是否有效？

标签： ios swift uinavigationbar gradient

【解决方案1】：

这是一种方法

let gradientLayer = CAGradientLayer()
self.navigationController!.navigationBar.backgroundColor = UIColor.greenColor()
gradientLayer.frame = self.navigationController!.navigationBar.bounds

let color1 = UIColor.yellowColor().CGColor as CGColorRef
let color2 = UIColor(red: 1.0, green: 0, blue: 0, alpha: 1.0).CGColor as CGColorRef
gradientLayer.colors = [color1, color2]
gradientLayer.locations = [0.0, 0.25, 0.75, 1.0]
 self.navigationController!.navigationBar.layer.addSublayer(gradientLayer)

您可以通过将它们添加到 gradientLayer.colors = [color1, color2] 数组来添加更多颜色

【讨论】：

我正在运行 iOS 9.3 并注意到这个 gradientLayer 最终隐藏了后退按钮文本（但不是 V 形）。加载后，我循环遍历UINavigationBar 子层，渐变层始终位于文本层之上。

【解决方案2】：

这就是我在UINavigationBar使用Chameleon 上应用渐变颜色的方法

 let primaryGradientColor: UIColor = {
    let sizeLength = UIScreen.mainScreen().bounds.size.height * 2
    let defaultNavigationBarFrame = CGRectMake(0, 0, sizeLength, 64)
    let colors = [UIColor.flatMagentaColorDark(), UIColor.flatLimeColor()]
    return GradientColor(.LeftToRight, frame: defaultNavigationBarFrame, colors: colors)
}()

Chameleon.setGlobalThemeUsingPrimaryColor(primaryGradientColor,
                                              withSecondaryColor: UIColor.clearColor(),
                                              andContentStyle: UIContentStyle.Light)

【讨论】：