ios - swift 3 : URL Image makes UITableView scroll slow issue

Question

我有一个扩展程序可以在 UIImageView 上打印图像 URL。但我认为问题是我的 tableView 因为这个扩展太慢了。我想我需要为它打开线程。我如何在此扩展中创建线程，或者您知道解决此问题的另一种解决方案吗？

我的代码:

extension UIImageView{

    func setImageFromURl(stringImageUrl url: String){

        if let url = NSURL(string: url) {
            if let data = NSData(contentsOf: url as URL) {
                self.image = UIImage(data: data as Data)
            }
        }
    }
}

Answer 1

您可以使用此处建议的框架，但您也可以考虑“滚动您自己的”扩展，如this article 中所述。

你需要做的“全部”是:

1. 使用 URLSession 下载您的图片，这是在后台线程上完成的，因此不会出现卡顿和缓慢的滚动。
2. 完成后，在主线程上更新 ImageView 。

拿一个

第一次尝试可能看起来像这样:

func loadImage(fromURL urlString: String, toImageView imageView: UIImageView) {
    guard let url = URL(string: urlString) else {
        return
    }

    //Fetch image
    URLSession.shared.dataTask(with: url) { (data, response, error) in
        //Did we get some data back?
        if let data = data {
            //Yes we did, update the imageview then
            let image = UIImage(data: data)
            DispatchQueue.main.async {
                imageView.image = image
            }
        }
    }.resume() //remember this one or nothing will happen :)
}

然后你像这样调用这个方法:

loadImage(fromURL: "yourUrlToAnImageHere", toImageView: yourImageView)

改进

如果您愿意，您可以添加一个 UIActivityIndi​​catorView 来向用户显示“正在加载某些内容”，如下所示:

func loadImage(fromURL urlString: String, toImageView imageView: UIImageView) {
    guard let url = URL(string: urlString) else {
        return
    }

    //Add activity view
    let activityView = UIActivityIndicatorView(activityIndicatorStyle: .gray)
    imageView.addSubview(activityView)
    activityView.frame = imageView.bounds
    activityView.translatesAutoresizingMaskIntoConstraints = false
    activityView.centerXAnchor.constraint(equalTo: imageView.centerXAnchor).isActive = true
    activityView.centerYAnchor.constraint(equalTo: imageView.centerYAnchor).isActive = true
    activityView.startAnimating()

    //Fetch image
    URLSession.shared.dataTask(with: url) { (data, response, error) in
        //Done, remove the activityView no matter what
        DispatchQueue.main.async {
            activityView.stopAnimating()
            activityView.removeFromSuperview()
        }

        //Did we get some data back?
        if let data = data {
            //Yes we did, update the imageview then
            let image = UIImage(data: data)
            DispatchQueue.main.async {
                imageView.image = image
            }
        }
    }.resume() //remember this one or nothing will happen :)
}

扩展

文章中提到的另一个改进可能是将其移动到 UIImageView 上的 extension，如下所示:

extension UIImageView {
    func loadImage(fromURL urlString: String) {
        guard let url = URL(string: urlString) else {
            return
        }

        let activityView = UIActivityIndicatorView(activityIndicatorStyle: .gray)
        self.addSubview(activityView)
        activityView.frame = self.bounds
        activityView.translatesAutoresizingMaskIntoConstraints = false
        activityView.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
        activityView.centerYAnchor.constraint(equalTo: self.centerYAnchor).isActive = true
        activityView.startAnimating()

        URLSession.shared.dataTask(with: url) { (data, response, error) in
            DispatchQueue.main.async {
                activityView.stopAnimating()
                activityView.removeFromSuperview()
            }

            if let data = data {
                let image = UIImage(data: data)
                DispatchQueue.main.async {
                    self.image = image
                }
            }
        }.resume()
    }
}

基本上它与以前的代码相同，但对 imageView 的引用已更改为 self。

你可以这样使用它:

yourImageView.loadImage(fromURL: "yourUrlStringHere")

当然...将 SDWebImage 或 Kingfisher 作为依赖项包含在内速度更快，而且大多数时候“都能正常工作”，而且它还能为您带来其他好处，例如图像缓存等。但我希望这个例子表明，为图像编写自己的扩展并没有那么糟糕……而且当它不工作时你知道应该责怪谁；)

希望对你有帮助。