[swift] 이미지 슬라이드쇼에서 이미지 블러 효과 변경하기

27 Nov 2023

swift

이미지 슬라이드쇼는 많은 웹사이트와 앱에서 눈에 띄는 기능 중 하나입니다. 사용자에게 다양한 이미지를 보여주고 화면 전환 효과를 통해 시각적인 재미를 제공합니다. 이미지 슬라이드쇼에 흔히 사용되는 효과 중 하나는 이미지 블러 효과입니다. 이미지를 블러 처리하여 부드러운 전환 효과를 만들 수 있습니다.

Swift 언어를 사용하여 이미지 슬라이드쇼에서 이미지 블러 효과를 변경하는 방법을 알아보겠습니다.

1. `UIImage` 클래스 확장

먼저, UIImage 클래스를 확장하여 이미지를 블러 처리하는 기능을 추가합니다. 다음과 같이 코드를 작성합니다:

import UIKit

extension UIImage {
    func applyBlurEffect() -> UIImage? {
        let context = CIContext(options: nil)
        guard let currentFilter = CIFilter(name: "CIGaussianBlur") else {
            return nil
        }
        
        let imageToBlur = CIImage(image: self)
        currentFilter.setValue(imageToBlur, forKey: kCIInputImageKey)
        currentFilter.setValue(10, forKey: kCIInputRadiusKey)
        
        guard let output = currentFilter.outputImage,
              let cgImage = context.createCGImage(output, from: output.extent) else {
            return nil
        }
        
        return UIImage(cgImage: cgImage)
    }
}

위 코드는 UIImage 클래스를 확장하여 applyBlurEffect() 메서드를 추가한 것입니다. 이 메서드는 CIGaussianBlur 필터를 사용하여 이미지를 블러 처리합니다.

2. 이미지 슬라이드쇼에 블러 효과 적용

이제 이미지 슬라이드쇼에서 이미지 블러 효과를 적용해보겠습니다. 이미지 슬라이드쇼에는 이미지 뷰로 이미지를 표시하는 구성 요소가 있을 것으로 가정합니다. 다음과 같이 코드를 작성합니다:

import UIKit

class ImageSlideShowViewController: UIViewController {
    @IBOutlet weak var imageView: UIImageView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 이미지 블러 효과를 적용할 이미지
        let image = UIImage(named: "example_image")
        
        // 이미지를 블러 처리
        let blurredImage = image?.applyBlurEffect()
        
        // 블러 처리된 이미지를 이미지 뷰에 설정
        imageView.image = blurredImage
    }
}

위 코드는 ImageSlideShowViewController 클래스에서 이미지 뷰를 IBOutlet으로 연결하고 viewDidLoad() 메서드에서 이미지를 블러 처리한 후 이미지 뷰에 설정하는 예시입니다.

마무리

위 방법을 사용하여 이미지 슬라이드쇼에서 이미지 블러 효과를 변경할 수 있습니다. UIImage 클래스를 확장하여 이미지를 블러 처리하는 메서드를 추가하고, 이미지 슬라이드쇼에서 해당 메서드를 호출하여 블러 효과를 적용합니다.

참고 자료:

1. UIImage 클래스 확장

2. 이미지 슬라이드쇼에 블러 효과 적용

마무리

1. `UIImage` 클래스 확장