在ios中绘制图像的渐变

如何以编程方式创建渐变颜色,如下图所示。

在此处输入图像描述

当你说“将它作为渐变应用于图像”时,你的意思是作为一个面具(在顶部显示图像,让图像在底部淡化为透明)? 如果是这种情况,您可以使用CAGradientLayer将该渐变应用为蒙CAGradientLayer

 CAGradientLayer *gradientMask = [CAGradientLayer layer]; gradientMask.frame = self.imageView.bounds; gradientMask.colors = @[(id)[UIColor whiteColor].CGColor, (id)[UIColor clearColor].CGColor]; self.imageView.layer.mask = gradientMask; 

以上是一个简单的垂直渐变(因为默认是垂直,线性渐变)。 但是您询问了startPointendPointlocations 。 例如,如果您希望水平应用蒙版,则可以执行以下操作:

 gradientMask.startPoint = CGPointMake(0.0, 0.5); // start at left middle gradientMask.endPoint = CGPointMake(1.0, 0.5); // end at right middle 

如果你想要两个渐变,一个在前10%,另一个在最后10%,你会做:

 gradientMask.colors = @[(id)[UIColor clearColor].CGColor, (id)[UIColor whiteColor].CGColor, (id)[UIColor whiteColor].CGColor, (id)[UIColor clearColor].CGColor]; gradientMask.locations = @[@0.0, @0.10, @0.90, @1.0]; 

如果您想要一个简单的渐变(而不是遮罩),您可以创建一个view ,然后将渐变图层添加到它:

 CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = view.bounds; gradient.colors = @[(id)[UIColor whiteColor].CGColor, (id)[UIColor blackColor].CGColor]; [view.layer addSublayer:gradient]; 

请参阅CAGradientLayer 类参考 。

我刚刚为Swift 2.0编写了一个UIImage扩展。 也许它有一些用处。 您可以使用UIColor(任意数字)数组和应绘制渐变的框架来调用它。

 extension UIImage { class func convertGradientToImage(colors: [UIColor], frame: CGRect) -> UIImage { // start with a CAGradientLayer let gradientLayer = CAGradientLayer() gradientLayer.frame = frame // add colors as CGCologRef to a new array and calculate the distances var colorsRef = [CGColor]() var locations = [NSNumber]() for i in 0 ... colors.count-1 { colorsRef.append(colors[i].CGColor as CGColorRef) locations.append(Float(i)/Float(colors.count-1)) } gradientLayer.colors = colorsRef gradientLayer.locations = locations // now build a UIImage from the gradient UIGraphicsBeginImageContext(gradientLayer.bounds.size) gradientLayer.renderInContext(UIGraphicsGetCurrentContext()!) let gradientImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() // return the gradient image return gradientImage } } 

这样叫:

 let colors = [ UIColor.blueColor(), UIColor.greenColor() // and many more if you wish ] let gradientImage = UIImage.convertGradientToImage(colors, frame: navigationBar.bounds) 

并申请:

 .backgroundColor = UIColor(patternImage: gradientImage) 

要么

 .setBackgroundImage(gradientImage, forBarMetrics: .Default) 
 CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.frame = self.view.bounds; gradient.startPoint = CGPointMake(1.0, 1.0); //Dark From bottom gradient.endPoint = CGPointMake(1.0, 0); gradient.colors = [NSArray arrayWithObjects: (id)[[UIColor blackColor] CGColor], (id)[[UIColor clearColor] CGColor], nil]; [self.view.layer insertSublayer:gradient atIndex:0]; 

这是最好的方法,根据要求为我工作

 CAGradientLayer *gradientLayer = [CAGradientLayer layer]; gradientLayer.frame = yourImageView.layer.bounds; gradientLayer.colors = [NSArray arrayWithObjects: (id)[UIColor colorWithWhite:1.0f alpha:1.0f].CGColor, (id)[UIColor colorWithWhite:0.0f alpha:0.9f].CGColor, nil]; gradientLayer.locations = [NSArray arrayWithObjects: [NSNumber numberWithFloat:0.0f], [NSNumber numberWithFloat:1.0f], nil]; [yourImageView.layer addSublayer:gradientLayer]; 
 -(void) drawGradientinBounds: (CGRect) currentBounds withColors:(NSArray*) colors andPercentages:(NSArray *)percentages andGradientDirectionIsVertical:(BOOL)isGradientDirectionVertical { CGContextRef currentContext = UIGraphicsGetCurrentContext(); CGGradientRef glossGradient; CGColorSpaceRef rgbColorspace; size_t num_locations = [percentages count]; CGFloat locations[num_locations]; for(int i=0;i=0;i--) { comps--; UIColor *c = [colors objectAtIndex:i]; const CGFloat *cg = CGColorGetComponents([c CGColor]); components[comps] = cg[3]; comps--; components[comps] = cg[2]; comps--; components[comps] = cg[1]; comps--; components[comps] = cg[0]; } rgbColorspace = CGColorSpaceCreateDeviceRGB(); glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations); CGPoint topCenter; CGPoint endCenter; if(isGradientDirectionVertical) { topCenter = CGPointMake(CGRectGetMidX(currentBounds), currentBounds.origin.y); endCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetHeight(currentBounds)+currentBounds.origin.y); } else { topCenter = CGPointMake( currentBounds.origin.x,CGRectGetMidY(currentBounds)); endCenter = CGPointMake(CGRectGetWidth(currentBounds)+currentBounds.origin.x,CGRectGetMidY(currentBounds)); } CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, endCenter, 0); CGGradientRelease(glossGradient); CGColorSpaceRelease(rgbColorspace); } 

并且此方法的输入是bounds,colorArray:

 [NSArray arrayWithObjects:[UIColor blackColor], [UIColor whiteColor], nil] 

percentageArray:

 [NSArray arrayWithObjects:[NSNumber numberWithFloat:0.0], [NSNumber numberWithFloat:1.0], nil] 
Interesting Posts