2024년 3월 21일 목요일
Xcode에서 main Storyboard와 ViewController를 연결하는 기본적인 로직을 정리해 봅니다.
#1 Storyboard와 ViewController 연결
#2 @IBOulet 을 사용하여 UITextLabel 과 Code 연결
#3 @IBAction 을 사용하여 UIButton 과 Code 연결
#1
Storyboard와 ViewController 연결
우측 Identity Inspector에서 Custom Class 영역의 Class 부분을 확인하고
해당 부분에서 원하는 커스텀하게 만들어준 ViewController와 연결하기
#2
@IBOutlet 사용하여 UITextLabel ↔ 코드 연결
@IBOutlet이란?
인터페이스 빌더와 코드를 연결하기 위해 사용되는 것으로 사용자 인터페이스의 요소인 버튼, 레이블, 텍스트필드 등의 뷰 컴포넌트를 코드와 연결하는데 사용되는 선언으로 연결된 코드는 해당 요소에 대한 참조를 얻을 수 있다. 일반적으로 UI 요소의 속성을 코드에서 변경하거나 상태를 읽어온다.
ctrl + drag 한 상태로 오른쪽 코드에 캔버스를 끌고와 놓아주고, 선언될 변수명을 입력한다음 Connect 버튼을 클릭하면, Storyboard와 ViewController의 textLabel 변수와 연결된다.
#3
@IBAction 을 사용하여 UIButton ↔ 코드 연결
@IBAction이란?
사용자가 특정 이벤트를 트리거할 때 실행될 함수와 연결지어주는 기능으로 사용자가 상호작용할 때 실행되는 메서드를 정의하기 위해 사용되며 주로 버튼 탭, 스위치 변경 등과 같은 이벤트에 응답하는 메서드와 연결한다.
- Collection을 Action으로 변경
- 선언될 함수명 입력
- Type을 UIButton으로 설정 후 Connect 클릭
- Storyboard와 ViewController의 tappedButton 함수가 연결 확인
▽. 버튼을 클릭하면 UILabel의 텍스트를 변경하고, UIButton을 비활성화 하는 코드
@IBOutlet weak var textLabel: UILabel!
@IBAction func tappedButton(_ sender: UIButton) {
self.textLabel.text = "버튼을 클릭했습니다"
let button = sender as? UIButton
button?.isEnabled = false
}
'iOS 앱 개발자 프로젝트 > iOS 입문' 카테고리의 다른 글
[iOS] LifeCycle - App, ViewController, AppDelegate (2) | 2024.03.22 |
---|---|
[iOS] 메모 앱 만들기 Day-3 (0) | 2024.03.22 |
[iOS] Low-Level Debugger (LLDB) (feat. LLVM) (1) | 2024.03.20 |
[iOS] AutoLayout - Constraints, AutoLayout Engine, Size Classes, Interface Builder (0) | 2024.03.19 |
[iOS] UIView component #2 (UISlider, UISegmentedControl, UIScrollView, UIPickerView, UITableView, UICollectionView) (0) | 2024.03.19 |