4주차_iOS 앱 개발 입문_1~2일차_다양한 UIView 컴포넌트

---

---

 

<TIL>

오늘은 어제 공부했던 iOS 앱 개발 입문
화면 그리기 강의를 한 번 더 보고,
직접 쳐보고 실행시키면서 공부하는 시간을 가졌다.

코드에 익숙해져야 하니 내일도 여러 번 반복해서 실습해 보려고 한다!

아래에 튜터님께서 강의해 주신 내용을 정리해 봤다.

각 코드 별 설명(주석처리), 해당 코드로 실행시킨 시뮬레이터 화면
그리고 클릭 시 디버깅 창에 출력되도록 메서드를 넣은 코드는
디버깅 창 화면도 함께 올려봤다.
(디버깅 창 안 가져온 컴포넌트도 있음)

부족한 설명이 있다면, 내일 공부해서 더 추가할 예정이다.😃

---

---

UIViewController

UIKit 앱의 View 계층을 관리하는 객체(Object)

---

UIView

화면을 구성하는 기본 객체(Object)

사용자 인터페이스를 구성하는 데 중요한 역할을 하는 클래스이다.
UIView 클래스는 화면에 보이는 모든 요소의 기본 클래스이며,
버튼, 레이블, 이미지, 입력 필드 등의 요소들은 모두 UIView의 하위 객체(object)들 이다.

---

---

이제부터 아래와 같은 다양한 UIView 컴포넌트에 대해서 알아보려고 한다.

- UILabel
- UIImageView
- UITextField
- UIButton
- UlSwitch
- UISlider
- UIsegmentedControl
- UlScrolIView
- UlPickerView
- UlTableView
- UlCollectionView

---

---

---

UILabel

---

UILabel

---

---

UIImageView

---

UIImageView는 Viewcontroller에 코드를 작성하기 전에
(↓)asset에 원하는 사진을 올려야 한다.😐(↓)

원하는 사진을 drag해서 왼쪽 리스트에 drop하면 된다!

UIImageView

---

---

UITextField

---

UITextField

시뮬레이터 실행시킨 후, 자판 띄우고 싶다면?
Command + k
(↓그럼 아래 사진처럼 나옴↓)

---

---

UIButton

---

UIButton

↓버튼 클릭 후, 디버깅 창↓

---

---

UISwitch

---

UISwitch

↓스위치 클릭 2번, 디버깅 창↓

---

---

UISlider

---

UISlider

슬라이더를 좌우로 옮기면,
디버깅 창에 설정한 범위 안에서 해당하는 위치가 찍하는 거 확인 가능

---

---

UISegmentedControl

---

UISegmentedControl

SegmentedControl도 각 옵션을 클릭하면,
디버깅 창에 뜨는 거 확인 가능

---

---

UIScrollView

---

UIScrollView

height를 프레임의 2배로 설정해놔서
해당 크기만큼 스크롤을 위 아래로 움직일 수 있음

---

---

UIPickerView

---

UIPickerView

---

---

UITableView

---

UITableView

맨 아래 코드를 지우고, 실행시키면

이렇게 옵션을 누르고 떼도 음영이 사라지지 않는다.

---

---

UICollectionView

---

UICollectionView

↓검정 버튼 각각 클릭 , 디버깅 창↓

---