0%

iOS开发:给View设置渐变背景

iOS里要设置渐变的背景不是很方便,Interface Builder只能设单色背景,渐变需要代码实现。 原理是往指定的View的layer里插入一层CAGradientLayer。 先定义一个GradientColors类方便构造指定颜色的CAGradientLayer。

import UIKit
class GradientColors {
let colorTop:CGColorRef
let colorCenter:CGColorRef
let colorBottom:CGColorRef
let gl: CAGradientLayer

init(colorTop:CGColorRef, colorCenter:CGColorRef, colorBottom:CGColorRef) {
    self.colorTop = colorTop
    self.colorCenter = colorCenter
    self.colorBottom = colorBottom
    gl = CAGradientLayer()
    gl.colors = \[ colorTop,colorCenter,colorBottom\]
}

}

构造方法是上中下,三种颜色。 因为UIColor构造方法创建指定的颜色不是很方便,需要计算rgba四个通道0~1的值,并不是常用的16进制颜色值,所以,我写了一个类来帮助转换。

import UIKit
class ColorUtils {
//把argb值转成UIColor
class func colorFromArgb(argb:Int) -> UIColor {
let blue:Float = Float(argb & 0xff) / 255.0
let green = Float(argb >> 8 & 0xff) / 255.0
let red = Float(argb >> 16 & 0xff) / 255.0
let alpha = Float(argb >> 24 & 0xff) / 255.0
return UIColor(red: CGFloat(red), green: CGFloat(green), blue: CGFloat(blue), alpha: CGFloat(alpha))
}
}

下面是controller中应用渐变:

@IBOutlet weak var topBgView: UIView!
let gradienColors = GradientColors(colorTop: ColorUtils.colorFromArgb(0xff2cb1e1).CGColor, colorCenter: ColorUtils.colorFromArgb(0xff1da9da).CGColor, colorBottom: ColorUtils.colorFromArgb(0xff0fa1d3).CGColor)

override func viewDidLoad() {
    super.viewDidLoad()
    topBgView.backgroundColor = UIColor.clearColor()
    var backgroundLayer = gradienColors.gl
    backgroundLayer.frame = topBgView.frame
    topBgView.layer.insertSublayer(backgroundLayer, atIndex: 0)
}