[SwiftUI-기초] Form, Navigation bar, State

Form

• 정적 제어 요소와 동적 제어 요소의 스크롤 되는 리스트
• 10개까지는 form 안에 넣을 수 있음(물론 더 넣는 방법도 있음 -> Group)
• 정적 제어
  • text, image 등
• 동적 제어
  • text fiels, toggle, switches, buttons, 등

• 10개 까지는 Text 를 추가할 수 있음
• 더 추가하려면 안되는데 그 이유는 
  • SwiftUI 에서 제한을 걸었음
  • 10개 까지는 SwiftUI 에서 어떻게 표현할 지를 code 화 해놓았는데 그 이후부턴 적어 놓지 않았다. 
  • Form 뿐 아니라 다른 SwiftUI 요소 어디에서나 통용되는 룰이다. 

• Group 를 이용하면 해결 가능
• parent 안에 child 가 10개 이상 있을 수 없는데 Group을 사용해 해결
• 항목을 일정한 기준으로 묶고 싶다면 (청킹) Section 을 사용

Section으로 청킹

 

Navigation bar

• 시간과 같은 System UI는 건드리지 않는 것이 좋음
• 그래서 프로그래머가 배치하는 UI를 시스템 영역과 겹치지 않게 하는 것이 좋은데 이 안전한 영역을 Safe Area 라고 부름
• iPhone 13에서는 노치 바로 아래부터 홈 인디케이터 바로 위까지가 safe area
• 스크롤을 하다보면 항목이 시간등에 가려질 수 있는데 이를 방지해주는 것이 navigation bar
  • 제목, 버튼을 가질 수 있음
  • modifier 를 추가하면 가능

• 기본이 큰 제목 글자고 수정할 수도 있음
• 마찬가지로 modifier 를 추가

• 기본적으로 첫번 째 스크린에서 title 을 크게 표현 하고
• 그 후에 스크린에선 작게 표현하는 것을 볼 수 있음

첫 화면은 큰 타이틀

그 이후 화면은 작은 타이틀

State

• UI 의 외형이 State 에 의해 변경됨
• 예를 들어 게임에서 현재 체력, 아이템, 장비, 등은 Swift 로 말하면 State 와 관련이 있음
• 게임 이용자는 이름을 텍스트 필드에 입력하기 전까지 버튼을 tap 할 수 없도록 하는 것이 State

• 이 코드는 오류남
• ContentView 가 struct 여서 아마 contentView 가 상수(let)으로 선언되는 듯함
• 그러면 안에 속성이 var여도 변경 불가
• mutating func 을 사용했었는데 비슷하게 SwiftUI 에서 조치
  • @State : property wrapper 로 속성 앞에 추가
  • SwiftUI 가 속성의 값이 변경될 수 있게끔 struct 와 별도로 값을 저장할 수 있게 해줌
  • @State 는 하나의 뷰 안에 저장되는 단순한 property 를 위해 특별히 고안됨
    • private 으로 선언해주는 것이 좋음