Question

我需要使用模糊渐变来遮罩图像。

更详细;我希望图片从左边开始，根本没有模糊，右边是模糊的。模糊将开始在某个地方发生。我已经设法将图像完全模糊，但作为单独的图像，但我如何应用模糊的半透明渐变？

UIImageView *bluredImgView = [[UIImageView alloc] initWithImage:img];
bluredImgView.frame = frame;
CAGradientLayer *lay = [CAGradientLayer layer];
lay.frame = bluredImgView.bounds;
lay.colors = [NSArray arrayWithObjects:(id)[[UIColor colorWithWhite: 0.0 alpha: 0.0] CGColor], (id)[[UIColor colorWithWhite: 1.0 alpha: 1.0] CGColor], nil];
lay.startPoint = CGPointMake(0.0f, 0.0f);
lay.endPoint = CGPointMake(1.0f, 0.0f);
bluredImgView.layer.mask = lay;
[_profileImageView addSubview:bluredImgView];

Answer 1

将模糊图像作为单独图层添加到图像视图图层的顶部。然后创建一个CAGradientLayer并将其添加为模糊图像图层上的遮罩层。

Answer 2

使用以下代码：

NSArray *colors = [NSArray arrayWithObjects:(__bridge id)[[UIColor colorWithWhite:0 alpha:0] CGColor], (__bridge id)[[UIColor colorWithWhite:0 alpha:1] CGColor], nil];

CAGradientLayer *gradientLayer = [CAGradientLayer layer];
[gradientLayer setFrame:[bluredImgView bounds]];
[gradientLayer setColors:colors];
[gradientLayer setStartPoint:CGPointMake(0.0f, 0.0f)];
[gradientLayer setEndPoint:CGPointMake(1.0f, 0.0f)];

bluredImgView.layer.mask = gradientLayer;

Answer 3

这个问题相当陈旧但仍然没有。之前的答案都没有将模糊效果与渐变结合起来。

这会从下到上添加效果（标题图片看起来很酷）：

titleImage.image = [UIImage imageNamed: titleImage];


UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];
UIVisualEffectView *view = [[UIVisualEffectView alloc] initWithEffect:effect];
view.frame = titleImage.frame;

UIImageView *bluredImgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:_location.titleImage]];
bluredImgView.frame = _titleImage.frame;
CAGradientLayer *lay = [CAGradientLayer layer];
lay.frame = bluredImgView.bounds;
lay.colors = [NSArray arrayWithObjects:(id)[[UIColor colorWithWhite: 0.0 alpha: 0.0] CGColor], (id)[[UIColor colorWithWhite: 0.0 alpha: 1.0] CGColor], nil];
lay.startPoint = CGPointMake(0.0f, 0.0f);
lay.endPoint = CGPointMake(0.0f, 1.0f);
view.layer.mask = lay;
[titleImage addSubview:view];

应用模糊渐变

3 个答案: