Jak wypełnić warstwę CAShapeLayer nachylonym pod kątem?

Question

Pytanie:

Jak mam wypełnić CAShapeLayer() z gradientem i na kątem 45 stopni ?

Na przykład, w obrazu 1, poniżej kod rysuje kwadratu i wypełnia warstwę niebieskiego (UIColor.blueColor().CGColor).

Ale jak mam wypełnić go gradientem na kątem 45 stopni od niebieskiego do czerwonego jak w obrazu 2 (tj UIColor.blueColor().CGColor do UIColor.redColor().CGColor)?

Kod:

let path = UIBezierPath() 
path.moveToPoint(CGPoint(x: 0, y: 0)) 
path.addLineToPoint(CGPoint(x: 0, y: 100)) 
path.addLineToPoint(CGPoint(x: 100, y: 100)) 
path.addLineToPoint(CGPoint(x: 100, y: 0)) 
path.closePath() 

let shape = CAShapeLayer() 
shape.path = path.CGPath 
shape.fillColor = UIColor.blueColor().CGColor 

Answer 1

Dlaczego nie skorzystać CAGradientLayer który ma startPoint i endPoint właściwości.

można zrobić:

import UIKit 
import PlaygroundSupport 

let frame = CGRect(x: 0, y: 0, width: 100, height: 100) 
let view = UIView(frame: frame) 

PlaygroundPage.current.liveView = view 

let path = UIBezierPath(ovalIn: frame) 

let shape = CAShapeLayer() 
shape.frame = frame 
shape.path = path.cgPath 
shape.fillColor = UIColor.blue.cgColor 

let gradient = CAGradientLayer() 
gradient.frame = frame 
gradient.colors = [UIColor.blue.cgColor, 
        UIColor.red.cgColor] 
gradient.startPoint = CGPoint(x: 0, y: 1) 
gradient.endPoint = CGPoint(x: 1, y: 0) 
gradient.mask = shape 

view.layer.addSublayer(gradient) 

Uwaga: Dodano ścieżkę bezier na kole, bo to działa bez maski na placu.

Answer 2

myślę, że to

shape.startPoint = CGPoint(x: 1.0, y: 0.0) 
shape.endPoint = CGPoint(x: 0.0, y: 1.0) 

, który jest pierwszy kolor w prawym dolnym rogu do drugiego koloru w lewym górnym rogu. Jeśli chcesz pierwszy kolor w prawym górnym rogu, a drugi kolor na dole po lewej stronie, to należy mieć

shape.startPoint = CGPoint(x: 1.0, y: 1.0) 
shape.endPoint = CGPoint(x: 0.0, y: 0.0) 

pierwszego koloru w górnym rogu drugiego koloru w prawym dolnym

shape.startPoint = NSMakePoint(x: 0.0, y: 1.0) 
shape.endPoint = NSMakePoint(x: 1.0, y: 0.0) 

pierwszy kolor w lewym dolnym rogu, drugi kolor u góry po prawej

shape.startPoint = CGPoint(x: 0.0, y: 0.0) 
shape.endPoint = CGPoint(x: 1.0, y: 1.0)