web-dev-qa-db-ja.com

Alamofireを使用してSwiftで画像を読み込む方法

URLで画像の非同期を読み込むコレクションビューコントローラーがあります。 （Instegramのようなもの）読み込みイメージの一部を実装する最良の方法を探しています。どう思いますか教えてください

最初の方法-外部ライブラリなし：

   let downloadQueue = dispatch_queue_create("com.pro.asyncImages",nil)
    dispatch_async(downloadQueue){

        var data = NSData(contentsOfURL: NSURL(string: pictureUrl!)!)

        var image: UIImage?
        if (data != nil){
            image = UIImage(data: data!)
        }
        dispatch_async(dispatch_get_main_queue()){
            uiImageView.image = image
        }
    }

2番目の方法-Alamofireを使用する（リクエストはAlamofireに属します）

if let  mediaUrl = info.mediaUrl {
        request(.GET,mediaUrl).response(){
            (_, _, data, _) in
            let image = UIImage(data: data! as NSData)
            imageView.image = image
        }
    }

そして最後に、AFNetworkingがurlImageにurl asyncをロードするのに素晴らしい仕事をしていることを読みました。これが私がしたいことです。

AFNetworkingはこのタスクに適していますか？ （そしてAlamofire）、そうでない場合は、AFNetworkingをSwiftプロジェクトに追加する方法を理解できませんでした。

どの方法が最適かを説明してください。私のニーズはパフォーマンス、告発、キャッシングです。ビューコレクションコントローラーはInstegramのように動作し、下にスクロールしながら画像を読み込んでいます。私は私が必要なものについて十分に明確だったことを願っています、ありがとう

swiftafnetworkingalamofire
28
user3728728

著者がAlamofireで言及しているように README.md ：

AFNetworkingはいつ使用する必要がありますか？

  • UIImageViewへの画像の非同期読み込みなどのUIKit拡張機能

あなたの質問に答えてください：

AFNetworkingはこのタスクに適していますか？

はい！

ただし、Vanilla Alamofireプロジェクトを引き続き使用する場合は、次の方法で画像を取得できます。

   Alamofire.request(.GET, "https://robohash.org/123.png").response { (request, response, data, error) in
        self.myImageView.image = UIImage(data: data, scale:1)
    }

追伸.

ただし、イメージをロードするだけの場合（もちろん非同期）-AlamofireまたはAFNetworkingを使用する必要はまったくありません。この小さな拡張機能をコードに追加するだけです。

extension UIImageView {
    public func imageFromUrl(urlString: String) {
        if let url = NSURL(string: urlString) {
            let request = NSURLRequest(URL: url)
            NSURLConnection.sendAsynchronousRequest(request, queue: NSOperationQueue.mainQueue()) {
                (response: NSURLResponse!, data: NSData!, error: NSError!) -> Void in
                self.image = UIImage(data: data)
            }
        }
    }
}

そしてそれを使用します：

myImageView.imageFromUrl("https://robohash.org/123.png")
46
skywinder

Swift UIImageView + AFNetworkingのバージョンはここで作成しました： Github 。
プロジェクトでAFNetworking（およびブリッジングヘッダー）またはAlamofireを使用する必要はありません。ファイルをプロジェクトに追加して使用するだけです。


使用例：

myImageView.setImageWithUrl(imageUrl, placeHolderImage: somePlaceHolderImage)
17
namanhams

Alamofire/README.mdから取得

「Alamofireがコアネットワーキングの実装に特に焦点を合わせ続けるために、Alamofire Software Foundationによって追加のコンポーネントライブラリが作成され、Alamofireエコシステムに機能が追加されました。

AlamofireImage-画像応答シリアライザー、UIImageおよびUIImageView拡張機能、カスタム画像フィルター、メモリ内キャッシュの自動パージ、優先度に基づいた画像ダウンロードシステムを含む画像ライブラリ。

https://github.com/Alamofire/AlamofireImage

14
james.ff

AFNetworkingのUImageViewフレームワークを使用する場合は、ブリッジヘッダーファイルで_#import "UIImageView+AFNetworking.h"_を実行する必要があります。

AFNetworkingには共有キャッシュがあるため、リクエストを手動でキャッシュしたりキャンセルしたりする必要はありません。 AFNetworkingのsetImageWithURLは、URLをImageViewの画像に簡単に変換できます。

_UIImage+AFNetworking_を使用したサンプルコード：

_cell.imageView.setImageWithURL(NSURL(string:imageSource), placeholderImage: UIImage(named:"placeholder"))
_

Alamofireを使用している場合、NSDataを手動でUIImageに変換する必要があります。 Alamofireでは、NSCache()オブジェクトを作成して画像をキャッシュできます。両方のライブラリのパフォーマンスは似ているはずです。サーバーAPI呼び出しにAlamofireを使用してから、AFNetworkingを使用して画像を非同期に表示できます。

画像キャッシュにAlamofireを使用したサンプルコード：

_let imageCache = NSCache()

 if let image = self.imageCache.objectForKey(imageURL) as? UIImage {
    cell.imageView.image = image
  } else {
    // 3
    cell.imageView.image = nil

    // 4
    cell.request = Alamofire.request(.GET, imageURL).validate(contentType: ["image/*"]).responseImage() {
      (request, _, image, error) in
      if error == nil && image != nil {
        // 5
        self.imageCache.setObject(image!, forKey: request.URLString)

        // 6
        if request.URLString == cell.request?.request.URLString {
          cell.imageView.image = image
        }
      } else {
        /*
        If the cell went off-screen before the image was downloaded, we cancel it and
        an NSURLErrorDomain (-999: cancelled) is returned. This is a normal behavior.
        */
      }
    }
  } 
_

Alamofireの使用の詳細については、 このチュートリアル を参照してください。

7
ztan

RxAlamofireを使用したアプローチは次のとおりです。

import Alamofire
import RxAlamofire

extension UIImageView {
    public func imageFromUrl(urlString: String) {
        requestData(.GET, urlString)
            .observeOn(MainScheduler.instance)
            .subscribeNext { self.image = UIImage(data: $0.1) }
    }
}
6
Lukas Batteau

実際、Alamofireを使用してURLから画像を読み込む方法は複数あります。これは私が開発した方法であり、Swift=プロジェクトで既に使用しています。賢明なことに、ロードされた画像をキャッシュすることを考慮しているため、UITableViewのスクロール中にブロックは発生しません。

最初に、Alamofireを使用してGETリクエストを作成し、イメージをダウンロードする必要があります。また、AlamofireImageライブラリのRequest + AlamofireImageを使用して、

import AlamofireImage

そして、

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

}

次のように画像ダウンロードリクエストを呼び出す必要があります。

         //Download image
        // We should perform this in a background thread
        Alamofire.request(.GET, deshItem.dish_imageUrl!)
            .responseImage { response in
                debugPrint(response)

                print(response.request)
                print(response.response)
                debugPrint(response.result)

                if let image = response.result.value {
                    print("image downloaded: \(image)")

                    // Store the commit date in to our cache
                    self.ImageCache[dishName!] = image

                    // Update the cell
                    dispatch_async(dispatch_get_main_queue(), {
                        if let cellToUpdate = tableView.cellForRowAtIndexPath(indexPath) {
                                let dishImageView:UIImageView = cellToUpdate.viewWithTag(104) as! UIImageView
                                dishImageView.image = image

                        }
                    })

                }
        }

画像キャッシングでは、すべてのセルまたはアイテム（String）の画像を含む辞書を作成しました。したがって、この画像キャッシング方法は、スクロール中に表示されるロックを回避します。

完全なサンプルコード：

import AlamofireImage

class MainFeedTableViewController: UITableViewController, FloatRatingViewDelegate {

var ImageCache = [String:UIImage]()


override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCellWithIdentifier("MainFeedCellID", forIndexPath: indexPath)

    // Configure the cell...

    let dishName = deshItem.dish_name

    //This is a workaround to cash the image and improve the performance while user scrolling UITableView.
    // If this image is already cached, don't re-download
    if let dishImage = ImageCache[dishName!] {
                let dishImageView:UIImageView = cell.viewWithTag(104) as! UIImageView
                dishImageView.image = dishImage
    }
    else {
        //Download image
        // We should perform this in a background thread
        Alamofire.request(.GET, deshItem.dish_imageUrl!)
            .responseImage { response in
                debugPrint(response)

                print(response.request)
                print(response.response)
                debugPrint(response.result)

                if let image = response.result.value {
                    print("image downloaded: \(image)")

                    // Store the commit date in to our cache
                    self.ImageCache[dishName!] = image

                    // Update the cell
                    dispatch_async(dispatch_get_main_queue(), {
                        if let cellToUpdate = tableView.cellForRowAtIndexPath(indexPath) {
                                let dishImageView:UIImageView = cellToUpdate.viewWithTag(104) as! UIImageView
                                dishImageView.image = image

                        }
                    })

                }
        }

    }



    return cell
}
4
smapps

responseData(queue:completionHandler:)を使用して画像をダウンロードできます

Swift 4

func downloadImages(imageURL: String) {

    Alamofire.request(imageURL, method: .get)
        .validate()
        .responseData(completionHandler: { (responseData) in
            self.yourImageVIew.image = UIImage(data: responseData.data!) 
            DispatchQueue.main.async {
                // Refresh you views
            }
        })
}
3
Chathuranga Silva

AlamofireとImagesで動作する小さくてわかりやすいCocoaPodsライブラリを開発しました。

CocoaPodsは、ライブラリの依存関係のニーズに対応する優れた方法です。一度インストールするのは簡単で、プロジェクトへの依存関係の追加と更新は簡単です。

ライブラリはオープンソースであり、 https://github.com/gchiacchio/AlamoImage で見つけることができます

サンプル付きの優れたドキュメントがあるため、数分で楽しむことができます。

コレクションビューやスクロールなど、いくつかのプロジェクトで作業しています。

0
Guillermo Chiacchio