[iOS 앱 개발] FirstApp (4) - 북마크 버튼 이벤트 / UIImageView 클릭 이벤트

[iOS 앱 개발] FirstApp (4) - 북마크 버튼 이벤트 / UIImageView 클릭 이벤트

안녕하세요. 개발하는 정주입니다.

 

오늘은 FirstApp 네 번째 이야기, 북마크 버튼 이벤트에 대해 포스팅하려고 합니다.

버튼 이벤트를 처리하려고 하는데 UIButton이 아닌 UIImageView로 선언한 이유는 뷰의 이벤트를 처리해보고 싶었기 때문입니다.

 

동작 영상은 하단에 있습니다.

 

그럼 차근차근 해보겠습니다.

---

프로젝트 Git 링크

https://github.com/jeongju9216/firstApp

GitHub - jeongju9216/firstApp: 정주의 iOS 첫 번째 앱

---

UIImageView 선언

오늘은 미리 스토리보드에서 Outlet 연결을 했습니다.

@IBOutlet var bookmarkImage: UIImageView!
var isBookmarked: Bool = false

북마크 유무를 판단하기 위해 Bool 변수도 하나 선언하였습니다.

해당 변수는 아래 메서드에서 사용됩니다.

---

메서드 정의

버튼이 클릭되면 실행될 메서드를 정의해줍니다.

@objc func toggleBookmark() {
    isBookmarked.toggle()
    if isBookmarked {
    	bookmarkImage.image = UIImage(named: "redHeart")
    } else {
    	bookmarkImage.image = UIImage(named: "heart")
    }
}

Swift에서는 toggle()이 있어 Bool 변수 전환 코드가 더 직관적입니다.

isBookmarked가 true라면 빨간 아이콘으로, false라면 빈 하트 아이콘으로 변경합니다.

func 키워드 앞에 @objc가 붙은 이유는 바로 아래에 나옵니다.

 

---

터치 이벤트 등록

이제 UIImageView에 터치 이벤트를 등록합니다. 

저는 터치 이벤트가 보통 어디에 위치하는지 몰라서 일단 viewDidLoad()에 코드를 작성하였습니다.

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        bookmarkImage.isUserInteractionEnabled = true
        let event = UITapGestureRecognizer(target: self, action: #selector(toggleBookmark))
        bookmarkImage.addGestureRecognizer(event)
    }

isUserInteractionEnabled의 공식 문서 설명부터 보시죠.

When set to false, touch, press, keyboard, and focus events intended for the view are ignored and removed from the event queue. When set to true, events are delivered to the view normally. The default value of this property is true.

false이면 이벤트를 넣지 못하고 true일 때만 이벤트 사용이 가능하다고 합니다.

기본값이 true라고 하는데 대부분 예제가 true로 일부러 설정을 해서 저도 일단은 넣어보았습니다.

아마 이런 설정이 있다는 것을 알려주기 위함인 것 같습니다.

 

UIGestureRecognizer를 생성해주는데 selector 등록은 @objc 키워드를 넣어줘야 한다고 합니다.

그 중에서는 Tap 제스처를 등록할 것이기 때문에 UITapGestureRecognizer를 생성하여 bookmarkImage에 등록해줍니다.

 

---

동작 영상

 

 

---

마무리 잡담

오늘은 UIImageView에 터치 이벤트를 추가했습니다.

아직 예외처리의 늪이 남아있지만 점차 마무리 되어가는 느낌이네요.

오늘도 감사합니다!

 

---

아직은 초보 개발자입니다.

더 효율적인 코드 훈수 환영합니다!

공감과 댓글 부탁드립니다.