在 UIImageView 上添加渐变 [英] Add a gradient on UIImageView

问题描述

我试图在我的 UIImageView 上添加一个子层，但它不起作用.

I am trying to add a sublayer on my UIImageView but it doesn't work.

• 我有一组从 photo0 到 photo9 命名的 10 张图片，我显示它带有5秒的计时器.
• 出口shanghaiImage是我的背景

• I have a set of 10 images named from photo0 to photo9 and I display it with a timer of 5s.
• The outlet shanghaiImage is my background

我想在这个马蒂的顶部添加一个渐变，比如:透明(顶部)到黑色(底部).

I would like to add a gradient on top of this marty like: transparent (top) to black (bottom).

谢谢你的帮助:)

这是我在 Swift 3 中的代码.

Here is my code in Swift 3.

这部分很好:

import UIKit

class ViewController: UIViewController {

@IBOutlet weak var shanghaiImage: UIImageView!

// beginning index
var _curentImageIndex:Int = 0
// number of images
let NUMBER_OF_IMAGES:Int = 10
// creation of the Timer
var _uiTimer:Timer?


override func viewDidLoad() {
    super.viewDidLoad()
    showPhoto(atIndex: _curentImageIndex)
}

// MARK TIMER ---------

func selectNewTimer(){
    if let existingTimer:Timer = _uiTimer{
        existingTimer.invalidate()
    }
    _uiTimer = Timer.scheduledTimer(timeInterval: 5, target: self, selector: #selector(ViewController.showNextImage), userInfo: nil, repeats: true)
}

问题就在这里.我不知道为什么它不起作用.

It's here where there is a problem. I don't know why it's not working.

// MARK PHOTO ---------
func showPhoto(atIndex index:Int){

    let photoName:String =  "photo(index)"
    shanghaiImage.image =  UIImage(named: photoName)

    let gradient = CAGradientLayer()
    gradient.frame = shanghaiImage.bounds
    let startColor = UIColor(colorLiteralRed: 0, green: 0, blue: 0, alpha: 1)
    let endColor = UIColor.black

    gradient.colors = [startColor, endColor]
    shanghaiImage.layer.insertSublayer(gradient, at: 0)


    _curentImageIndex  =  index
    selectNewTimer()
    }

func showNextImage() {
    var nextPhotoIndex:Int = _curentImageIndex + 1
        if nextPhotoIndex >= NUMBER_OF_IMAGES {
            nextPhotoIndex = 0
        }
    showPhoto(atIndex: nextPhotoIndex)
}


override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}
}

推荐答案

我建议在 UIImageView 顶部放置一个带有渐变的 UIView :

I would suggest putting a UIView with the gradient on top of the UIImageView:

@IBOutlet weak var shanghaiImage: UIImageView!

let view = UIView(frame: profileImageView.frame)

let gradient = CAGradientLayer()

gradient.frame = view.frame

gradient.colors = [UIColor.clear.cgColor, UIColor.black.cgColor]

gradient.locations = [0.0, 1.0]

view.layer.insertSublayer(gradient, at: 0)

shanghaiImage.addSubview(view)

shanghaiImage.bringSubview(toFront: view)

目标-C:

UIView *view = [[UIView alloc] initWithFrame: profileImageView.frame];

CAGradientLayer *gradient = [[CAGradientLayer alloc] init];

gradient.frame = view.frame;

gradient.colors = @[ (id)[[UIColor clearColor] CGColor], (id)[[UIColor blackColor] CGColor] ];

gradient.locations = @[@0.0, @1.0];

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

[shanghaiImage addSubview: view];

[shanghaiImage bringSubviewToFront: view];

这篇关于在 UIImageView 上添加渐变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！