CODEWITHSUNDEEP
swiftui
filip.karas
filip.karas

Reputation: 598

TextField foreground color issue

I'm trying to make real time email validation, but the simulator has strange behaviour. When the email IS NOT valid, it should be red, when it IS valid, the color of the text should be black, but some characters stay red.

struct EmailText: View {
    @State var textFieldValue: String = ""
    
    private func isValid(_ s: String) -> Bool {
        // not real validation function, just for simplicity
        return Int.random(in: 0 ... 1) == 1
    }
    
    var body: some View {
        TextField("", text: $textFieldValue)
            .foregroundColor(isValid(textFieldValue) ? .black : .red)
            .padding()
    }
}

demo

I have updated the validation function from regex to simple condition, to exclude regex as a possible issue.

Upvotes: 4

Views: 1140

Answers (4)

Alex Vaiman
Alex Vaiman

Reputation: 37

in ios 17, this is broken. so, for ios 17.. you will just have to go for uikit UIViewRepresentable.

var forumView: some View {
        Form {
            Section("Child info") {
                TextField("Name", text: $viewModel.name)
                    //.foregroundStyle(viewModel.isNameValid() ? .black : .red)
                    .textInputAutocapitalization(.words)
                    .autocorrectionDisabled()
                    .keyboardType(.alphabet)
                    .fontWeight(.light)
               
                HStack {
                    Text("Select Birthdate")
                    Spacer()
                    datePickerView
                }
            }
            }

does not work on ios17, I was very excited with swift-ui for some time, until I started to work with it for longer, then i discovered countless of bugs, works on ios17, broken on 16, another thing works on 16, broken on 17, works fine all device, but not on iPhone-SE.

Upvotes: 0

Jatin Bhuva
Jatin Bhuva

Reputation: 1874

Here I have tested code, Maybe It will help you

struct Demo1: View {
    @State private var email: String

      @State var emailIsValid: Bool = true

      

      public init(email: String = "")

      {

          self.email = email

      }
    var body: some View {
//        Text(/*@START_MENU_TOKEN@*/"Hello, World!"/*@END_MENU_TOKEN@*/)
        
        
        TextField("Email", text: $email)

            .onChange(of: email) { newValue in

                if(newValue.range(of:"^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$", options: .regularExpression) != nil) {

                    self.emailIsValid = true

                    print("valid")

                } else {

                    self.emailIsValid = false

                    print("invalid")

                }

            }

            .foregroundColor(emailIsValid ? Color.green : Color.red)

    }
}

Upvotes: 0

JanMensch
JanMensch

Reputation: 2425

Solution: disable autocorrection.

TextField("", text: $textFieldValue)
            .foregroundColor(isValid(textFieldValue) ? .black : .red)
            .padding()
            .autocorrectionDisabled() // <----

Most certainly a SwiftUI bug that causes interference between the text highlighting of spell check warnings and the foreground color.

Upvotes: 7

Allan Garcia
Allan Garcia

Reputation: 568

Confirmed. Your RegEx is wrong. Use:

/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/

To validate e-mail.

Upvotes: 0

Related Questions