iosアプリ 背景の放射状グラデーション

Question

お世話になっております。
iOSアプリをSwiftで作っております。

背景色を放射状のグラデーションにしたいです。

http://qiita.com/kikuma/items/ac737fb3305da3389bf9
上記サイトを参考に上から下へのグラデーションはできたのですが、
中央から外側への放射状にすることができません。

ご教授お願いいたします。

Answer 1

CAGradientLayer はLinear だけで Radial はなかったように思います。
やりようが無いわけではなく、CGContextDrawRadialGradient を使えば実現できます。

CALayerのサブクラスを作成する。

import UIKit

class GradientLayer: CALayer {
    
    var startColor = UIColor.orangeColor()
    var endColor = UIColor.yellowColor()
    
    required init(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)!
    }
    
    override init(layer: AnyObject) {
        super.init(layer: layer)
    }
    
    override init() {
        super.init()
        self.setNeedsDisplay()
    }
    
    override func drawInContext(ctx: CGContext) {
        
        CGContextSaveGState(ctx)
        
        let myColors = [startColor.CGColor, endColor.CGColor]
        let myColorSpace = CGColorSpaceCreateDeviceRGB()
        let myColorLocations:[CGFloat] = [0.0, 1.0]
        
        let myGradient = CGGradientCreateWithColors(myColorSpace, myColors, myColorLocations)
        
        let startCenter = CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2)
        let endCenter = startCenter
        let startRadius:CGFloat = 0.0
        let endRadius = min(self.bounds.size.width, self.bounds.size.height)
        
        CGContextDrawRadialGradient(ctx, myGradient, startCenter, startRadius, endCenter, endRadius, [CGGradientDrawingOptions.DrawsBeforeStartLocation, CGGradientDrawingOptions.DrawsAfterEndLocation])

        CGContextRestoreGState(ctx)

    }

}

ViewControllerで呼ぶ。

import UIKit

class ViewController: UIViewController {
    
    let gradientLayer = GradientLayer()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        gradientLayer.frame = self.view.bounds

        self.view.layer.addSublayer(gradientLayer)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

Comments

[mACS]

提示いただいたソースで解決できました。ありがとうございました。