从 Api Url 下载图像并使用 Alamofire 在集合视图中快速显示

Posted

技术标签:

【中文标题】从 Api Url 下载图像并使用 Alamofire 在集合视图中快速显示【英文标题】:Download Image from Api Url and show in Collection view in swift using Alamofire 【发布时间】:2016-06-23 11:13:49 【问题描述】:

我已经能够从 Api 中获取 Json 格式的 url。但这一个是图片网址。现在我怎样才能从 url 下载该图像并在集合视图中显示。我有

代码

 override func viewDidLoad() 
    super.viewDidLoad()

    Alamofire.request(.GET, "http://\(platform).eposapi.co.uk/?app_id=\(apiID)&app_key=\(apikey)&request=&request=gallery", parameters: nil)
        .responseJSON  response in
            print(response.request)  // original URL request
            print(response.response) // URL response
            print(response.data)     // server data
            print(response.result)   // result of response serialization

            if let JSON = response.result.value 
                print("JSON: \(JSON)")

                   self.imageData = JSON as! Array<AnyObject>
                   print(self.imageData)
                   print("total number of images = \(self.imageData.count)")
                   for image in self.imageData
                   print(image)
            



    

JSON 中的所有图片 url 都来了。我能看到它。现在如何从该 url 下载图像并在集合视图中显示。请告诉任何人我如何在这里申请。

我得到的图片网址是:

[http://chicoshorwich.com/img/14517241531454.jpg,http://chicoshorwich.com/img/14517241944082.jpg, http://chicoshorwich.com/img/14517273984235.jpg, http://chicoshorwich.com/img/14517274885779.jpg,http://chicoshorwich.com/img/1451727556453.jpg,http://chicoshorwich.com/img/14614027267627.jpg,http://chicoshorwich.com/img/14517278515475.jpg,http://chicoshorwich.com/img/14614068518289.jpg,http://chicoshorwich.com/img/14616123258824.jpg,http://chicoshorwich.com/img/14614027528137.jpg,http://chicoshorwich.com/img/14517344227700.jpg,http://chicoshorwich.com/img/1461402768681.jpg,http://chicoshorwich.com/img/14614028323203.jpg,http://chicoshorwich.com/img/14614029485351.jpg,http://chicoshorwich.com/img/14614029565341.jpg,http://chicoshorwich.com/img/14614068296679.jpg] 图片总数 = 16

请说出解决办法。

【问题讨论】:

这将有助于***.com/questions/2499176/… 你能快速发送@SubinKKuriakose 使用 Alamofire 更容易。你不能在你的项目中使用 Alamofire 吗?如果可以,那真的很容易。 好的,然后使用 Alamofire 发送一个链接来解决这个问题。@Ccr 我已经用 alamofire 编辑了代码。现在你能告诉我如何从即将到来的 url @Ccr 下载图像 【参考方案1】:

使用我的代码。这是我认为根据您的数据准确回答的问题。我在你的代码中编辑了一些东西。试试吧。

代码

         Alamofire.request(.GET, "http://\(platform).eposapi.co.uk/?app_id=\
        (apiID)&app_key=\(apikey)&request=&request=gallery", parameters: nil)
        .responseJSON  response in
                       print(response.request)  // original URL request
                       print(response.response) // URL response
                       // print(response.data)     // server data
                       print(response.result)   // result of response serialization

                    if let JSON = response.result.value 
                        print("JSON: \(JSON)")

                        self.imageData = JSON as! Array<String>
                        print(self.imageData)
                        print("total number of images = \(self.imageData.count)\n")
                        for image in self.imageData
                        print(image)
                    
                        dispatch_async(dispatch_get_main_queue()) 
                            self.GalleryCollectionView.reloadData()
                        


                 

现在创建一个名为“GalleryCollectionViewCell”的自定义 Collectionviewcell 并将其添加到“cellForItemAtIndexPath”方法中

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell 
    let cell = collectionView.dequeueReusableCellWithReuseIdentifier("Gallerycell", forIndexPath: indexPath) as! GalleryCollectionViewCell


    let url = NSURL(string: imageData[indexPath.row])
    cell.galleryImageView.af_setImageWithURL(url!, placeholderImage: UIImage(named: "logo.png"), filter: nil,  imageTransition: .CrossDissolve(0.5), runImageTransitionIfCached: true, completion: nil)


return cell

在“占位符”上,从资产中获取任何加载器图像。我在这里使用了 logo.png。你可以拿走你的。

【讨论】:

哦,是的,谢谢它的工作原理。实际上问题出在 reload() 期间。我没有添加它,这就是为什么 imageData 的倒计时仍然为零并且什么也没发生。 你好@PRADIPKUMAR @PoojaSrivastava // 将 self.imageData 声明为 Array 在顶部,然后使用它...你的响应数据是什么......显示你的响应数据......或者更好地向你发布问题您添加的代码,然后 ping 我 .. 响应 = 代码 = 200; radioList = ( "genre_name" = ( "genre_id" = 1; "genre_name" = Country; ); "radio_des" = "Lee Brice - Love Like Crazy"; "radio_img" = "dousic.com/uploads/s48937q.png"; 让 components=URLComponents(url:url,resolvingAgainstBaseURL: true)!让 params = ["user_id":"16"] Alamofire.request(url, method: .post, parameters: params, encoding: URLEncoding.default).responseJSON response in var err:Error? switch response.result case .success(let value): let json = JSON(value) if let resData = json["response"]["radioList"].array self.array_RadioList = resData self.tbl_home.reloadData() case .failure(let error): err = error【参考方案2】:

你可以一个一个调用所有图片的URL

//define your dispatch queue

    private let downloadQueue = dispatch_queue_create("ru.downloadimage.downloadQueue", nil)

//Define also this
private var photos = [NSURL]()

// Add your URL here like this or you can do as per your choice
if let urls = jsonDictionary.valueForKeyPath("download data") as? [String] 
                for (i, url) in urls.enumerate() 
                    photos.append(NSURL(string: url)!)
                
            

这是此处的图片下载块代码

// Define the cache variable first 
private var cache = NSCache()



// MARK: - Private

    private func downloadPhoto(url: NSURL, completion: (url: NSURL, image: UIImage) -> Void) 
        dispatch_async(downloadQueue,  () -> Void in
            if let data = NSData(contentsOfURL: url) 
                if let image = UIImage(data: data) 
                    dispatch_async(dispatch_get_main_queue(),  () -> Void in
                        self.cache.setObject(image, forKey: url)
                        completion(url: url, image: image)
                    )
                
            
        )
    

像这样从集合视图调用这个函数

override func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCellWithReuseIdentifier(cellIdentifier, forIndexPath: indexPath) as! PhotoCell
        let url = photos[indexPath.item]
        let image = cache.objectForKey(url) as? UIImage

        cell.imageView.backgroundColor = UIColor(white: 0.95, alpha: 1)
        cell.imageView.image = image

        if image == nil 
            downloadPhoto(url, completion:  (url, image) -> Void in
                let indexPath_ = collectionView.indexPathForCell(cell)
                if indexPath.isEqual(indexPath_) 
                    cell.imageView.image = image
                
            )
        

        return cell
    

【讨论】:

在你的代码中什么类型的项目和下载队列在这里没有这样的描述@Anand 请详细说明,只有我才能在我的代码中应用它 我不能在这里写完整我在这里给你提示尝试使更容易,我对代码进行了更改,以便你可以轻松理解。 “item”在你的 json 数据字典中,获取图像数组并将其放入 NSURL 数组中,此代码易于应用且易于理解。 如果您再次遇到任何问题,请告诉我,我会尽力解决您的问题。 我在这里让路。如何做这件事取决于你和你如何理解这段代码。【参考方案3】:

如果你有 imageURL,用 Alamofire 很容易下载图片。

确保您已安装 import AlamofireImage pod 并且您已安装

import AlamofireImage

    Alamofire.request(.GET, url) // url is string here.
                .responseImage  response in 
                    if let image = response.result.value 
                        // image is here. 
                    else
                        // check what happned.
                    
            

更多信息可以找到@https://github.com/Alamofire/AlamofireImage

【讨论】:

那很好,但这里不是 url 作为字符串,我有对象数组..所以我怎样才能一个接一个地获取每个图像 url 来获取它。请查看我上面编辑的代码 在 cellForItemAtIndexPath 中编写上面的代码,并从 url 数组中提供 url。 Ccr 代码是正确的。但是在某些情况下,上面的代码需要时间来更新 UI。因此,如果您使用的是 AlamofireImage,请使用下面的代码而不是上面的代码。 yourCell.yourCell_ImageView.af_setImage(withURL: URL(string: imageUrl)!)【参考方案4】:

在 cellForItemAtIndexPath 中编写 Ccr 代码,并从 url 数组中提供 url。 Ccr 代码是正确的。但是在某些情况下,上面的代码需要时间来更新 UI。所以如果您使用的是 AlamofireImage,请使用下面的代码而不是上面的代码。

 yourCell.yourCell_ImageView.af_setImage(withURL: URL(string: imageUrl)!)

【讨论】:

以上是关于从 Api Url 下载图像并使用 Alamofire 在集合视图中快速显示的主要内容,如果未能解决你的问题,请参考以下文章

AlamoFire 图像内存问题

将图像从 URL 保存到库,重命名并使用 Swift 共享它

从字符串 URL 数组下载图像并保存到文件?

从 URL 下载图像并添加到滚动视图子视图

HttpClient 从 URL 下载图片然后上传图片

如何使用从适配器传递的 url 下载图像