[ios] UICollectionView + UILongPressGestureRecognizer
[ios] UICollectionView + UILongPressGestureRecognizer
안녕하세요. 오늘은 UICollectionView
에 UILongPressGestureRecognizer
를 적용시켜보는 법을 알아보도록 하겠습니다.
UICollectionView
의 Cell
들의 터치에 대한 액션은 didSelectedItemAt
메소드를 사용하실 겁니다. 이는 단순히 touchUpInside
에 의한 액션에 해당하는 메소드입니다.
하지만 오늘은 UILongPressGestureRecognizer
를 이용해 사용자가 Cell
을 길게 누르는 액션을 통해 Cell
을 지워보도록 하겠습니다. 그럼 바로 시작해보도록 하겠습니다.
기본 세팅
먼저 오늘 예제를 위한 기본 세팅을 해보도록 하겠습니다. 저는 CollectionCell
이라는 이름으로 UICollectionViewCell
을 상속받는 파일을 .xib
파일과 함께 만들었습니다. 그리고 .xib
파일 안의 Cell
위에 하나의 UILabel
을 올려주시고 CollectionCell
에 @IBOutlet
으로 연결을 해줍니다.
다음으로는 예제를 위한 UICollectionView
도 세팅해보도록 하겠습니다.
세팅한 것에 대해 간략히 말씀드리자면 Cell
들의 줄 간격인 16이고 UICollectionView
뷰 안의 요소들의 인셋은 UIEdgeInsets(top: 16, left: 16, bottom: 16, right: 16)
입니다. 그리고 Cell
의 너비와 높이는 한 줄에 두 개의 Cell
만 들어갈 수 있는 크기로 설정한 것입니다.
마지막으로 셀의 배경색은 .darkGray
이며 총 5개의 Cell
을 생성한 것입니다. 그럼 이제 본격적으로 viewDidLoad
메소드 안에서 UILongPressGestureRecognizer
를 등록하는 것을 시작으로 본격적으로 코드를 작성해보도록 하겠습니다.
UILongPressGestureRecognizer
addGestureRecognizer
메소드를 통해collectionView
에UILongPressGestureRecognizer
를 등록해주었습니다. 그리고 이런 제스처가 일어나면 호출되는 메소드로handleLongPressGesture
를 선언하였습니다.
그럼 이제 handleLongPressGesture
를 작성해보도록 하겠습니다.
위에서부터 하나씩 설명해드리도록 하겠습니다.
- 매개변수로
UIGestureRecognizer
타입의gesture
를 받습니다. 이 매개변수에는 제스처 이벤트가 발생하면 해당 이벤트 정보가 담겨집니다. 이벤트 정보라하면 어떤 뷰에서 해당 제스처 이벤트가 발생했는지 등의 내용이 담깁니다. - 위에서 언급한 이벤트 내용으로 해당 제스처가 일어난 화면의 좌표도 담깁니다.
collectionView
좌표계에 해당하는 좌표를 반환합니다. - 그리고
collectionView
에 해당하는 좌표에 존재하는Cell
을 알 수 있습니다. 만약 해당 좌표에 어떤Cell
도 존재하지 않는다면nil
이 반환되고guard-let
으로 인해return
되어 함수를 벗어납니다. 그리고 해당 위치에Cell
이 존재한다면에Cell
의 정보는IndexPath
에 담겨 반환됩니다. - 위에서 반환된
indexPath
를 통해 이벤트가 발생한Cell
의item
에 대한 정보도 알 수 있습니다. UILongPressGesture
가 발생하게 되면UIAlertController
를 띄어줍니다..actionSheet
은 팝업 형식이 아닌 밑에서 올라오는 형식의Alert
스타일을 의미합니다.- 만약 Yes 버튼이 눌렸으면 이제 아이템을 지워주어야 합니다. 하지만 여기서 주의하셔야할 것이 있습니다. 반드시 사용하고 있는 데이터(
items
)의 요소를 삭제한 후 해당 데이터에 대한Cell
을 삭제해주어야 합니다. 그렇지 않으면 데이터가 존재하는데 셀을 지우려하기 때문에 런타임오류를 발생시킵니다.
마무리
완성된 예제의 화면입니다. 오늘은 이렇게 UICollectionView
에 UILongPressGesture
를 추가하여 Cell
을 지우는 법에 대해 알아보았습니다. 다음에는 더욱 유용한 정보로 찾아뵙도록 하겠습니다. 감사합니다.