Objective-C - 如何在图像上放置黑色透明

Jav*_*eed 1 iphone objective-c uiimageview uiimage xcode6

我想在图像底部添加黑色透明,如下图所示。在此处输入图片说明

预先感谢您的建议。

Bar*_*bek 5

有几种方法可以实现这种暗渐变。最简单的一种是使用CAGradientLayer像这样

// Create a gradient layer
CAGradientLayer *layer = [CAGradientLayer layer];
// gradient from transparent to black
layer.colors = @[(id)[UIColor clearColor].CGColor, (id)[UIColor blackColor].CGColor];
// set frame to whatever values you like (not hard coded like here of course)
layer.frame = CGRectMake(0.0f, 0.0f, 320.0f, 200.0);
// add the gradient layer as a sublayer of you image view
[imageView.layer addSublayer:layer];
Run Code Online (Sandbox Code Playgroud)

另一种选择是生成一个可拉伸的UIImage并在UIImageView作为子视图添加到原始 的 a 中使用它UIImageView,如下所示:

CGFloat gradientHeight = 200.0f; // set to whatever height you want your gradient to be
CGSize imageSize = CGSizeMake(1.0f, gradientHeight); // image will be stretched so can be 1pt wide

// prepare image with gradient
UIGraphicsBeginImageContextWithOptions(imageSize, NO, 0.0f);
CGContextRef context = UIGraphicsGetCurrentContext();

// gradient from transparent to black
NSArray *colors = @[(id)[UIColor clearColor].CGColor, (id)[UIColor blackColor].CGColor];
CGGradientRef gradient = CGGradientCreateWithColors(CGColorSpaceCreateDeviceRGB(), (CFArrayRef)colors, NULL);
CGContextDrawLinearGradient(context, gradient, CGPointZero, CGPointMake(0.0f, imageSize.height), kCGGradientDrawsAfterEndLocation);
CGGradientRelease(gradient);

// get image from the context
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

// create image view with the gradient image
UIImageView *gradientImageView = [[UIImageView alloc] initWithImage:image];

// set frame height to same value as imageHeight, and width to fill the superview (ignore this hard-coded 320)
gradientImageView.frame = CGRectMake(0.0f, 0.0f, 320.0f, gradientHeight);
// add the gradient image view as a subview to the image view
[imageView addSubview:gradientImageView];
Run Code Online (Sandbox Code Playgroud)

这两个选项都会给你这样的结果: 在此处输入图片说明