[swift] RxSwift를 사용한 이미지 처리 방법

20 Nov 2023

swift

이미지 처리는 대부분의 앱에서 중요한 기능 중 하나입니다. 이번 블로그에서는 RxSwift를 사용하여 이미지를 다루는 방법에 대해 알아보겠습니다.

1. 이미지 다운로드하기

RxSwift를 사용하면 비동기적인 작업을 간편하게 처리할 수 있습니다. 이미지를 다운로드하는 경우, Observable을 사용하여 비동기 작업을 구현할 수 있습니다.

import RxSwift

func downloadImage(url: URL) -> Observable<UIImage> {
   return Observable.create { observer in
      let task = URLSession.shared.dataTask(with: url) { data, _, error in
         if let error = error {
            observer.onError(error)
            return
         }
         
         guard let data = data, let image = UIImage(data: data) else {
            observer.onError(NSError(domain: "ImageDownloadError", code: 0, userInfo: nil))
            return
         }
         
         observer.onNext(image)
         observer.onCompleted()
      }
      
      task.resume()
      
      return Disposables.create {
         task.cancel()
      }
   }
}

위의 코드에서 downloadImage(url: URL) 메서드는 Observable을 반환합니다. 이 메서드를 호출하면 비동기적으로 이미지를 다운로드하고, 다운로드가 완료되면 UIImage 객체를 observer.onNext 메서드를 사용하여 전달합니다.

2. 이미지 캐싱하기

이미지를 다운로드한 후에는 이미지를 캐싱하여 다음에 동일한 이미지를 사용할 때 다시 다운로드하지 않도록 할 수 있습니다.

import RxSwift

class ImageCache {
   static let shared = ImageCache()
   
   private let cache = NSCache<NSString, UIImage>()
   
   func getCacheImage(url: URL) -> UIImage? {
      return cache.object(forKey: url.absoluteString as NSString)
   }
   
   func setCacheImage(url: URL, image: UIImage) {
      cache.setObject(image, forKey: url.absoluteString as NSString)
   }
}

위의 코드에서 ImageCache 클래스는 이미지를 캐시하는 기능을 제공합니다. NSCache를 사용하여 이미지를 메모리에 캐싱하며, URL을 key로 사용하여 이미지를 저장하고 조회합니다.

3. 이미지 처리하기

이미지 다운로드와 캐싱이 완료되면 이제 이 이미지를 화면에 표시하거나 다른 작업을 수행할 수 있습니다.

import RxSwift

// 이미지 다운로드
let url = URL(string: "https://example.com/image.jpg")!
downloadImage(url: url)
    .observeOn(MainScheduler.instance)
    .subscribe(onNext: { image in
        // 다운로드 성공 시 이미지 처리를 수행
        // 예: 이미지 뷰에 이미지 설정
        imageView.image = image
        
        // 캐시에 이미지 저장
        ImageCache.shared.setCacheImage(url: url, image: image)
    }, onError: { error in
        // 다운로드 실패 시 에러 처리
        print("Image download error: \(error)")
    })
    .disposed(by: disposeBag)

위의 코드에서 downloadImage(url: url)으로 이미지를 다운로드하고, 다운로드가 완료되면 해당 이미지를 처리하는 부분을 작성합니다. observeOn을 사용하여 메인 스레드에서 작업을 수행하고, subscribe 메서드를 사용하여 구독합니다.

마무리

이번 블로그에서는 RxSwift를 사용하여 이미지 처리하는 방법에 대해 알아보았습니다. RxSwift를 사용하면 비동기 작업을 간편하게 처리할 수 있으며, 이미지 캐싱과 함께 이미지를 다룰 수 있는 강력한 도구가 될 수 있습니다.

참고 자료: