追記
2021-08-24
: Xcode 12 では本記事で説明している不具合は解消されているため、対応の必要はありません。
SwiftUI の PreviewProvider
は Group
を使うことで複数のプレビューを同時に生成することができます。
struct ContentView_Previews: PreviewProvider {static var previews: some View {Group {ContentView().environment(\.colorScheme, .dark)ContentView().environment(\.colorScheme, .light)}}}
しかし、実際に Canvas に表示されるプレビューを見てみると、
.dark
を設定したはずの View の background は白くなってしまっています。
これは既知の不具合で、暫定的ではありますが extension
を使った応急処置で対処できます。
Extension
import SwiftUIpublic struct DarkView<Content>: View where Content: View {var wrappedContent: Contentpublic init(@ViewBuilder content: () -> Content) {self.wrappedContent = content()}public var body: some View {ZStack {// Set background colorColor.black.edgesIgnoringSafeArea(.all)// Set color schemewrappedContent.environment(\.colorScheme, .dark)}}}extension View {public func darkMode() -> DarkView<Self> {DarkView {self}}}
ZStack
で wrappedContent
の背景に Color.black
を配置しています。
使い方
struct ContentView_Previews: PreviewProvider {static var previews: some View {Group {ContentView().darkMode()ContentView()}}}
.darkMode()
を付けるだけで OK です。
将来的に不具合が修正されたら .environment(\.colorScheme, .dark)
に変更してあげましょう。