Core Graphic iPhone的透明(alpha)渐变

时间:2012-08-04 10:30:12

标签: ios core-graphics gradient alpha

任何人都知道如何以核心图形在图像上以编程方式创建透明渐变(alpha渐变)? 我需要它来显示图像并保存它。

我想要获得的一个例子: enter image description here

3 个答案:

答案 0 :(得分:42)

您可以使用QuartzCore将遮罩(具有渐变透明度)应用于UIImageView:

UIImageView *myImageView = ["the image view"];
CAGradientLayer *l = [CAGradientLayer layer];
l.frame = myImageView.bounds;
 l.colors = [NSArray arrayWithObjects:(id)[[UIColor colorWithRed:0 green:0 blue:0 alpha:0] CGColor], (id)[[UIColor colorWithRed:0 green:0 blue:0 alpha:1] CGColor], nil];

l.startPoint = CGPointMake(0.0, 0.0f);
l.endPoint = CGPointMake(1.0f, 1.0f);

//you can change the direction, obviously, this would be top to bottom fade
myImageView.layer.mask = l; 

要保存它,您可以在Stack Overflow上轻松找到答案,只需搜索如何将画布内容保存到UIImage。

或@Zazu要求的Swift版本:

// Whatever you image view is, obviously not hardcoded like this
let imageView = UIImageView.init(image: UIImage(named: "Image"))
imageView.frame = CGRectMake(0, 0, 320, 480)
self.view.addSubview(imageView)
// Create the gradient layer
let gradientLayer = CAGradientLayer.init()
gradientLayer.frame = imageView.bounds
gradientLayer.colors = [
    UIColor.init(colorLiteralRed: 0, green: 0, blue: 0, alpha: 0).CGColor,
    UIColor.init(colorLiteralRed: 0, green: 0, blue: 0, alpha: 1).CGColor]
// Whatever direction you want the fade. You can use gradientLayer.locations
// to provide an array of points, with matching colors for each point, 
// which lets you do other than just a uniform gradient.
gradientLayer.startPoint = CGPointMake(1.0, 0.0);
gradientLayer.endPoint = CGPointMake(0.0, 0.0);
// Use the gradient layer as the mask
imageView.layer.mask = gradientLayer;

答案 1 :(得分:3)

我不知道渐变的核心图形解决方案,但是如果你可以在Photoshop中制作一个图像,它在右边开始白色并在左边渐变为alpha,你就可以将它覆盖在内容图像的顶部

覆盖图像,您可以执行类似

的操作
+ (UIImage*) addFadeOutToImage:(UIImage*)sourceImage
{
   UIGraphicsBeginImageContext(sourceImage.size);

   [sourceImage drawAtPoint:CGPointZero];

   UIImage* fadeAlphaImage = [UIImage imageNamed:@"fadedAlphaImage.png"];

   CGPoint fadeOutStartPoint = CGPointMake(sourceImage.size.width - fadeAlphaImage.size.width, 0);
   //assumes the fade image is the same height as the source
   [fadeAlphaImage drawAtPoint:fadeOutStartPoint];

   UIImage* fadeOutImage = UIGraphicsGetImageFromCurrentImageContext();
   UIGraphicsEndImageContext();

   return fadeOutImage;
}

此代码改编自this question

或@Zazu要求的Swift版本:

// Whatever you image view is, obviously not hardcoded like this
let imageView = UIImageView.init(image: UIImage(named: "Image"))
imageView.frame = CGRectMake(0, 0, 320, 480)
self.view.addSubview(imageView)
// Create the gradient layer
let gradientLayer = CAGradientLayer.init()
gradientLayer.frame = imageView.bounds
gradientLayer.colors = [
    UIColor.init(colorLiteralRed: 0, green: 0, blue: 0, alpha: 0).CGColor,
    UIColor.init(colorLiteralRed: 0, green: 0, blue: 0, alpha: 1).CGColor]
// Whatever direction you want the fade. You can use gradientLayer.locations
// to provide an array of points, with matching colors for each point, 
// which lets you do other than just a uniform gradient.
gradientLayer.startPoint = CGPointMake(1.0, 0.0);
gradientLayer.endPoint = CGPointMake(0.0, 0.0);
// Use the gradient layer as the mask
imageView.layer.mask = gradientLayer;

答案 2 :(得分:3)

Swift 3 - 这对我有用。我只需要20%的底部图像透明渐变。

    // Create the gradient layer
    let gradientLayer = CAGradientLayer()
    gradientLayer.frame = imageView.bounds

    gradientLayer.colors = [
        UIColor.white.withAlphaComponent(1).cgColor,
        UIColor.white.withAlphaComponent(0).cgColor]
    // Whatever direction you want the fade. You can use gradientLayer.locations
    // to provide an array of points, with matching colors for each point,
    // which lets you do other than just a uniform gradient.
    gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.80)
    gradientLayer.endPoint = CGPoint(x: 0.0, y: 1.0)
    // Use the gradient layer as the mask
    imageView.layer.mask = gradientLayer

enter image description here