DevB1
DevB1

Reputation: 1565

SwiftUI picker with no title

I'm trying to add a simple picker functionality by SwiftUI. Essentially the outcome I'm looking for is something like this: enter image description here

When clicking on the arrow, it should take user to a new view where they select the required unit.

I tried something like this:

var units = ["ltr", "usg", "impg"]

@State private var selectedUnit = 0

var body: some View {
    Form {
        Section {
            VStack {
                Picker(selection: $selectedUnit, label: Text("")) {
                    ForEach(0 ..< units.count) {
                        Text(self.units[$0])
                        
                    }
                }.frame(width: 42)
            }
            
        }
    }.navigationBarTitle("Select unit")
}

But the as soon as this is wrapped in a form, it requires the title etc. and takes up too much space. I simply want to have the units as my base view. Is there any way to accomplish this?

Upvotes: 4

Views: 3842

Answers (3)

shahed
shahed

Reputation: 416

Try this:

var body: some View {
    Picker("Select a number", selection: $selectedNumber) {
        ForEach(0..<10) {
            Text("\($0)")
        }
    }
    .labelsHidden()        
}

Upvotes: 1

gklka
gklka

Reputation: 2574

Picker("", selection: $data) {
    ForEach(data, id:\self) { child in
        Text(child)
    }
}
.pickerStyle(InlinePickerStyle())
.labelsHidden()

Try .labelsHidden()

Upvotes: 13

Dorukhan Arslan
Dorukhan Arslan

Reputation: 2754

Pass an EmptyView instance as the label of Picker to hide the title at top:

Picker(selection: $selectedUnit, label: EmptyView()) {
    ForEach(0 ..< units.count) {
        Text(self.units[$0])
    }
}

Upvotes: 4

Related Questions