Creating a multi-line picker in SwiftUI

This is a way to create a multi-line picker like UIPickerView. The usability is quite different from UIPickerView and I was puzzled.

Multi-Component Picker Sample

	import SwiftUI

	struct ContentView: View {
	@State private var selectedHour = 8
	@State private var selectedMinute = 30

	var body: some View {
	GeometryReader { geometry in
	HStack {
	Picker(selection: self.$selectedHour, label: EmptyView()) {
	ForEach(0 ..< 24) {
	Text("\($0)")
	}
	}.pickerStyle(WheelPickerStyle())
	.onReceive([self.selectedHour].publisher.first()) { (value) in
	print("hour: \(value)")
	}.labelsHidden()
	.frame(width: geometry.size.width / 2, height: geometry.size.height)
	.clipped()

	Picker(selection: self.$selectedMinute, label: EmptyView()) {
	ForEach(0 ..< 60) {
	Text("\($0)")
	}
	}.pickerStyle(WheelPickerStyle())
	.onReceive([self.selectedMinute].publisher.first()) { (value) in
	print("minute: \(value)")
	}.labelsHidden()
	.frame(width: geometry.size.width / 2, height: geometry.size.height)
	.clipped()
	}
	}.padding()
	}
	}

	struct ContentView_Previews: PreviewProvider {
	static var previews: some View {
	ContentView()
	}
	}

view raw ContentView.swift hosted with ❤ by GitHub