Posted at

swiftで背景とかテキストにグラデーションを設定

More than 1 year has passed since last update.


グラデーションを設定


背景に設定

// 縦向き

let gradient: CAGradientLayer = CAGradientLayer()
gradient.name = "gradationLayer"
gradient.frame = horizonView.bounds
gradient.startPoint = CGPoint(x: 0.5, y: 1.0)
gradient.endPoint = CGPoint(x: 0.5, y: 0.0)
let gradientColors = [UIColor(red: 225.0 / 255.0, green: 228.0 / 255.0, blue: 232.0 / 255.0, alpha: 1.0).cgColor, UIColor(red: 117.0 / 255.0, green: 46.0 / 255.0, blue: 228.0 / 255.0, alpha: 1.0).cgColor]
gradient.colors = gradientColors
verticalView.layer.insertSublayer(gradient, at: 0)

// 横向き
let gradient: CAGradientLayer = CAGradientLayer()
gradient.name = "gradationLayer"
gradient.frame = horizonView.bounds
gradient.startPoint = CGPoint(x: 1.0, y: 0.5)
gradient.endPoint = CGPoint(x: 0.0, y: 0.5)
let gradientColors = [UIColor(red: 225.0 / 255.0, green: 228.0 / 255.0, blue: 232.0 / 255.0, alpha: 1.0).cgColor, UIColor(red: 117.0 / 255.0, green: 46.0 / 255.0, blue: 228.0 / 255.0, alpha: 1.0).cgColor]
gradient.colors = gradientColors
horizonView.layer.insertSublayer(gradient, at: 0)

// グラデーションから色を変更したい時は、下記のようにlayerをhiddenにする
for layer in horizonView.layer.sublayers! {
    if layer.name == "gradationLayer" {
    layer.isHidden = true
}
}


テキストに設定

テキストをグラデーションにしたい時は下記のように、UIColor(patternImage: UIImage)で色を定義し、設定する。

let gradationImage = UIImage(named: "GradationImage")!

gradationTextLabel.textColor = UIColor(patternImage: gradationImage)


できたもの

スクリーンショット 2016-12-10 18.02.54.png