cornerRadius or shadow on VStack killing Picker

Hi,

I have a very strange problem. On my View I have 2 Picker and a Button embedded in a VStack. I can format the VStack and the Picker are working properly. As soon as I add a cornerRadius or a shadow to the VStack the Pickers are shown but nothing can be changed any more.

Is this a known problem and are there any workarounds?


Here is my code:

struct TestView: View {
    @State private var someSelection1 = 1
    @State private var someSelection2 = 1
    
    var body: some View {
        Group {
            VStack {
                Picker(selection: $someSelection1, label: Text("Demo 1")) {
                    Text("Option 1").tag(1)
                    Text("Option 2").tag(2)
                    Text("Option 3").tag(3)
                }
                .pickerStyle(SegmentedPickerStyle())
                
                Picker(selection: $someSelection2, label: Text("Demo 2")) {
                    Text("Sub 1").tag(1)
                    Text("Sub 2").tag(2)
                    Text("Sub 3").tag(3)
                    Text("Sub 4").tag(4)
                }
                .pickerStyle(SegmentedPickerStyle())
                
                Spacer()
                Button(action: { print("Start button pressed")}) {
                    Text("Start")
                        .frame(minWidth: 0, maxWidth: .infinity, minHeight: 20, maxHeight: 40)
                        .foregroundColor(Color.white)
                        .font(.custom("Rubik-Bold", size: 22))
                }
                .background(Color.blue)
// comment line 32 and 33 and the issue is gone
                .cornerRadius(10)
                .shadow(radius: 10)
            }
            .padding(.top, 40)
            .padding(10)
            .background(Color("Background"))
            .cornerRadius(20)
            .shadow(radius: 10)
        }
        .padding(.top, 180)
        .padding(.leading, 20)
        .padding(.trailing, 20)
        .padding(.bottom, 10)
        .background(Color("Background"))
    }
}

struct TestView_Previews: PreviewProvider {
    static var previews: some View {
        TestView()
    }
}


Thanks for your help

Erik

This is happening to me also. It will work if VStack{} is changed to ScrollView{} or Form{}.
For IOS 14 and MacCatalyst
XCode Version 12.0 (12A7209)
Hello, can you try to change the cornerRadius and shadow to the text instead of the button?
that works for me.
cornerRadius or shadow on VStack killing Picker
 
 
Q