ObjecTips

Swift & Objective-C で iOS とか macOS とか

Xcode 12 の SwiftUI + Core Data のプロジェクトテンプレートが不完全

新規プロジェクト作成でプロジェクトテンプレートから iOS App を選択

f:id:Koze:20210427063905p:plain:w600

Interface SwiftUI, Life Cycle SwiftUI App, Language Swift を選択して Use Core Data をチェック

f:id:Koze:20210427063950p:plain:w600

作成される初期画面 ContentViewbody とビルド結果は以下

    var body: some View {
        List {
            ForEach(items) { item in
                Text("Item at \(item.timestamp!, formatter: itemFormatter)")
            }
            .onDelete(perform: deleteItems)
        }
        .toolbar {
            #if os(iOS)
            EditButton()
            #endif

            Button(action: addItem) {
                Label("Add Item", systemImage: "plus")
            }
        }
    }

f:id:Koze:20210427075543p:plain:w400

画面が真っ白で何も表示されない。

1つ目の原因は NavigationView の指定が無いこと。toolbar のコンテンツを表示するには NavigationView が必要なのでまず body の中身のルートの ListNavigationView に入れる。

    var body: some View {
        NavigationView {
            List {
                // 省略
            }
            .toolbar {
                // 省略
            }
        }
    }

f:id:Koze:20210427080655p:plain:w400

編集ボタンが表示された。でもまだ項目追加のプラスボタンが表示されていない。

次に toolbar のコンテンツの各ボタンを ToolbarItem に入れる。引数の placement は今回は navigationBarLeading navigationBarTrailing を使用。

    var body: some View {
        NavigationView {
            List {
                // 省略
            }
            .toolbar {
                #if os(iOS)
                ToolbarItem(placement: .navigationBarLeading) {
                    EditButton()
                }
                #endif
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button(action: addItem) {
                        Label("Add Item", systemImage: "plus")
                    }
                }
            }
        }
    }

f:id:Koze:20210427083621p:plain:w400

プラスボタンを押すと後はテンプレートの実装通り動作しリストが表示される。

f:id:Koze:20210427083802p:plain:w400

これから初めて Swift/SwiftUI をやるぞって時にテンプレートがこの有様だとスタートでつまづいてしまうのでヘルプになればと思いシェアです*1

*1:このテンプレートの不具合が気になった人は Feedback Assistant にレポートしてくれると幸い