TextField – SwiftUI

TextField in SwiftUI – is a control that displays an editable text interface.

SwiftUI TextField Example

   @State var text: String = "TextField Text"
   
    var body: some View {
        TextField("Placeholder Text", text: $text)
    }
    

How to add a border to a TextField in SwiftUI

To add a border to a TextField in SwiftUI use a RoundedBorderTextFieldStyle modifier. By default TextField has PlainTextFieldStyle() modifer.

   @State var text: String = "TextField Text"
   
    var body: some View {
        TextField("Placeholder Text", text: $text)
            .textFieldStyle(RoundedBorderTextFieldStyle())
            .padding(.all, 20)
    }

How to make a TextField text bold

How to change a cursor color of a TextField in Swift

Changing the background color of a TextField in SwiftUI

It is easy to change the background color of a TextField in SwiftUI, but remember to use .cornerRadius() instead of the RoundedBorderTextFieldStyle()

How to change the color of a TextField text

Just use .foregroundColor to change the text color of a TextField in SwiftUI.

    @State var text: String = "TextField Text"
    
    var body: some View {
        
        TextField("Placeholder Text", text: $text)
            .padding(.all, 20)
            .foregroundColor(Color.yellow)
       
    }

Changing the Placeholder text color of a TextField

To change the placeholder text color create the new SuperTextField struct first.

How to center text of a TextField

To center text of a TextField in SwiftUI use .multilineTextAlignment(_:) modifier . It can have .center, .leading and .trailing values. To center text in a TextField use .center.

   @State var text: String = "TextField Text"
    
    var body: some View {
        
        TextField("Placeholder Text", text: $text)
            .padding(.all, 20)
            .multilineTextAlignment(.center)
        
    }

Learn more about SwiftUI using SwiftUI Tutorials by the AppMakers

If anything will change in the future, it is OK, you can always check the official documentation.

TextField Documentation

Leave a comment to Submit the NEW and USEFUL code related to the topic of this post.
Submit a brief and useful code only.