【SwiftUI】Widgetのpreviewについて

SwiftUI

2022.10.04

SwiftUIのpreview機能ではWidgetのプレビューも可能です。
各種WidgetFamilyをそれぞれプレビュー出来るので気軽に確認しながら作成できます。

プレビュー方法
余談

プレビュー方法

Widgetを追加した際に以下のようなコードが追加されます。

struct WidgetTest_Widget_Previews: PreviewProvider {
    static var previews: some View {
        WidgetTest_WidgetEntryView(entry: SimpleEntry(date: Date()))
            .previewContext(WidgetPreviewContext(family: .systemSmall))
    }
}

通常のアプリと同じようにpreviewのコードを使用する事ができます。

まず注目すべき点の1つ目は、あくまでWidget内のViewをpreviewしている事です。
Widgetを継承した構造体自体をpreviewしている訳ではありません。
その分、中のViewを個別にpreview出来るようになっています。

次にpreviewContextです。
ここでWidgetPreviewContextでWidgetFamilyを指定します。
これで好きなWidgetFamilyのpreviewができます。
なおViewファイルを分割した際にはimport WidgetKitを忘れないようにして下さい。

ロック画面のWidgetも確認出来るので非常に便利です。
また、複数のViewを書く事でタブを切り替える様にしてpreviewを切り替えられます。

struct WidgetTest_Widget_Previews: PreviewProvider {
    static var previews: some View {
        WidgetTest_WidgetEntryView(entry: SimpleEntry(date: Date()))
            .previewContext(WidgetPreviewContext(family: .systemSmall))

        WidgetTest_WidgetEntryView(entry: SimpleEntry(date: Date()))
            .previewContext(WidgetPreviewContext(family: .accessoryRectangular))
    }
}