[swift] PeekPop을 이용한 이미지 갤러리 앱의 구현 방법

16 Nov 2023

swift

이번 블로그 포스트에서는 Swift를 사용하여 PeekPop을 이용한 이미지 갤러리 앱을 어떻게 구현하는지에 대해 알아보겠습니다.

PeekPop 소개

PeekPop은 iOS 9부터 도입된 3D Touch의 기능 중 하나입니다. PeekPop은 사용자가 앱의 콘텐츠에 미리보기를 제공할 수 있는 기능입니다. 사용자가 특정 콘텐츠에 약간의 압력을 가하면 해당 콘텐츠의 미리보기를 볼 수 있습니다. 이 기능은 효율적이고 유용한 사용자 경험을 제공할 수 있으며, 이미지 갤러리 앱에서 이미지들에 적용할 수 있는 좋은 예입니다.

이미지 갤러리 앱의 구성

이미지 갤러리 앱은 여러 개의 이미지를 그리드 형태로 표시하고, 사용자가 특정 이미지를 선택하면 해당 이미지의 미리보기를 제공하는 기능을 가지고 있습니다. PeekPop을 이용하여 갤러리의 이미지들을 미리보기로 볼 수 있습니다.

PeekPop을 이용한 이미지 미리보기 구현 방법

프로젝트에 3D Touch 기능을 지원하도록 설정합니다. Info.plist 파일에 UIApplicationShortcutItems 키를 추가하고, 해당 키에 이미지 갤러리 앱의 바로가기 아이템을 설정합니다.

<key>UIApplicationShortcutItems</key>
<array>
	<dict>
		<key>UIApplicationShortcutItemTitle</key>
		<string>Gallery</string>
		<key>UIApplicationShortcutItemType</key>
		<string>com.example.gallery</string>
		<key>UIApplicationShortcutItemIconType</key>
		<string>UIApplicationShortcutIconTypeFavorite</string>
		<key>UIApplicationShortcutItemUserInfo</key>
		<dict>
			<key>galleryId</key>
			<string>123456</string>
		</dict>
	</dict>
</array>

UIViewControllerPreviewing 프로토콜을 준수하는 미리보기 뷰 컨트롤러를 구현합니다. 이 뷰 컨트롤러는 이미지의 미리보기를 담당하며, PeekPop을 이용하여 뷰 컨트롤러를 표시하는 메소드를 구현해야 합니다.

class PreviewViewController: UIViewController, UIViewControllerPreviewingDelegate {
	func previewingContext(_ previewingContext: UIViewControllerPreviewing, viewControllerForLocation location: CGPoint) -> UIViewController? {
		guard let imageView = previewingContext.sourceView as? UIImageView else {
			return nil
		}
   		
		let previewItem = GalleryItem(imageView.image!)
		let detailViewController = DetailViewController(previewItem: previewItem)
		return detailViewController
	}
   	
	func previewingContext(_ previewingContext: UIViewControllerPreviewing, commit viewControllerToCommit: UIViewController) {
		show(viewControllerToCommit, sender: self)
	}
}

뷰 컨트롤러에서 3D Touch 기능을 사용할 수 있도록 등록합니다. viewDidLoad() 메소드에서 다음 코드를 추가하여 뷰 컨트롤러를 PeekPop의 delegate로 설정합니다.

override func viewDidLoad() {
	super.viewDidLoad()
   	
	if traitCollection.forceTouchCapability == .available {
		registerForPreviewing(with: self, sourceView: collectionView)
	}
}

이미지를 터치하면 이미지의 미리보기가 나타납니다. 사용자가 더 강한 압력을 가하면 뷰 컨트롤러가 표시됩니다.

결론

PeekPop을 이용하여 이미지 갤러리 앱에 이미지 미리보기 기능을 구현하는 방법을 알아보았습니다. 3D Touch의 다양한 기능을 활용하여 앱의 사용자 경험을 향상시킬 수 있습니다. PeekPop을 사용하여 빠르고 효율적인 이미지 미리보기를 제공하는 이미지 갤러리 앱은 사용자로부터 긍정적인 반응을 받을 것입니다.

참고 자료:

Apple Developer Documentation - Peek and Pop

Apple Developer Documentation - UIViewControllerPreviewingDelegate

목차

PeekPop 소개

이미지 갤러리 앱의 구성

PeekPop을 이용한 이미지 미리보기 구현 방법

결론