[SwiftUI]TextField(テキストフィールド)に削除ボタン(delete cancel button)を追加する(add)には？

どうも、ちょげ(@chogetarou)です。

TextFieldの入力された文字を１文字削除するボタンを追加する方法を紹介します。

方法
使用例

方法

TextFieldに削除ボタンを追加するには、dropLastメソッドを使います。

まず、TextFieldをHStackで囲い、TextFieldの後にButtonを指定します。

そして、Buttonの引数「action」にクロージャーに、dropLastで１文字削除する処理を追加します。

HStack {
    TextField("",text: $editingText)
    Button(action: {
        self.editingText = String(editingText.dropLast(1))
    }){/*ラベル*/}
}

dropLastメソッドを使えば、TextFieldに削除ボタンを追加することができます。

使用例

以下は、使用例です。

struct ContentView: View {
    @State var editingText = ""
    
    var body: some View {
        HStack {
            TextField("Your Text",text: $editingText)
                .padding()
            Button(action: {
                self.editingText = String(editingText.dropLast(1))
            }){
                Image(systemName: "clear")
            }
        }
        .padding()
    }
}