14

我希望UIImageView像在 Flipboard 中一样创建一个类似阴影的渐变。

它的一个例子是这张图片中的一张图片

http://taitegallery.net/wp-content/uploads/2012/01/flipboard-iphone.jpg

正如您在右侧 iPhone 上看到的，顶部和底部有一个较暗的渐变。这样如果图片是白色的，仍然可以看到白色文本。

有人对我如何实现这一点有任何建议吗？我是 iOS 开发的新手，因此对此一无所知。谢谢！

4

5 回答 5

20

你可以使用CAGradientLayer：

  1. 将 QuartzCore.framework 添加到您的项目中。（请参阅链接到库或框架）。

  2. 导入 QuartzCore 头文件：

    #import <QuartzCore/QuartzCore.h>

  3. CAGradientLayer在有问题的视图中添加一个。例如，对于从灰色到白色的简单渐变：

    - (void)addGradientToView:(UIView *)view
{
    CAGradientLayer *gradient = [CAGradientLayer layer];
    gradient.frame = view.bounds;
    gradient.colors = @[(id)[[UIColor lightGrayColor] CGColor],
                        (id)[[UIColor whiteColor] CGColor]];
    [view.layer insertSublayer:gradient atIndex:0];
}

    或者从一种灰色阴影到另一种灰色阴影，然后返回：

    - (void)addGradientToView:(UIView *)view
{
    CAGradientLayer *gradient = [CAGradientLayer layer];
    gradient.frame = view.bounds;
    gradient.colors = @[(id)[[UIColor colorWithRed:0.8 green:0.8 blue:0.8 alpha:1.0] CGColor],
                        (id)[[UIColor colorWithRed:0.9 green:0.9 blue:0.9 alpha:1.0] CGColor],
                        (id)[[UIColor colorWithRed:0.8 green:0.8 blue:0.8 alpha:1.0] CGColor]];
    [view.layer insertSublayer:gradient atIndex:0];
}

只需更改数组中的颜色colors即可更改渐变以达到所需的效果。您可能希望将图像视图放在容器视图中并将渐变应用于容器视图，而不是图像视图。此外，这可能很明显，但这假设您在您的使用中使用的图像UIImageView使用透明背景。如果他们不这样做，您将不得不更改它们（a）将渐变构建到图像中；CAGradientLayer或 (b) 用透明度替换图像的背景，以便可以看到上述效果。

于 2013-09-02T03:11:46.770 回答
6

现在这项工作正确地应用到 UIImageView 层

// Set image over layer
CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = imageView.frame;

// Add colors to layer
UIColor *centerColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:0.25];
UIColor *endColor = [UIColor grayColor];
gradient.colors = [NSArray arrayWithObjects:
                               (id)[endColor CGColor],
                               (id)[centerColor CGColor],
                               (id)[endColor CGColor],
                               nil];

[imageView.layer insertSublayer:gradient atIndex:0];

从这里拿走

于 2014-10-09T03:14:29.940 回答
1

斯威夫特 3 

    let gradient = CAGradientLayer()
    gradient.frame = imageView.bounds

    let startColor = UIColor(colorLiteralRed: 0, green: 0, blue: 0, alpha: 0.25)
    let endColor = UIColor.gray

    gradient.colors = [startColor.cgColor, endColor.cgColor]
    imageView.layer.insertSublayer(gradient, at: 0)
于 2016-10-14T13:14:11.680 回答
0

我之前在我的应用程序中完成了这种效果，只需在照片上覆盖一个包含暗区的透明图像。实施方面，这通常意味着UIImageView在视图层次结构中的照片视图上方插入另一个。

于 2013-09-02T02:53:28.387 回答
0

翻译成斯威夫特：

var gradient = CAGradientLayer()
gradient.frame = imageView.bounds                    
let startColor = UIColor(colorLiteralRed: 0, green: 0, blue: 0, alpha: 0.25)
let endColor = UIColor.grayColor()
gradient.colors = [startColor, endColor]
imageView.layer.insertSublayer(gradient, atIndex: 0)
于 2016-08-09T04:50:43.780 回答