Hello World Alert App
1. 프로젝트 생성
1.1. Xcode app 실행
- Xcode.app 을 처음 실행 하면 나오는 모습
- 세 가지 버튼 중, Create a new Xcode project 버튼 클릭
1.2. 템플릿 선택
- 간단한 어플을 만들기 위해서, Single View App 선택
1.3. 어플 이름 설정
- Product Name: 어플리케이션의 이름
- Organization Identifier: 고유 주소..?
- User Interface: Swift UI or Storyboard 선택
1.4. 프로젝트 생성된 화면
- 이 창에서 버전, 빌드 번호 등을 수정 할 수 있다.
- Main Interface 에 선택된 것이 메인이 되는 storyboard
- Launch Screen File 은 앱을 실행 시 처음에 나오는 화면
2. storyboard 에 버튼 추가
2.1. Main.storyboard 선택
2.2. 컴포넌트 라이브러리 오픈
- 단축키: ⇧ + ⌘ + L (shift + command + L)
2.3. Button 을 드래그 하여 화면에 넣기
- 라이브러리의 Button 을 마우스로 클릭 -> 드래그를 하여 화면에 추가한다.
2.4. 텍스트, 크기 등 조건 수정
2.5. Constraints(제약 조건) 추가
- x, y 좌표의 중심값 입력
- Horizontally in Container / Vertically in Container 체크로 화면의 가장 중심에 버튼을 위치 시킬 수 있다.
2.6. 버튼 추가 완료
3. Assistant 켜기
- 오른쪽 상단의 빨간색 상자안의 아이콘을 클릭하여 Assistant 를 켠다.
- 아래 사진 처럼 ViewController 와 Swift 파일을 함께 볼 수 있게 된다.
4. 버튼과 코드 연결하기
- 버튼을 ⌃ + Drag (control + 드래그) 를 통해 코드로 가져가면, 파란선이 연결되는 것을 볼 수 있다.
- 자동으로 해당 버튼에 대한 함수를 생성하는 방법
4.1. 버튼과 연결된 함수 자동 생성
- Connection: 버튼이므로 Action 선택
- Name: 함수의 이름
- Type: 컴포넌트 타입
- Touch Up Inside : 클릭이 떨어질 때 동작
4.2. 코드 입력
@IBAction func showMessage(_ sender: UIButton) {
let alertController = UIAlertController(title: "First APP", message: "Hello, World!", preferredStyle: UIAlertController.Style.alert)
alertController.addAction(UIAlertAction(title: "OK", style: UIAlertAction.Style.default, handler: nil))
present(alertController, animated: true, completion: nil)
}
5. 빌드 및 실행
5.1. 빌드 버튼 클릭 및 확인
- 왼쪽 상단의 빌드 버튼 클릭 or ⌘ + R (command + R)
- 빌드가 성공되면 화면 중간에 해당 팝업이 뜬 후 시뮬레이터가 실행 된다.
5.2. simulator 로 생성한 어플 동작 확인