3

I am facing issues with TextField (color of the text being input). I am using MVVM pattern and my code is as below:


import SwiftUI

struct ContentView: View {
    @ObservedObject var viewModel: ViewModel

    var body: some View {
        CustomView(email: $viewModel.dataModel.emailID)
    }
}

struct CustomView: View {
    
    @Binding var email: String
        
    var body: some View {
        VStack {
            
            TextField("email", text: $email)
                .foregroundColor(.black)
                .frame(height: 30.0)
                .textContentType(.emailAddress)
                .keyboardType(.emailAddress)
                .background(Color.white)
                .padding([.top, .bottom])
            Spacer()
        }.padding(20)
    }
}


public final class ViewModel: ObservableObject {
    
    /// data model
    public var dataModel: DataModel
    
    public init (model: DataModel) {
        self.dataModel = model
    }
    
}
public final class DataModel {
    
    @Published public var emailID: String
    
    public init(emailID: String) {
        self.emailID = emailID
    }
}

The exact issue is that with the above code, when I type a text into the text field, the text color is also white which is the same as the background color, though the foreground color is black. Please tell me where I am going wrong. I am instantiating the ContentView from SceneDelegate as follows:


let contentView = ContentView(viewModel: ViewModel(model: DataModel(emailID: "")))

3
  • Works fine with Xcode 11.4 / iOS 13.4. Is this your real code to reproduce? Commented Jul 17, 2020 at 10:56
  • @Asperi I am using Xcode 11.5 and iOS 13.5.1. This is the exact code and I can reproduce it just by instantiating the ContentView from SceneDelegate Commented Jul 17, 2020 at 11:14
  • @Asperi I have edited my question with the instantiation also Commented Jul 17, 2020 at 11:20

1 Answer 1

1

You have broken chain of binding. Here is fixed code (note that some inits changed!):

struct ContentView: View {
    @ObservedObject var viewModel: ViewModel

    var body: some View {
        CustomView(model: viewModel.dataModel)
    }
}

struct CustomView: View {

    @ObservedObject var model: DataModel

    var body: some View {
        VStack {

            TextField("email", text: $model.emailID)
                .foregroundColor(.black)
                .frame(height: 30.0)
                .textContentType(.emailAddress)
                .keyboardType(.emailAddress)
                .background(Color.white)
                .padding([.top, .bottom])
            Spacer()
        }.padding(20)
    }
}


public final class ViewModel: ObservableObject {

    /// data model
    public var dataModel: DataModel

    public init (model: DataModel) {
        self.dataModel = model
    }

}

public final class DataModel: ObservableObject {

    @Published public var emailID: String

    public init(emailID: String) {
        self.emailID = emailID
    }
}
Sign up to request clarification or add additional context in comments.

2 Comments

Thanks. It works!!! Could you please explain why it does not work when I have the binding variable in the custom view?
@Subha_26, because it was bound to not observable DataModel

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.