In a NavigationView I have a Form b/c where I have several items, the first of which is a Picker (which I want the Form->Picker navigator behavior for).

All elements in my Form appear to be about 10 px or so from the edges of the screen. I'm building some custom widgets and want the Form to use the full width of the device display.

    @State var shapeHeight: CGFloat = 50
    @State var selection: String = ""
    var body: some View {
        NavigationView {
            VStack {
                Form {
                    Section(header: Text("PickerView in Form"), content: {
                        Picker(selection: $selection, label:
                        Text("Picker Name")
                        , content: {
                            Text("Value 1").tag(0)
                            Text("Value 2").tag(1)
                            Text("Value 3").tag(2)
                            Text("Value 4").tag(3)
                        })
                    })

                    Section(header: Text("Rectangle shape in Form"), content: {
                        Rectangle()
                        .fill(Color.red)
                        .frame(width: UIScreen.main.bounds.size.width, height: shapeHeight)
                    })

                    Rectangle()
                    .fill(Color.blue)
                    .frame(width: UIScreen.main.bounds.size.width, height: shapeHeight)

                    Text("Last text form")
                }

                Rectangle()
                    .fill(Color.purple)
                .frame(width: UIScreen.main.bounds.size.width, height: shapeHeight)

                Spacer()
                Text("Last text in view")
            }
        }
    }

The above code presents as below. What I want is either #1 or #2 (either is fine)

LInk to screen shot showing issue

Anybody know how to make Form element take up the full screen width?