この記事ではSwiftで簡単に非同期処理で画像を読み込む方法を解説します．状況としてはTableViewなどの複数のセルを持つUIを実装する際に，そのセルごとの画像を通信で読み込むような場合を想定しています．
また，今回使用するフレームワークはAlamofireImageとなります．
https://github.com/Alamofire/AlamofireImage
Podfileの設定
まずは先人の力を借りることが重要ですね．というわけでcocoapodsを使いますので皆さんインストールしてください．
sudo gem install cocoapods
インストールが終わった段階で以下のコマンドを打ちましょう．
pod setup
これでcocoapodsの設定は完了です．
Xcodeのプロジェクトファイルに移動して以下のコマンドを打ち込んでください．
pod init
これでフォルダ内にPodfileが作成されるはずです．次にPodfileのuse_frameworks!の下に以下のコマンドを追記してください．
pod 'AlamofireImage', '~> 4.1'
その後pod installでライブラリをインストールしましょう．
ソースコード
基本的にAlamofireのライブラリを使用して画像を読み込めば良いです．
ちなみに非同期処理とはTableViewなどのセルを複数持つUI上に画像を設置した際に，その画像の読み込みをセルが表示されるときに行うというような処理だと私は理解しています．
このように非同期処理を行うことで画像の通信量を節約することができます．
urlを指定して以下のコマンド例のように画像をセットすれば自動的に非同期処理ができていることになります．
ImageView.af.setImage(withURL: url)
また，以下が私が実際に使っているTableViewのCell上に画像を表示する際のコードです．ちなみに.xibファイルでセルのUIを設計しています．
import UIKit
import Alamofire
import AlamofireImage
class ViewController: UIViewController {
@IBOutlet weak var tableView: UITableView!
let url: String = "https://www"
override func viewDidLoad() {
super.viewDidLoad()
}
func initTableView(){
tableView.delegate = self
tableView.dataSource = self
tableView.register(UINib(nibName: "NibName", bundle: nil), forCellReuseIdentifier: "Identifier")
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return list.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Identifier", for: indexPath) as! TableViewCell
let url = URL(string: url)
cell.armImageView.af.setImage(withURL: url)
return cell
}
}
このような感じで簡単に非同期処理で画像を読み込むことができます．
まとめ
この記事では簡単に非同期処理で画像を読み込む方法について解説しました．
みなさんも是非試してみてください．
0 件のコメント :
コメントを投稿