Picker 会根据平台显示所要展示的效果

Picker

struct Picker<Label, SelectionValue, Content> where Label : View, SelectionValue : Hashable, Content : View

用法

Picker基础用法

var strengths = ["男", "女"]
@State private var selectedStrength = 0
var body: some View {
    Form {
        Picker(selection: $selectedStrength, label: Text("Strength")) {
            ForEach(0 ..< strengths.count) {
                Text(self.strengths[$0]).tag($0)
            }
        }
    }
}
// Core Data中用法
Button(action: ({
    let user = User(context: self.managedObjectContext)
    user.name = self.selectedStrength
    do {
        try self.managedObjectContext.save()
    } catch { print(error) }
}))

Picker中使用自定义结构体

@ObservedObject var frequencies = DrugUserInfoes()  //吃药频率

var body: some View {
    Form {
        Picker("服药频率", selection: $frequencies.drugEatInfoes) {
            ForEach(DrugUserInfoes.DrugEatInfoes.allCases, id: \.self) { season in
                Text(season.rawValue).tag(season)
            }
        }
    }
}

class DrugUserInfoes: ObservableObject {
    enum DrugEatInfoes: String, CaseIterable {
        case day1eat1 = "一天一次"
        case day1eat2 = "一天两次"
    }
    
    //设置默认选择项
    @Published var drugEatInfoes = DrugEatInfoes.day1eat2
}

// Core Data中用法
Button(action: ({
    let eatInfo = EatInfo(context: self.managedObjectContext)
    eatInfo.frequency = self.frequencies.drugEatInfoes.rawValue
    do {
        try self.managedObjectContext.save()
    } catch { print(error) }
}))

Picker中使用API Json

@ObservedObject var networkingManager = NetworkingManager() //读取API数据

var body: some View {
    Form {
        //请求API返回药品列表
        Picker(selection: $selection, label: Text("药品名称").bold()) {
            ForEach(0 ..< networkingManager.dataList.data.count, id: \.self) {
                Text(self.networkingManager.dataList.data[$0].name).tag($0)
            }
        }
    }
}

// Core Data中用法
Button(action: ({
    let eatInfo = EatInfo(context: self.managedObjectContext)
    eatInfo.name = self.networkingManager.dataList.data[self.selection].name
    do {
        try self.managedObjectContext.save()
    } catch { print(error) }
}))

DatePicker

SwiftUI的DatePicker视图类似UIDatePicker，并带有各种各样的选择来控制它的外观和运行。 像所有存储值的控件一样，它确实需要绑定到应用程序中的某种状态。

例如，这创建了一个绑定到生成日期属性的日期选项，允许用户先选择任何日期，然后显示日期选项的值，因为该选项设置时即可：

struct ContentView: View {
    var dateFormatter: DateFormatter {
        let formatter = DateFormatter()
        formatter.dateStyle = .long
        return formatter
    }

    @State private var birthDate = Date()

    var body: some View {
        VStack {
            DatePicker(selection: $birthDate, in: ...Date(), displayedComponents: .date) {
                Text("Select a date")
            }

            Text("Date is \(birthDate, formatter: dateFormatter)")
        }
    }
}

在其他控件中的用法

翻页选择

嵌套在Form中，就会有NavigationView的显示效果


var users1 = ["男", "女"]
var body: some View {
    Form {
        Picker(selection: $gender, label: Text("性别").bold()) {
            Text("女").tag(1)
            Text("男").tag(2)
        }.pickerStyle(SegmentedPickerStyle())
    }
}

标准样式

.pickerStyle

  1. DefaultPickerStyle
  2. PopUpButtonPickerStyle（macOS）
  3. RadioGroupPickerStyle（macOS）
  4. SegmentedPickerStyle（macOS、iOS、tvOS、Mac Catalyst）
  5. WheelPickerStyle（iOS、watchOS、Mac Catalyst）

SegmentedPickerStyle

横向选择

var users1 = ["男", "女"]
var body: some View {
    VStack {
        Picker(selection: $gender, label: Text("性别").bold()) {
            Text("女").tag(1)
            Text("男").tag(2)
        }.pickerStyle(SegmentedPickerStyle())
    }
}
iOS效果

macOS效果
tvOS效果
Mac Catalyst效果

WheelPickerStyle

竖向选择

var users1 = ["男", "女"]
var body: some View {
    VStack {
        Picker(selection: $gender, label: Text("性别").bold()) {
            Text("女").tag(1)
            Text("男").tag(2)
        }.pickerStyle(WheelPickerStyle())
    }
}
iOS效果

macOS效果
tvOS效果
Mac Catalyst效果

PopUpButtonPickerStyle

RadioGroupPickerStyle

其他

.labelsHidden()

隐藏标签

这仍然创造了标签，但现在却没有显示出来。 因此，您可以将Picker放入VStack中，并添加您自己选择的标签。
提示：如果你想要隐藏所有标签，你可以将标签 .labelsHidden() 修改符应用到VStack或你所使用的最外层容器中。