How to use secure password text field in SwiftUI with SecureField

SecureField in SwiftUI is a simple control that shows an editable text interface while masking user input to keep it private just in case anyone was watching over their shoulder.  SecureField is great for creating secure password input text fields and it works exactly the same as regular TextField. We’ve covered TextField extensively in a previous tutorial so jump in there to learn more about how to use TextField.

In order to initialize a SecureField, you need to pass in a placeholder string and a binding to a @State variable which will store the value entered in the SecureField. In the following example we’ve also added a little bit of styling which adds a border to the SecureField and adds default padding around it:

struct ContentView: View {
    @State var password: String = ""
    
    var body: some View {
        SecureField("Enter password...", text: $password)
            .textFieldStyle(RoundedBorderTextFieldStyle())
            .padding()
    }
}
Secure password text field using SecureField in SwiftUI
Secure password text field using SecureField in SwiftUI

Related tutorials:

Check out Apple’s official documentation of SecureField to learn more.