🔎 이 글은 Apple Developer Documentation - SwiftUI App Dev Tutorials를 ChatGPT를 통해 번역하여 작성되었음을 알려드립니다.

---

List는 데이터의 행을 단일 스크롤 가능한 열로 배열하여 표시하는 컨테이너 뷰입니다. 이 튜토리얼에서는 List 뷰를 사용하여 사용자의 일일 스크럼 요약을 표시하는 방법을 배울 것입니다. 그런 다음, 이 리스트를 앱의 주요 화면으로 설정할 것입니다.

Section 1. Display a list of daily scrums

List 뷰 구조는 정적 또는 동적 뷰로 채울 수 있습니다. 이 섹션에서는 DailyScrum 객체 배열을 사용하여 동적으로 행을 생성하는 방법을 배울 것입니다. 이전 튜토리얼에서 만든 CardView를 사용하여 각 행을 구성할 것입니다.

Step 1.

새로운 SwiftUI View 파일을 생성하고 이름을 ScrumsView.swift로 지정하세요.

Step 2.

[DailyScrum] 타입의 scrums라는 상수 속성을 추가하세요.

Step 3.

ScrumsView_Previews에서 ScrumsView 초기화자에게 scrums 배열을 전달하세요.

다음으로, initializer에게 항목의 컬렉션과 각 항목에 대한 뷰를 생성하는 클로저를 전달하여 List를 생성할 것입니다.

Step 4.

기본 Text 뷰를 List 뷰로 교체하세요. scrums 배열과 title 속성에 대한 키 경로를 initializer에게 전달하세요.

List는 컬렉션의 개별 항목을 식별할 방법이 필요합니다. 현재 테스트 데이터의 모든 scrums가 서로 다른 이름을 가지고 있기 때문에, title 속성을 사용하여 각 항목을 식별할 수 있습니다. 다음 섹션에서는 DailyScrum에 안정적인 아이덴티티 개념을 제공하는 방법을 배울 것입니다.

나열할 항목에 따라 다양한 방법으로 리스트를 초기화할 수 있습니다. List 뷰에 대해 자세히 알아보려면 List를 참조하세요.

Step 5.

List 클로저 내에서 CardView를 초기화하세요.

이 클로저는 scrums 배열의 각 요소에 대해 CardView를 반환합니다.

Step 6.

행의 배경색을 scrum.theme.mainColor로 설정하세요.

Section 2. Make scrums identifiable

List는 식별 가능한 데이터를 반복하여 동적 뷰를 생성합니다. 이전 섹션에서는 title을 통해 scrums를 식별하는 데 키 경로를 사용했습니다. 이 접근 방식은 샘플 데이터의 각 scrum이 고유한 제목을 가지고 있기 때문에 프로토타입 단계에서는 잘 작동했습니다. 하지만 사용자가 기존 scrum과 같은 제목을 가진 새 scrum을 생성하려고 하면 문제가 발생할 수 있습니다.

사용자 생성 콘텐츠를 다루기 위해, DailyScrum을 Identifiable 프로토콜에 준수하게 하여 더 강력한 아이덴티티 커뮤니케이션 방법을 제공합니다. 이 프로토콜의 요구 사항은 하나의 속성인 id로, 이 속성은 엔터티에 대한 안정적인 식별자를 제공해야 합니다.

Step 1.

DailyScrum.swift 파일을 열고 Identifiable 프로토콜에 준수하도록 선언하세요.

Step 2.

Identifiable에 준수하려면 모델에 id라는 이름의 속성이 있어야 합니다. 이 속성을 추가하지 않으면 코드가 컴파일되지 않습니다.

UUID 타입의 상수 id를 추가하세요.

Step 3.

id 속성에 기본값을 할당하는 초기화자를 추가하세요.
매개변수에 기본값을 정의하면, 초기화자나 함수를 호출할 때 그 매개변수를 생략할 수 있습니다.

Step 4.

이제 DailyScrum이 Identifiable 프로토콜에 준수하므로, List 초기화자를 간소화할 수 있습니다.

ScrumsView.swift에서 List 초기화자에서 id 매개변수를 제거하세요.

Step 5.

이제 ScrumsView를 앱의 루트 뷰로 설정할 것입니다. SwiftUI 앱을 만들려면 App 프로토콜에 준수하는 구조체를 선언합니다. 앱의 body 속성은 앱의 기본 사용자 인터페이스를 나타내는 뷰 계층을 포함하는 Scene을 반환합니다.

ScrumdingerApp.swift를 열고 앱의 초기 뷰로 ScrumsView를 설정하세요.

WindowGroup은 SwiftUI가 제공하는 기본 씬 중 하나입니다. iOS에서는 WindowGroup 씬 빌더에 추가한 뷰가 장치의 전체 화면을 채우는 윈도우에 표시됩니다.

Step 6.

앱을 시뮬레이터에서 빌드하고 실행하여 앱이 시작될 때 ScrumsList가 나타나는지 확인하세요.

지금까지 많은 것을 달성했습니다. Scrumdinger의 주요 화면 중 두 개인 MeetingView와 ScrumsView를 설계하고, 앱의 루트 뷰를 설정했습니다. 다음 장에서는 사용자가 뷰 간에 탐색할 수 있는 기능을 추가하여 앱을 더 인터랙티브하게 만들 것입니다.