如何在图片上实现 alpha 渐变？

Question

我想在图片上实现alpha渐变，从图像顶部的0.5 alpha到底部的0.0 alpha。欢迎提供任何建议、教程或链接。

- Alex Terente

---

你想修改原始图像还是只关心它是否以渐变方式显示？ - nielsbot

我只想在图像下方显示一个渐变。 - Alex Terente

Anomie已经在他的回答中涵盖了这个案例。 - nielsbot

如果我既想显示图像又想保存修改后的副本，该怎么办？ - Pablosproject

Answer 1

您可以使用CGImageCreateWithMask来应用掩膜图像。您可以通过在灰度或仅 Alpha 的 CGBitmapContext 中绘制 CGContextDrawLinearGradient 来生成适当的掩膜。

如果它作为 CALayer 的内容显示，您可以将适当的掩膜层应用到父图层的mask属性中。您可以使用适当的颜色创建一个CAGradientLayer来创建此掩膜层。

您可以将图像绘制到 CGBitmapContext 中，然后使用kCGBlendModeDestinationIn在其上绘制适当的 alpha 梯度。或者先绘制渐变，然后使用kCGBlendModeSourceIn在其上绘制图像。在这两种情况下，CGContextDrawLinearGradient 再次发挥了作用。然后，当然要使用CGBitmapContextCreateImage 或基于数据缓冲区的CGImageCreate从CGContext中获取图像。

当然，如果您控制原始图像并且永远不需要没有 alpha 渐变版本，您可以将其存储为带有适当 alpha 值的 PNG。

- Anomie

Answer 2

您可以尝试使用 CAGradientLayer。

UIView *view = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)] autorelease];
 CAGradientLayer *gradient = [CAGradientLayer layer];
 gradient.frame = view.bounds;
 gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)[[UIColor whiteColor] CGColor], nil];
 [view.layer insertSublayer:gradient atIndex:0];

另一种选择

尝试在此之前的SO问题中由@Caleb建议的答案。

您可以使用Graphics Contexts。 所有绘图都发生在图形上下文中。如果您想创建具有径向渐变、线性渐变或其他任何效果的图像，则需要：

• 使用
  UIGraphicsBeginImageContextWithOptions为图像创建图形上下文。
• 进行您想要出现在图像中的任何绘图。
• 调用UIGraphicsGetImageFromCurrentImageContext从上下文获取图像。
  这会给您一个UIImage，因此无需从CGImage转换。
• 调用UIGraphicsEndImageContext清除上下文。

您还可以查看UImage上的径向渐变

- visakh7

Answer 3

通过逐行读取现有图像中的像素（获取它们的RGBA），并将它们添加到具有相同RGB值但按每行调整alpha值的新图像中，创建一个新图像。

以下是其他一些SO问题，应该为您提供所需的一切：

如何从UIImage（Cocoa Touch）或CGImage（Core Graphics）中获取像素数据？

我可以编辑UIImage的属性CGImage的像素吗？

- Michael Behan

---

虽然这样做可以实现功能，但使用核心图形库可能会更慢。别忘了，如果你使用预乘 alpha，还需要调整 RGB 值。 - Anomie

Answer 4

我在这里发现了一些东西，它很棒！

AlphaGradientView* gradient = [[AlphaGradientView alloc] initWithFrame:
                           CGRectMake(self.view.frame.size.width - 150, 0, 150, 
                                                self.view.frame.size.height)];

gradient.color = [UIColor yellowColor];
gradient.direction = GRADIENT_RIGHT;
[self.view addSubview:gradient]; 

- Winter