iOS Make a selectable collection view

운영 체제: macOS Monterey 12.5
사용 버전: Xcode 13.4.1, Swift, UIKit, Storyboard
​

iOS Make a selectable collection view를 알아보겠습니다.

Collection View를 눌렀을 때, 상세 페이지로 이동하는 것을 해볼 겁니다.
​
​
아래 글을 참조하여 collection view를 만들어 주세요.

https://shwoghk14.blogspot.com/2022/08/ios-how-to-make-collection-view.html

계속 이어서 진행해 봅시다.

Main.storyboard로 갑니다. 상세 페이지를 만들어야 합니다. View Controller를 추가합니다.

상세 페이지에서 무엇을 보여줄지, 항목들을 넣습니다.

저는 Image view 하나와 label 두 개를 넣었습니다.

상세 페이지를 위한 ViewController를 만들어 줍니다.

File - New - File... 을 누릅니다.

Cocoa Touch Class를 선택합니다.

Class에는 아무 이름이나 적어줍니다. 저는 DetailViewController를 적었습니다.

Subclass of에는 UIViewController를 선택합니다.

Create로 만들어 줍니다.

Main 스토리보드로 갑니다.

DetailViewController의 Class와 StoryboardID를 적어줍니다. 저는 DetailViewController라고 적었습니다.

DetailViewController.swift에 image view와 label들을 연결합니다.

그리고 collection view에서 전달받을 변수들을 생성하고 image view와 label에 넣어줍니다.

ViewController.swift로 옵니다.

10 번째 줄에 UICollectionViewDelegate를 추가하고, 22 번째 줄 collectionView didSelectItemAt 함수를 만듭니다.

23 번째 줄 code 부분을 아래와 같이 적어줍니다.

instantiateViewController는 withIdentifier에 적힌 View Controller를 불러옵니다.

아까 정한 DetailViewController를 적어줍니다.

indexPath는 선택한 cell의 순서를 알려줍니다. IndexPath를 활용하여 순서에 맞는 CellData를 불러옵니다.

그리고 detailViewController에 필요한 flagName, korean, english를 cellData에서 뽑아서 넣어줍니다.

pushViewController는 navigaitonController에 view controller를 넣으면서 화면 전환을 일으킵니다.

​

Main 스토리보드로 갑니다.

Collection View에서 ctrl과 함께 마우스를 클릭하여 위의 View Controller까지 드래그합니다.

마우스를 떼면 선택 창이 나옵니다.

delegate를 눌러줍니다.

실행해 봅시다.

짜잔.

끝.

카테고리: iOS