CAGradientLayer設定漸變色

weixin_34054866發表於2018-11-21

剛入行的時候,設計就提出漸變效果的需求。但是,當時,技術渣呀,只能被設計吐嘈吐嘈再吐嘈。

後來猶記是為了實現圖片根據季節顏色變換,設計不再寵我了,一定要讓實現漸變的效果。
萬幸啊,後來結識了CAGradientLayer

上程式碼啦

- (void)addTheGradientLayerWithBeginColor:(UIColor *)beginColor
                              andEndColor:(UIColor *)endColor
                                fromPoint:(CGPoint)startPoint
                                 endPoint:(CGPoint)endPoint{
    if (!self.gradientLayer) {
        CAGradientLayer * gradientLayer = [CAGradientLayer layer];
        [self.layer addSublayer:gradientLayer];
        self.gradientLayer = gradientLayer;
    }
    //設定漸變色區域
    self.gradientLayer.frame = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);
    //設定漸變色的顏色組
    self.gradientLayer.colors = @[(__bridge id)beginColor.CGColor, (__bridge id)endColor.CGColor];
    //設定漸變顏色方向,左上點為(0,0), 右下點為(1,1)
    self.gradientLayer.startPoint = startPoint;
    self.gradientLayer.endPoint = endPoint;
}

你以為CAGradientLayer只能實現漸變很一般的效果,但是結合CAShapeLayer可實現如下這些效果還是蠻讚的

1122152-223d56733bed8c16.gif
網路圖片,侵刪1.gif
1122152-3632a9a3a63bc210.gif
網路圖片,侵刪2.gif

相關文章