Xcode에는 요소 라이브러리가 포함되어 SwiftUI 뷰 요소를 쉽게 탐색할 수 있습니다. 이것은 컴퍼넌트의 사용에 있어서 컴퍼넌트명을 기억할 필요가 없기 때문에 편리합니다.

자체 제작 SwiftUI 요소를 Xcode 라이브러리에 추가할 수도 있습니다. 이것은, 당신이 개발한 SwiftUI 뷰를 사용해 Swift Package 를 개발하는 경우에 편리합니다. 다른 개발자가 Swift Package를 사용할 때 라이브러리에 무엇이 포함되어 있는지 즉시 이해할 수 있습니다.

또한 Xcode는 프로젝트의 모든 파일과 가져온 SwiftUI 패키지의 뷰 요소를 표시할 수 있는 장점 중 하나입니다.

Xcode의 SwiftUI 라이브러리 사용

먼저 SwiftUI의 미리보기 이미지가 Xcode 창의 코드 오른쪽에 표시되는지 확인합니다. 그렇지 않은 경우 레이아웃 버튼을 클릭하고 Canvas를 전환하십시오.



Xcode SwiftUI 라이브러리를 열려면 Xcode 창 상단의 더하기 아이콘을 클릭합니다. 키보드 단축키 command-shift-L를 사용할 수도 있습니다.



선택할 수 있는 여러 탭이 있습니다.

첫 번째 탭에는 SwiftUI 뷰 요소가 포함되어 있습니다.



두 번째 탭에는 SwiftUI 한정자가 포함되어 있습니다.



항목을 두 번 클릭하면 해당 항목의 코드가 코드 편집기의 현재 커서 위치에 삽입됩니다.

자신의 구성 요소를 라이브러리에 추가

직접 디자인한 SwiftUI 보기가 많으면 LibraryContentProvider 를 사용하여 Xcode 라이브러리에 추가할 수 있습니다.

예를 들어, 나는 한 마리의 고양이에 대한 정보를 볼 수 있도록 하는 CatInfoCell라는 SwiftUI 뷰를 디자인했습니다.
LibraryContentProvider 에 대한 확인을 수행하는 구조체를 만들면 프로젝트의 모든 파일이 하나 있습니다. 이 구조체의 이름은 문제가 되지 않습니다.

struct CatInfoLibraryContent: LibraryContentProvider {
    @LibraryContentBuilder
    var views: [LibraryItem] {
        LibraryItem(
            CatInfoCell(displayedCat: .example, displayCatImage: false),
            title: "猫の情報ビュー",
            category: .control
        )
    }
}

또한 동일한 요소에 대해 다른 설정으로 여러 항목을 정의할 수 있습니다.

struct CatInfoLibraryContent: LibraryContentProvider {
    @LibraryContentBuilder
    var views: [LibraryItem] {
        LibraryItem(
            CatInfoCell(displayedCat: .example, displayCatImage: false),
            title: "猫の情報ビュー",
            category: .control
        )
        LibraryItem(
            CatInfoCell(displayedCat: .example, displayCatImage: true),
            title: "画像付きの猫の情報ビュー",
            category: .control
        )
    }
}

이제 Xcode 라이브러리에서 다음 두 가지 뷰 요소를 볼 수 있습니다.



Xcode 라이브러리에서 요소를 추가하면 LibraryContentProvider 구조체에 정의된 구성이 제공됩니다.

Xcode 라이브러리에 자체 뷰 수정자 추가

라이브러리에 자신의 뷰 수정자를 추가할 수도 있습니다.

struct CatInfoLibraryContent: LibraryContentProvider {
    @LibraryContentBuilder
    var views: [LibraryItem] {
        //...
    }
    @LibraryContentBuilder
    func modifiers(base: Text) -> [LibraryItem] {
        LibraryItem(
            base.makeRoundedButton(color: .orange)
        )
    }
}

결론

만약 여러분의 프로젝트가 소수의 커스텀 뷰 엘리먼트만 가지고 있는 단순한 것이라면, Xcode SwiftUI 라이브러리를 사용할 필요가 없을 수도 있습니다.

하지만 많은 사용자 정의 요소가 있거나 팀에서 프로젝트를 수행하는 경우 Xcode 라이브러리에 요소를 추가하여 다른 사람들이 디자인한 요소를 사용하거나 이해할 수 있습니다. 더 쉽게 될 수 있습니다.

여기를 클릭하여 Github에서 코드 보기

트위터 @MszPro

내 게시된 Qiita 기사 목록을 카테고리별로 확인할 수 있습니다.