swiftswiftuibordertextfieldcornerradius

I have trouble using cornerradius and borders on a textfield in SwiftUI


I have a text field in swiftUI, and in order to make it more appealing I'd like to add a border and have rounded corners. But it doesn't seem to work like it's supposed to (see image). What did I miss?

image 1

I've tried putting .cornerradius() before .border(), but it had the same effect.

TextField("Text input goes here", text: $addMins)
    .padding(.all, 5.0)
    .background(View)
    .frame(width: 300.0, height: 35.0)
    .border(Color.green, width: 2)
    .cornerRadius(14)

Solution

  • So you want something like this?

    TextField("Text Field", text: $text)
        .padding(4)
        .overlay(
            RoundedRectangle(cornerRadius: 14)
                .stroke(Color.green, lineWidth: 2)
        )
        .padding()
    

    textfield with green rounded border