0

I'm a newbie developer. Based on what I've read, in the latest version of Xcode it is possible to add a toolbar item to the keyboard in a straightforward manner:

TextField("Today's weight", text: $weight)
                            .textFieldStyle(.roundedBorder)
                            .keyboardType(.decimalPad)
                            .toolbar {
                                ToolbarItem(placement: .keyboard) {
                                    
                                    Button("Click") {
                                        isKeyBoardActive = false
                                    }
                                }
                            }

The app is designed with TabView for navigation rather than a navigation view. Based on this link I assumed that Xcode 13.1 would require a navigation view for this to work, but Xcode 13.2 would not. I've confirmed that my Xcode version is 13.2.1.

I've also tried the code with 'ToolbarItem' and 'ToolbarItemGroup'. When my app is run, no toolbar appears with either variation.

Any help would be greatly appreciated.

Edit: Upon further troubleshooting, I've realised that embedding the TextField in the TabView causes it not to work. If its a standalone view (i.e. not in a TabView) the toolbar item is added as expected. Extracting the TextField to its own subview while within TabView doesn't seem to work either.

user16405656
  • 11
  • 3
  • Working fine in Xcode 13.2.1, iOS 15.2, removing the `isKeyBoardActive = false` as we don't have that var. – Yrb Jan 13 '22 at 14:40
  • @yrb - I did some additional troubleshooting. I realised it doesn't work when the textfield is invoked within a TabView but if its a standalone view it works. Any suggestions on how to get it to work within a TabView? My apps structure is based on tab view so I can't see a way around it. – user16405656 Jan 14 '22 at 05:05
  • No, but I would ask that as a new question with an actual [Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example) that is an accurate representation of your app's structure. Then we could play with it and try to fix it. Also, please take the [tour](https://stackoverflow.com/tour) and see: [How do I ask a good question?](https://stackoverflow.com/help/how-to-ask) and [How to create a Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example). You are more likely to get an answer following the instructions in the links. – Yrb Jan 14 '22 at 12:31
  • @Yrb - Thanks for your response! I managed to figure this out by attaching the toolbar to the entire TabView instead of the textfield. But I do appreciate you sharing the links and will keep them in mind the next time I need to ask a question. – user16405656 Jan 15 '22 at 02:57
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Jan 25 '22 at 06:43

1 Answers1

0

You need that toolbar attribute to be inside a NavigationView, NavigationSplitView or similar for this to work.

Also use the focused attribute in case you want that "Click" button to dismiss the keyboard.

@FocusState private var isKeyBoardActive: Bool

var body: some View {
    NavigationView {
        TextField("Today's weight", text: $weight)
            .textFieldStyle(.roundedBorder)
            .keyboardType(.decimalPad)
            .focused($isKeyBoardActive)
            .toolbar {
                ToolbarItem(placement: .keyboard) {
                    Button("Click") {
                        isKeyBoardActive = false
                    }
                }
            }
    }
}
aone
  • 57
  • 8