背景梯度：物镜C中从左到右线性

Posted 2023-02-23

【中文标题】背景梯度：物镜C中从左到右线性

【英文标题】：background Gradient : linear left to right in objective C

【发布时间】：2017-02-27 09:54:02

【问题描述】：

我的客户想要具有这种渐变效果的背景视图 背景渐变：rgb(118,118,118) | #ffffff | rgb(198,198,197) 从左到右线性 我已经尝试过这种方式，但它发生在垂直方向我希望它以水平方式发生

UIColor *leftColor = [UIColor colorWithRed:118.0/255.0 green:118.0/255.0 blue:118.0/255.0 alpha:1.0];
UIColor *middleColor = [UIColor colorWithRed:255.0/255.0 green:255.0/255.0 blue:255.0/255.0 alpha:1.0];
UIColor *rightColor = [UIColor colorWithRed:198.0/255.0 green:198.0/255.0 blue:197.0/255.0 alpha:1.0];

// Create the gradient
CAGradientLayer *theViewGradient = [CAGradientLayer layer];
theViewGradient.colors = [NSArray arrayWithObjects: (id)leftColor.CGColor, (id)middleColor.CGColor,(id)rightColor.CGColor, nil];
theViewGradient.frame = self.view.bounds;
//Add gradient to view
[self.view.layer insertSublayer:theViewGradient atIndex:0];

像这样？？

【问题讨论】：

[梯度 setStartPoint:CGPointMake(0, 0)]; [梯度setEndPoint:CGPointMake(0, 1)];添加起点和终点

@harshal valance 它帮助了 ViewGradient.startPoint = CGPointMake(0.0, 0.0); theViewGradient.endPoint = CGPointMake(1.0, 0.0);谢谢

【参考方案1】：

你需要设置你的 gradientLayer 的 startPoint 和 endPoint 属性。它们代表您的第一种颜色的开始坐标和最后一种颜色的结束坐标。

它们都是 CGPoints，它们的 x 和 y 值应该在 0.0 到 1.0 之间。

默认情况下，起点具有这些坐标 (0.5, 0.0)，而终点具有这些坐标 (0.5, 1.0)。

(0.0, 0.0) 是左上角，(1.0, 1.0) 是右下角

那就试试吧：

theViewGradient.startPoint = CGPointMake(0.0, 0.5);
theViewGradient.endPoint = CGPointMake(1.0, 0.5);

【参考方案2】：

在 Swift 3.0 和 4.0 中，从左到右：

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

【参考方案3】：

 **The start and end points of the gradient when drawn into the layer's
 coordinate space. The start point corresponds to the first gradient
 stop, the end point to the last gradient stop. Both points are
 defined in a unit coordinate space that is then mapped to the
 layer's bounds rectangle when drawn. (i.e. [0,0] is the bottom-left
 corner of the layer, [1,1] is the top-right corner.).The default values
 are [.5,0] and [.5,1] respectively.** 

theViewGradient.startPoint = CGPointMake(0.0, 0.5);
theViewGradient.endPoint = CGPointMake(1.0, 0.5);

【参考方案4】：

 enum GradiantDirection 
        case leftToRight
        case rightToLeft
        case topToBottom
        case bottomToTop
    
    
 class  func setGradiantColor(view : UIView, topColor : UIColor, bottomColor:UIColor, cornerRadius : CGFloat = 0.0,gradiantDirection : GradiantDirection = .topToBottom )
    
        
        view.layer.sublayers?.filter $0 is CAGradientLayer .forEach $0.removeFromSuperlayer() 
        
        let gradient: CAGradientLayer = CAGradientLayer()
        gradient.colors = [topColor.cgColor,bottomColor.cgColor]
        gradient.frame = view.bounds
        
        switch gradiantDirection 
        case .topToBottom:
            gradient.startPoint = CGPoint(x: 0.0, y: 0.0)
            gradient.endPoint = CGPoint(x: 0.0, y: 1.0)
        case .bottomToTop:
            gradient.startPoint = CGPoint(x: 1.0, y: 0.5)
            gradient.endPoint = CGPoint(x: 0.0, y: 0.5)
        case .leftToRight:
            gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
            gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
        case .rightToLeft:
            gradient.startPoint = CGPoint(x: 1.0, y: 0.5)
            gradient.endPoint = CGPoint(x: 0.0, y: 0.5)
        
        
        gradient.masksToBounds = true
        let gradientLayer = CAGradientLayer()
        gradientLayer.cornerRadius = cornerRadius
        gradient.rasterizationScale = 100
        view.layer.insertSublayer(gradient, at: 0)