Swiftui 显示 picker 选择的项目

Question

如何才能只显示选择器选择的项目。

目前我正在使用不透明度，但这不是正确的解决方案，因为如果不透明度为 0，则每个元素的 space 保持不变。

代码：

import SwiftUI

struct ContentView: View {
    @State public var select = 0
    @State public var bgColor = Color.blue
    @Environment(\.colorScheme) var colorScheme
    
    var cornerRadius: CGFloat = 16
    
    
    @State var isShowPicker: Bool = false
    @State var image: Image? = Image("placeholder")
    
    @State private var url: String = "https://a.wattpad.com/useravatar/climaxmite.256.718018.jpg"
    
    init() {
        // Segmented control colors
        UISegmentedControl.appearance().backgroundColor = .systemGray6
        UISegmentedControl.appearance().selectedSegmentTintColor = UIColor(Color.blue)
        UISegmentedControl.appearance().setTitleTextAttributes([.foregroundColor: UIColor.systemBackground], for: .selected)
        UISegmentedControl.appearance().setTitleTextAttributes([.foregroundColor: UIColor.label], for: .normal)
    }
    
    var body: some View {
        VStack{
            
            ZStack {
                RoundedRectangle(cornerRadius: cornerRadius)
                    .frame(width: UIScreen.main.bounds.width-40, height: 100, alignment: .center)
                    .foregroundColor(colorScheme == .dark ? .black : .white)
                VStack(spacing: 12) {
                    ZStack {
                        Rectangle()
                            .frame(width: UIScreen.main.bounds.width-47, height: 35, alignment: .center)
                            .foregroundColor(Color(UIColor.systemGray6))
                            .cornerRadius(cornerRadius, corners: [.topLeft, .topRight])
                        Text("Select Background")
                            .foregroundColor(Color(UIColor.label))
                            .font(.subheadline)
                            .bold()
                    }
                    Picker(selection: $select, label: Text("Select Background")) {
                        Text("Url").tag(0)
                        Text("Select Image").tag(1)
                        Text("Gradient").tag(2)
                    }.pickerStyle(SegmentedPickerStyle())
                    .padding(EdgeInsets(top: 0, leading: 30, bottom: 0, trailing: 30))
                    Spacer()
                        .frame(height: 3)
                }
            }
            
            ZStack {
                RoundedRectangle(cornerRadius: cornerRadius)
                    .frame(width: UIScreen.main.bounds.width-40, height: 42, alignment: .center)
                    .foregroundColor(Color(UIColor.systemBackground))
                TextField("http://", text: $url)
                    .padding(10)
                    .frame(width: UIScreen.main.bounds.width-40)
                    .foregroundColor(Color(UIColor.label))
                    .cornerRadius(cornerRadius)
                    .padding(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 10))
            }
            .opacity(self.select == 0 ? 1 : 0)
            
            VStack {
                Button(action: {
                    withAnimation {
                        self.isShowPicker.toggle()
                    }
                }) {
                    Image(systemName: "photo")
                        .font(.headline)
                    Text("IMPORT").font(.headline)
                }.foregroundColor(.black)
            }
            .sheet(isPresented: $isShowPicker) {
                ImagePicker(image: self.$image)
            }        .opacity(self.select == 1 ? 1 : 0)
            
            ZStack {
                ColorPicker("Set the background color", selection: $bgColor)
            }
            .padding(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 10))
            .opacity(self.select == 2 ? 1 : 0)
            
            Spacer()
        }
        .padding(.top, 25)
        .ignoresSafeArea(.keyboard)
        .background(Color(UIColor.systemGray6))
        .edgesIgnoringSafeArea(.all)
    }
}

Answer 1

使用条件包含相应的视图，例如

 if self.select == 0 {   // << here !!
    ZStack {
        RoundedRectangle(cornerRadius: cornerRadius)
            .frame(width: UIScreen.main.bounds.width-40, height: 42, alignment: .center)
            .foregroundColor(Color(UIColor.systemBackground))
        TextField("http://", text: $url)
            .padding(10)
            .frame(width: UIScreen.main.bounds.width-40)
            .foregroundColor(Color(UIColor.label))
            .cornerRadius(cornerRadius)
            .padding(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 10))
    }
}

Swiftui 显示 picker 选择的项目

Swiftui display item selected by picker

xcode

picker

swift

swiftui