Cómo agregar un Toolbar al teclado en SwiftUI

Marcelo Laprea

07 febrero, 20241min de lectura

En SwiftUI, contamos con el modificador toolbar(content:), el cual nos permite incorporar un Toolbar al teclado. Este modificador espera una colección de vistas utilizando ToolbarItem o ToolbarItemGroup. Veamos un ejemplo:

Utilizando ToolbarItem

import SwiftUI

struct ContentView: View {
    @State private var text: String = ""
    
    var body: some View {
        TextField("Write something", text: $text)
            .padding(.horizontal)
            .toolbar {
                // 1
                ToolbarItem(placement: .keyboard) {
                    // 2
                    Button("done") {
                        print("done")
                    }
                }
            }
    }
}

1. Creamos el ToolbarItem(placement: .keyboard) especificando .keyboard como ToolbarItemPlacement, indicando que queremos este elemento en nuestro teclado.
2. Agregamos la View que deseamos, en nuestro caso, un Button.

Utilizando ToolbarItemGroup

.toolbar {
    // 1
    ToolbarItemGroup(placement: .keyboard) {
        // 2
        Button("done") {
            print("done")
        }
        Button("cancel") {
            print("cancel")
        }
    }
}

1. A diferencia del ejemplo anterior, ahora creamos un ToolbarItemGroup(placement: .keyboard) indicando el mismo ToolbarItemPlacement.
2. La diferencia con respecto al ToolbarItem es que ahora podemos añadir dos o más View. En nuestro caso, dos Button.