[iOS] - KingFisher 리드미 읽기~

리드미 해석해보자 pod v7.0.0

Kingfisher is a powerful, pure-Swift library for downloading and caching images from the web.

Features

• 비동기 이미지를 다운로드하고 캐싱해줍니다.
• URLSession을 기반으로 네트워크 또는 로컬에서 이미지를 로딩합니다.
• 유용한 프로세서와 필터가 제공됩니다.
• 메모리와 디스크를 다 이용하는 캐시를 합니다.
• 캐시 동작을 제어할 수 있습니다. 날짜나 사이즈 사용자화 할 수 있습니다.
• 다운로드를 취소할 수 있고 이전에 다운로드 받은 데이터를 자동으로 재사용하여 성능을 향상시켜 줍니다.
• 다운로더, 캐싱시스템, 이미지 프로세서가 독립적으로 분리되어 있습니다.
• 이미지들을 Prefetching해서 캐시에 넣고 빠르게 앱에서 사용가능합니다.
• UIImageView, NSImageView, NSButton , UIButton 에서 extension을 사용해서 직접적으로 설정가능합니다.
• 이미지 변환시 애니메이션이 내장되어 있습니다.
• 이미지가 로딩중일 때 인디케이터나 플레이스홀더를 사용자화 할 수 있습니다.
• 낮은 데이터 모드를 지원합니다. (인터넷 연결 상태)
• 이미지 프로세싱과 이미지 형식이 쉽게 확장가능합니다.
• SwiftUI를 지원합니다.

kingFisher 101

import Kingfisher

let url = URL(string: "https://example.com/image.png")
imageView.kf.setImage(with: url)

 

extension으로 편하게 된다..

• 킹 피셔는 url에서 이미지를 다운로드하고 메모리 캐시와 디스크 캐시로 둘다 전송한 뒤에 imageView에 표시합니다. 나중에 동일한 URL로 설정하면 이미지가 캐시에서 검색되어 즉시 보여집니다.

 

A More Advanced Example

킹피셔는 강력한 옵션들로 여러분이 어렵게 했던 일들을 간단하게 할수 있다. ^^ ;;

 

let url = URL(string: "https://example.com/high_resolution_image.png")
let processor = DownsamplingImageProcessor(size: imageView.bounds.size)
             |> RoundCornerImageProcessor(cornerRadius: 20)
imageView.kf.indicatorType = .activity
imageView.kf.setImage(
    with: url,
    placeholder: UIImage(named: "placeholderImage"),
    options: [
        .processor(processor),
        .scaleFactor(UIScreen.main.scale),
        .transition(.fade(1)),
        .cacheOriginalImage
    ])
{
    result in
    switch result {
    case .success(let value):
        print("Task done for: \(value.source.url?.absoluteString ?? "")")
    case .failure(let error):
        print("Job failed: \(error.localizedDescription)")
    }
}

1. 고 해상도 이미지를 다운로드 받는다.

let url = URL(string: "https://example.com/high_resolution_image.png")

 

2. 이미지 보기 크기와 일치하도록 다운샘플링한다. & 주어진 반지름으로 코너에 몰린 상태로 만듭니다.

let processor = DownsamplingImageProcessor(size: imageView.bounds.size)
             |> RoundCornerImageProcessor(cornerRadius: 20)

|> 이거 쓰넹!

 

3. 다운로드 하는 동안 시스템 표시기 자리 표시자 이미지를 표시합니다.

imageView.kf.indicatorType = .activity

 

4.준비되면 "페이드 인" 효과로 작은 섬네일 이미지를 애니메이션화합니다.

imageView.kf.setImage(
    with: url,
    placeholder: UIImage(named: "placeholderImage"),
    options: [
        .processor(processor),
        .scaleFactor(UIScreen.main.scale),
        .transition(.fade(1)),
        .cacheOriginalImage
    ])

큰 이미지는 나중에 사용하기 위해 디스크에 캐시되어 View에서 다시 다운로드 할 필요가 없습니다.

 

5. 클로저로 콘솔로그도 출력할 수 있음.

{
    result in
    switch result {
    case .success(let value):
        print("Task done for: \(value.source.url?.absoluteString ?? "")")
    case .failure(let error):
        print("Job failed: \(error.localizedDescription)")
    }
}

 

Method Chaining

// Use `kf` extension
imageView.kf.setImage(
    with: url,
    placeholder: placeholderImage,
    options: [
        .processor(processor),
        .loadDiskFileSynchronously,
        .cacheOriginalImage,
        .transition(.fade(0.25)),
        .lowDataMode(.network(lowResolutionURL))
    ],
    progressBlock: { receivedSize, totalSize in
        // Progress updated
    },
    completionHandler: { result in
        // Done
    }
)

// Use `KF` builder
KF.url(url)
  .placeholder(placeholderImage)
  .setProcessor(processor)
  .loadDiskFileSynchronously()
  .cacheMemoryOnly()
  .fade(duration: 0.25)
  .lowDataModeSource(.network(lowResolutionURL))
  .onProgress { receivedSize, totalSize in  }
  .onSuccess { result in  }
  .onFailure { error in }
  .set(to: imageView)

신기하게 쓰네

기존 UIKit에서 KF builder를 사용하다가 SwiftUI로 넘어갈 때 빌더이름을 KF → KFImage로 하면됨.

 

Requirements

• iOS 12.0+ / macOS 10.14+ / tvOS 12.0+ / watchOS 5.0+ (if you use only UIKit/AppKit)
• iOS 14.0+ / macOS 11.0+ / tvOS 14.0+ / watchOS 7.0+ (if you use it in SwiftUI)
• Swift 5.0+
• If you need to support from iOS 10 (UIKit/AppKit) or iOS 13 (SwiftUI), use Kingfisher version 6.x.
• 지금 버젼은 7임 (2021년 10월기준)

 

다양한 프로세서들

 

// Round corner
let processor = RoundCornerImageProcessor(cornerRadius: 20)

// Downsampling
let processor = DownsamplingImageProcessor(size: CGSize(width: 100, height: 100))

// Cropping
let processor = CroppingImageProcessor(size: CGSize(width: 100, height: 100), anchor: CGPoint(x: 0.5, y: 0.5))

// Blur
let processor = BlurImageProcessor(blurRadius: 5.0)

// Overlay with a color & fraction
let processor = OverlayImageProcessor(overlay: .red, fraction: 0.7)

// Tint with a color
let processor = TintImageProcessor(tint: .blue)

// Adjust color
let processor = ColorControlsProcessor(brightness: 1.0, contrast: 0.7, saturation: 1.1, inputEV: 0.7)

// Black & White
let processor = BlackWhiteProcessor()

// Blend (iOS)
let processor = BlendImageProcessor(blendMode: .darken, alpha: 1.0, backgroundColor: .lightGray)

// Compositing
let processor = CompositingImageProcessor(compositingOperation: .darken, alpha: 1.0, backgroundColor: .lightGray)

// Use the process in view extension methods.
imageView.kf.setImage(with: url, options: [.processor(processor)])

 

다양한 옵션들

 

    public var targetCache: ImageCache? = nil
    public var originalCache: ImageCache? = nil
    public var downloader: ImageDownloader? = nil
    public var transition: ImageTransition = .none
    public var downloadPriority: Float = URLSessionTask.defaultPriority
    public var forceRefresh = false
    public var fromMemoryCacheOrRefresh = false
    public var forceTransition = false
    public var cacheMemoryOnly = false
    public var waitForCache = false
    public var onlyFromCache = false
    public var backgroundDecode = false
    public var preloadAllAnimationData = false
    public var callbackQueue: CallbackQueue = .mainCurrentOrAsync
    public var scaleFactor: CGFloat = 1.0
    public var requestModifier: AsyncImageDownloadRequestModifier? = nil
    public var redirectHandler: ImageDownloadRedirectHandler? = nil
    public var processor: ImageProcessor = DefaultImageProcessor.default
    public var imageModifier: ImageModifier? = nil
    public var cacheSerializer: CacheSerializer = DefaultCacheSerializer.default
    public var keepCurrentImageWhileLoading = false
    public var onlyLoadFirstFrame = false
    public var cacheOriginalImage = false
    public var onFailureImage: Optional<KFCrossPlatformImage?> = .none
    public var alsoPrefetchToMemory = false
    public var loadDiskFileSynchronously = false
    public var diskStoreWriteOptions: Data.WritingOptions = []
    public var memoryCacheExpiration: StorageExpiration? = nil
    public var memoryCacheAccessExtendingExpiration: ExpirationExtending = .cacheTime
    public var diskCacheExpiration: StorageExpiration? = nil
    public var diskCacheAccessExtendingExpiration: ExpirationExtending = .cacheTime
    public var processingQueue: CallbackQueue? = nil
    public var progressiveJPEG: ImageProgressive? = nil
    public var alternativeSources: [Source]? = nil
    public var retryStrategy: RetryStrategy? = nil
    public var lowDataModeSource: Source? = nil

 

킹피셔 꿀팁이랄까

https://github.com/onevcat/Kingfisher/wiki/Cheat-Sheet

API Reference

https://kingfisher.onevcat.com/

출처

https://github.com/onevcat/Kingfisher

GitHub - onevcat/Kingfisher: A lightweight, pure-Swift library for downloading and caching images from the web.