SwiftUI 데이터 플로우 이해하기

사용자 시나리오

• 팟캐스트 플레이어 화면
• 팟캐스트 정보(타이틀, 쇼이름)
• 플레이 버튼(재생 여부에 따라 다르게 표시)
• 현재 재생 상태표시 이미지(재생여부에 따라 다르게 표시)
  

---

SwiftUI 이전에,,, 어려웠던 시절

SwiftUI와 함께라면,,,

이전엔 왜 어려웠을까?

• 상태 관리를 위해서 중복된 데이터가 여기저기….
• 아,,, 뭐가 진짜야… 🤷‍♀️

SwiftUI 에서는 Single Source of Truth

• 진짜 상태를 쉽게 관리하게끔 도와줌
  • 바로 @State 를 이용해서 Single source of truth 를 나타낼수 있음
  • @Binding 을 통해서 Single source of truth 에 접근할 수 있음
• 상태가 업데이트 되면, 뷰는 자동으로 업데이트 된다!! 🔥
• SwiftUI 뷰의 상태 정보는 따로 보관하는 장소가 있음
  
  
  

요약

• SwiftUI 에서는 Single source of truth 에 의한 상태 관리가 중요함
• SwiftUI 에서는 @State 를 이용해서 Single source of truth 상태를 나타낼수 있음
• @Binding 을 통해서 Single source of truth 상태 정보에 접근 가능
• SwiftUI 에서는 상태가 변하면, 뷰는 상태를 반영하여 자동으로 그려짐

---

프로젝트에서 살펴보자

isPlaying 이라는 bool값에 따라 상태가 변하는 뷰를 만들어 줬다

Button이라는 뷰를 SubView로 빼낼 수 있다 (커맨드 클릭)

그리고 컨트롤+커맨드+e로 edit all in scope 로 이름 바꿔줄 수 있음
(리팩터 리네임이랑 비슷)

이렇게 새로운 뷰가 아래에 생성되었는데 현재 isPlaying에 대한 값을 접근할 수가 없다
(가지고있지 않으니까)

@Binding이라는 키워드로 불 프로퍼티를 만들고

기존에 선언되었던 뷰에서 $isPlaying을 통해 접근하게 되면 끝!

그리고 새로운 파일들로 뷰를 떼어주면 된다

상태를 참조를 통해서 여러개의 뷰들이 하나의 정보를 공유하게끔 하는 데이터 구조가 @State @Binding