iOS - Градиент рисования - Swift

Question

Я пытаюсь нарисовать градиент для UILabel, но он рисует только цвета, которые я не вижу в тексте. Я видел код здесь StackOverflow

моя модификация:

extension String{ 
    func gradient(x:CGFloat,y:CGFloat, fontSize:CGFloat)->UIImage{ 
     let font:UIFont = UIFont.systemFontOfSize(fontSize) 
     let name:String = NSFontAttributeName 
     let textSize: CGSize = self.sizeWithAttributes([name:font]) 
     let width:CGFloat = textSize.width   // max 1024 due to Core Graphics limitations 
     let height:CGFloat = textSize.height  // max 1024 due to Core Graphics limitations 
     UIGraphicsBeginImageContext(CGSizeMake(width, height)) 
     let context = UIGraphicsGetCurrentContext() 
     UIGraphicsPushContext(context!) 
     //draw gradient 
     let glossGradient:CGGradientRef? 
     let rgbColorspace:CGColorSpaceRef? 
     let num_locations:size_t = 2 
     let locations:[CGFloat] = [ 0.0, 1.0 ] 
     let components:[CGFloat] = [(202/255.0), (197/255.0), (52/255.0), 1.0, // Start color 
      (253/255.0), (248/255.0), (101/255.0), 1.0] // End color 
     rgbColorspace = CGColorSpaceCreateDeviceRGB() 
     glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations) 
     let topCenter = CGPointMake(0, 0); 
     let bottomCenter = CGPointMake(0, textSize.height); 
     CGContextDrawLinearGradient(context, glossGradient, topCenter, bottomCenter, CGGradientDrawingOptions.DrawsBeforeStartLocation) 
     UIGraphicsPopContext() 
     let gradientImage = UIGraphicsGetImageFromCurrentImageContext() 
     UIGraphicsEndImageContext() 
     return gradientImage 
    } 
} 

и установка на ImageView

self.timeLeftIV = UIImageView(frame: CGRectMake(self.pyramidFakeView.frame.origin.x/2-25,0, 100,20)) 
    self.timeLeftIV.image = "59:48".gradient(timeLeftIV.frame.origin.x, y: timeLeftIV.frame.origin.y, fontSize: 6.0) 

Результат кода:

Answer 1

Существует более простой способ получения градиента как UIImage. Вы можете использовать CAGradientLayer. Например:

func yellowGradientImage(bounds:CGRect) -> UIImage 
{ 
    let gradientLayer = CAGradientLayer() 
    gradientLayer.colors = [UIColor(red: (202/255.0), green: (197/255.0), blue: (52/255.0), alpha: 1.0).CGColor, UIColor(red: (253/255.0), green: (248/255.0), blue: (101/255.0), alpha: 1.0).CGColor] 
    gradientLayer.bounds = bounds 
    UIGraphicsBeginImageContextWithOptions(gradientLayer.bounds.size, true, 0.0) 
    let context = UIGraphicsGetCurrentContext() 
    gradientLayer.renderInContext(context!) 
    let image = UIGraphicsGetImageFromCurrentImageContext() 
    UIGraphicsEndImageContext() 
    return image 
} 

Чтобы применить градиент к тексту Далее вам нужно использовать изображение возвращается как textColor с помощью UIColor(patternImage: ...). Например:

let label = UILabel() 
label.font = UIFont.systemFontOfSize(150.0) 
label.text = "HELLO WORLD" 
label.sizeToFit() 

let image = yellowGradientImage(label.bounds) 
label.textColor = UIColor(patternImage: image) 

что приводит:

быстры 3,0:

func yellowGradientImage(bounds:CGRect) -> UIImage 
{ 
    let gradientLayer = CAGradientLayer() 
    gradientLayer.colors = [UIColor(red: (202/255.0), green: (197/255.0), blue: (52/255.0), alpha: 1.0).cgColor, UIColor(red: (253/255.0), green: (248/255.0), blue: (101/255.0), alpha: 1.0).cgColor] 
    gradientLayer.bounds = bounds 
    UIGraphicsBeginImageContextWithOptions(gradientLayer.bounds.size, true, 0.0) 
    let context = UIGraphicsGetCurrentContext() 
    gradientLayer.render(in: context!) 
    let image = UIGraphicsGetImageFromCurrentImageContext() 
    UIGraphicsEndImageContext() 
    return image! 
} 

let label = UILabel() 
label.font = UIFont.systemFont(ofSize: 150.0) 
label.text = "HELLO WORLD" 
label.sizeToFit() 

let image = yellowGradientImage(bounds: label.bounds) 
label.textColor = UIColor(patternImage: image) 

Answer 2

добавить вид , измените draw rect с помощью кода ниже.

override func drawRect(rect: CGRect) { 
     // Drawing code 

     let currentContext = UIGraphicsGetCurrentContext() 

     CGContextSaveGState(currentContext); 
     let colorSpace = CGColorSpaceCreateDeviceRGB() 

     let startColor = UIColor(red: 0.1, green: 0.0, blue: 0.0, alpha: 0.0) 
     let startColorComponents = CGColorGetComponents(startColor.CGColor) 
     let middleColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.2) 
     let middleColorComponents = CGColorGetComponents(middleColor.CGColor) 
     let lowerMiddleColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.3) 
     let lowerMiddleColorComponents = CGColorGetComponents(lowerMiddleColor.CGColor) 
     let endColor = UIColor(red: 0.0, green: 0.0, blue: 0.0, alpha: 0.5) 
     let endColorComponents = CGColorGetComponents(endColor.CGColor) 

     var colorComponents = [startColorComponents[0], startColorComponents[1], startColorComponents[2], startColorComponents[3], middleColorComponents[0], middleColorComponents[1], middleColorComponents[2], middleColorComponents[3], lowerMiddleColorComponents[0], lowerMiddleColorComponents[1], lowerMiddleColorComponents[2], lowerMiddleColorComponents[3], endColorComponents[0], endColorComponents[1], endColorComponents[2], endColorComponents[3]] 
     var locations:[CGFloat] = [0.0, 0.6, 0.8, 1.0] 
     let gradient = CGGradientCreateWithColorComponents(colorSpace,&colorComponents,&locations,4) 
     let startPoint = CGPointMake(0, 0) 
     let endPoint = CGPointMake(0, self.bounds.height) 
     CGContextAddRect(currentContext, CGRect(x: 0, y: 0, width: self.bounds.width, height: self.bounds.height)); 
     CGContextClip(currentContext); 
     CGContextDrawLinearGradient(currentContext,gradient,startPoint,endPoint, CGGradientDrawingOptions.DrawsBeforeStartLocation) 
     CGContextRestoreGState(currentContext) 
    } 

Теперь в раскадровке добавьте класс изменения вида в класс градиента и добавьте метку к этому представлению.

Посмотрите, подходит ли это для вас.