IBAction과 IBOutlet

 

IBAction과 IBOutlet

- UI를 그리는 방법 중 하나

- SwiftUI vs UIKit

- Storyboard vs Code

- Storyboard에서 화면과 코드를 연결하는 방법

- IB는 Interface Builder의 약자이다.

 

IBAction

- Interface Builder와 연결된 Action

- 연결 방법은 드래그 앤 드롭

- 액션을 연결 함

- 우리가 어떤 액션을 했을 때, 동작하는 트리거를 정의하고 연결할 때 사용

 

IBOutlet

- Interface Builder와 연결된 객체

- 연결 방법은 드래그 앤 드롭

- 컴포넌트를 연결 함

- 화면에 있는 뷰와 코드를 연결할 때 사용

@IBOutlet weak var imageView: UIImageView!

(이런식으로 연결된다.)

- weak는 약한 참조를 의미한다.

 

 

 

직접 코드로 넘어가보자.

 

IBAction을 사용해서 우리가 버튼을 눌렀을때, 배경색을 만드는 트리거를 정의하고 연결해보자!!

아래의 코드를 집어 넣을 것이다.

   @IBAction func didTapMyButton(_ sender: Any) {
        print("배경색상을 노란색으로 바꿀게요!")
        view.backgroundColor = .yellow
    }

 

먼저 스토리보드에서 Command + Shift + L 을 누르고, 버튼을 선택해서 스토리 보드에 넣어준다.

 

스토리보드에서 드래그앤 드롭을 사용해서, 뷰 컨트롤러에 코드를 연결해주면 되는데,

 

키보드에서 컨트롤키를 누른 상태로, 드래그 앤 드롭해주면 연결이 된다.

 

그럼 이런 모양이 나오는데, 그때 무조건 Action을 선택해주고, Event를 선택해준다.

나는 "버튼을 눌렀을 때" 동작이 실행되도록 하기 위해서 Touch Up Inside를 선택했다.

상황에 맞는 다양한 이벤트를 선택하면 되겠다.

 

 

그럼

   @IBAction func didTapMyButton(_ sender: Any) {
    }

 

 

요런 코드가 생성되며 연결이 된다!

이때

 

        print("배경색상을 노란색으로 바꿀게요!")
        view.backgroundColor = .yellow

요 코드를 넣으면 어떻게 될까?

 

그렇다. 버튼을 누르면 배경색상을 노란색으로 바꿀게요!" 라는 메시지와 함께, 배경색을 노란색으로 바꾼다.

 

 

 

 

 

 

다만 메시지는 Xcode상에만 나타나는데,

이것을 앱 내부에서 띄우려면 어떻게 해야할까? 

조금더 공부가 필요한 부분이다.

아마 메시지를 알림으로 출력하는 코드를 구현하면, 버튼을 눌렀을 때, 알림창이나 메시지가 출력되고 배경색이 바뀌는 메커니즘일 것이라고 생각한다.