constraints not working programmatically swift

Question

func textFields() {
    let nameField = MDCFilledTextField()
    view.addSubview(nameField)
    nameField.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        nameField.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
        nameField.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
        nameField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
        nameField.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
    ])
    nameField.placeholder = "Name"
}

I am using google material design and create a textfield.For this purpose and i have used this code i want to space from both sides left and right but it works only one side left or right i want to space from both side.

Answer 1

You are trying to set the MDCFilledTextField position in a wrong way. The following line tells your view to use a static predefined frame size:

let estimatedFrame = CGRect(x: 10, y: 200, width: UIScreen.main.bounds.width-20, height: 50)
let nameField = MDCFilledTextField(frame: estimatedFrame)

But further down with the following rows you tell your view to use autolayout:

nameField.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
    nameField.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
    nameField.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
    nameField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
    nameField.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
])

So now you have to decide which one would you like to use, the static frame or the autolayout. If you decide to go with the autolayout you have to improve your code in order to remove the error you get. First you need to set the translatesAutoresizingMaskIntoConstraints to true instead of false.

nameField.translatesAutoresizingMaskIntoConstraints = false

This line will tell that you want to use the autolayout for nameField instead of a static frame. Further you need to add your view to the superview first, otherwise you can't define your constraints(therefore the error you have). So your code becomes:

func textFields() {
    let nameField = MDCFilledTextField()
    view.addSubview(nameField)
    nameField.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        nameField.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 10),
        nameField.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -10),
        nameField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
        nameField.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
    ])
    nameField.placeholder = "Name"
}

Answer 2

Add the nameField as a subview of the view before activating the constraint and remove of using frames.

To add padding use for example centerXAnchor and widthAnchor + multiplier

func textFields() {
        
        let nameField = MDCFilledTextField()
        nameField.translatesAutoresizingMaskIntoConstraints = false

        view.addSubview(nameField)
                
        NSLayoutConstraint.activate([
            nameField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
            nameField.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
            nameField.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            nameField.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.9)
        ])
       
        nameField.placeholder = "Name"
        nameField.label.text = "Name"
        nameField.setFloatingLabelColor(.lightGray, for: MDCTextControlState.editing)
}

or add constants to the leftAnchor and rightAnchor.

func textFields() {
        
        let nameField = MDCFilledTextField()
        nameField.translatesAutoresizingMaskIntoConstraints = false

        view.addSubview(nameField)
                
        NSLayoutConstraint.activate([
            nameField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
            nameField.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
            nameField.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 10),
            nameField.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -10)
        ])
      
        nameField.placeholder = "Name"
        nameField.label.text = "Name"
        nameField.setFloatingLabelColor(.lightGray, for: MDCTextControlState.editing)
}