【Swift】AlamofireImageでURLから画像取得 - ぬけてるエンジニアの備忘録

github.com

Alamofire用の画像コンポーネントライブラリAlamofireImageの導入メモ。

これまでAlamofireだけでは画像の非同期取得はサポートされていませんでしたがAlamofireImageを一緒に使う事で非常に簡単に画像の非同期取得も出来るようになったようです。

環境 Xcode 7.0

CocoaPods

$ gem install cocoapods

Podfile

source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!

pod 'AlamofireImage', '~> 1.0'

$ pod install

これで導入は完了する。ちなみに依存関係にあるAlamofireもセットでインストールされる。
Alamofireの使い方は簡単に過去に紹介しています。

nukenuke.hatenablog.com

一番簡単な方法でやってみる

import AlamofireImage

インポートを記述

@IBOutlet weak var imageView: UIImageView!

storyboardでUIImageViewを設置しておく

self.imageView.af_setImageWithURL(NSURL(string:"https://httpbin.org/image/png")!)

これだけで画像を取得できます。

プレースホルダーも設定できる

let URL = NSURL(string: "https://httpbin.org/image/png")!
let placeholderImage = UIImage(named: "placeholder")!

self.imageView.af_setImageWithURL(URL, placeholderImage: placeholderImage)

色々フィルタも掛けられる

let URL = NSURL(string: "https://httpbin.org/image/png")!
let placeholderImage = UIImage(named: "placeholder")!

let filter = AspectScaledToFillSizeWithRoundedCornersFilter(
    size: imageView.frame.size, 
    radius: 20.0
)

self.imageView.af_setImageWithURL(
    URL, 
    placeholderImage: placeholderImage,
    filter: filter
)

これで取得した画像が角丸にできます。

トランジションも設定できます

let URL = NSURL(string: "https://httpbin.org/image/png")!
let placeholderImage = UIImage(named: "placeholder")!

let filter = AspectScaledToFillSizeWithRoundedCornersFilter(
    size: imageView.frame.size, 
    radius: 20.0
)

self.imageView.af_setImageWithURL(
    URL, 
    placeholderImage: placeholderImage,
    filter: filter,
    imageTransition: .CrossDissolve(0.2)
)

非常に簡単にURLから画像の非同期取得が行えました。