본문 바로가기
swift

스위프트 IBAction 및 IBOutlet

by 승환파크 2024. 4. 19.

IBOutlet

@IBOutlet은 애플의 UIKit 프레임워크에서 자주 사용하는 어노테이션으로 @IBOutlet을 사용하면 스토리보드나 인터페이스 빌더에서 정의한 UI 요소를 코드와 연결할 수 있다. 이를 통해 코드에서 UI 요소를 참조하고 조작할 수 있다.

 

IBOutlet 연결하기

 

사용하고 싶은 요소에서 'control' 키와 드래그를 사용해 ViewController 에 끌고가면 아래 사진과 같은 창이 뜬다.

 

그 이후 Name에 실제로 사용될 객체의 이름을 지정해주면 된다.

그럼 사진 처럼 객체가 만들어지는데 코드 왼쪽 옆에 보면 '◎' 같이 표시가 된다. 그쪽에 마우스 커서를 올리면 위의 사진처럼 UI 객체와 코드 상에 이어진 정보를 알려준다.

 

이렇게 되면 변수로 설정된 textOutlet은 오른쪽에 나온 label 을 조종할 수 있게 된다.

 

분명 오른쪽 storyBoard 에서는 기본 설정으로 text 의 내용을 "텍스트 이름 변경" 이라고 써놨지만 왼쪽의 ViewController 에서 textOutlet 의 text 를 "Hello"로 변경하여 시뮬레이터에서는 변경된 텍스트가 출력된다.

 

IBAction

@IBAction 은 @IBOutlet 과 비슷하게 프레임 워크로 행동을 조작하는데 사용된다. @IBAction은 메소드 앞에 붙어 해당 메소드와 UI 요소와 연결할 수 있다. 이렇게 연결된 메소드는 사용자가 UI요소를 이용할 때 호출된다. 예를 들어 UIButton 을 클릭했을 경우 호출되는 메소드를 정의하는 경우에 사용된다고 볼 수 있다.

 

IBAction을 사용하기 위한 버튼을 만들고 IBOutlet 에서 변수를 만들 때와 동일하게 'control' 을 클릭한 후 드래그를 통하여 IBAction 메소드를 만들어줄 수 있다.

 

이렇게 그림과 같이 내가 설정한 메소드명이 들어간 메소드가 생성되고 저 버튼을 클릭했을 때 작동할 동작을 코드로 작성해주면 된다.

 

위에서 작성된 textOutlet 변수를 가지고 label에 backgroundColor 과 textColor, 그리고 text 내용을 변경하는 기능을 만들었다.

 

기능을 작성한 이후 시뮬레이터를 통해 클릭을 해보았더니 왼쪽에서 오른쪽처럼 바뀐것이 보인다. 이러한 기능을 정의하고 사용할 수 있는 것이 @IBAcion이다.

'swift' 카테고리의 다른 글

Swift 프로퍼티 옵저버  (0) 2024.06.12
Swift 카카오 로그인  (1) 2024.05.10
스위프트 Interface Builder 와 UI 구성  (0) 2024.04.19
스위프트 옵셔널 체인  (0) 2024.04.16
스위프트 초기화 구문  (1) 2024.04.16