SwiftUI 操作表选择器

Posted

技术标签:

【中文标题】SwiftUI 操作表选择器【英文标题】:SwiftUI ActionSheet Picker 【发布时间】:2020-02-02 18:07:57 【问题描述】:

我正在尝试在 SwiftUI 中创建一个在按下按钮后出现的操作表,并允许用户通过选择器选择并返回项目(例如 https://imgur.com/a/IbS7swX)。

有什么提示吗?

谢谢

【问题讨论】:

【参考方案1】:
struct ContentView: View 
  init() 
    UITableView.appearance().separatorColor = .clear
   
var inputArray = ["100","101","102"]
@State var slectedSegmant = "ActionSheet"
@State var slectedObj = "101"
@State var enableSheet = false
var test = false
var body: some View 
    ZStack 
        VStack(spacing: 10) 
            Picker(selection: $slectedSegmant, label: Text("Segment")) 
                Text("Alert").tag("Alert")
                Text("ActionSheet").tag("ActionSheet")
            .pickerStyle(SegmentedPickerStyle())
                .labelsHidden()
                .padding(EdgeInsets.init(top: 50, leading: 10, bottom: 0, trailing: 10))

            Text("Alert & Pickers")
                .font(Font.system(size: 35, design: .rounded))
                .fontWeight(.bold)
                .frame(maxWidth: .infinity, alignment: .leading)
                .padding(.horizontal)

            List((0...50),id: \.self)  input in
                ZStack 
                    HStack(spacing: 10) 
                        Image(systemName: "book")
                            .font(.title)
                            .padding(.leading, 10)
                        VStack(alignment: .leading, spacing: 5, content: 
                            Text("Simple")
                            Text("3 different buttons")
                        )
                        Spacer()
                    .padding(.vertical)
                        .frame(maxWidth:.infinity)
                        .background(RoundedRectangle(cornerRadius: 10).foregroundColor(Color.white).shadow(radius: 1.5)
                        )

                    Button(action: 
                        self.enableSheet = true
                    ) 
                        Text("")
                    
                
            .padding()
        .blur(radius: $enableSheet.wrappedValue ? 1 : 0)
            .overlay(
                $enableSheet.wrappedValue ? Color.black.opacity(0.6) : nil
            )
       if $enableSheet.wrappedValue 
            GeometryReader  gr in
                VStack 
                    VStack 
                        Text("PickerView")
                            .font(.headline)
                            .foregroundColor(.gray)
                            .padding(.top, 10)
                        Text("Prefered ContentHeight")
                            .padding(.top, 5)
                        Picker("test", selection: self.$slectedObj) 
                            Text("100").id("100")
                            Text("101").id("101")
                            Text("101").id("102")
                        .labelsHidden()
                    .background(RoundedRectangle(cornerRadius: 10)
                        .foregroundColor(Color.white).shadow(radius: 1))
                    VStack 
                        Button(action: 
                            debugPrint("Done Selected")
                            self.enableSheet = false
                        ) 
                            Text("Done").fontWeight(Font.Weight.bold)
                        .padding()
                            .frame(maxWidth: gr.size.width  - 90)
                            .background(RoundedRectangle(cornerRadius: 10)
                            .foregroundColor(Color.white).shadow(radius: 1))

                    
                .position(x: gr.size.width / 2 ,y: gr.size.height - 200)
            
        
    .edgesIgnoringSafeArea(.all)
  
 

输出

【讨论】:

以上是关于SwiftUI 操作表选择器的主要内容,如果未能解决你的问题,请参考以下文章

SwiftUI - 日期选择器未正确显示

SwiftUI - 选择器

来自先前选择器的选择器值 - CoreData/SwiftUI

选择器(SegmentedPickerStyle)中的选择效果不佳 - SwiftUI

SwiftUI 选择器分隔符

如何让 SwiftUI 中的选择器输出选择的值?