SwiftUI Previews Variants & States

SwiftUI Previews Variants & States

Preview multiple configurations by creating different states and variants in your preview provider.

Preview multiple variants side-by-side

Use a Group in your preview to render several configurations at once for quick comparison.

import SwiftUI

struct Badge: View { let color: Color; var body: some View { Circle().fill(color).frame(width: 40, height: 40) } }

struct Badge_Previews: PreviewProvider {
  static var previews: some View {
    Group {
      Badge(color: .blue)
      Badge(color: .green)
    }
  }
}

In the example above, the Group container is used to render multiple variants of the Badge view side-by-side.