user16103051
user16103051

Reputation:

How to hide UIView() when custom UITextField is tapped (programmatically)?

I faced one problem which I don't understand and solve in any way. When the textField is activated, the keyboard is displayed when the buttons of numbers in keyboard are pressed, my stackView, which is located in the middle of the screen, should hide and my tableView should rise up, having an indent from the headView of 36 points. When I delete text in the textField, everything should return to the standard view as in the screenshot. I used UIKit programmatically without StoryBoard and SnapKit for constraints. What method should I use here? textField delegate or UIView.animate {} or smth.Could you help me pls.

My UITextField is greenColor, I made it like view just for sample and demonstration.

final class HeaderView: UIView {
   
   // There are contains UIImageView & UITextField
   // UIImageView has yellow color in screenShot
   // UITextField has green color in screenShot
   ..........
}

final class LeftView: UIView {
  
  // Contains textLabel and IconImg
  ...........
}

final class RightView: UIView {
  
  // Contains textLabel and IconImg
  ...........
}

and call them in my UIViewController:

final class ViewController: UIViewController {

        private let headerLabel: UILabel = {
            let label = UILabel()
            label.font = .systemFont(ofSize: 17, weight: .semibold)
            label.text = "Hello World!"
            label.textColor = .black
            return label
        }()
 
        // Calling my custom views
        let headView = HeaderView()
        let leftView = LeftView()
        let rightView = RightView()
        
        let stackView: UIStackView = {
           let stackView = UIStackView()
           stackView.axis = .horizontal
           stackView.alignment = .center
           stackView.distribution = .equalSpacing
           return stackView
        }()

        // After that, I created UITableView
        let tableView: UITableView = {
            let tableView = UITableView(frame: .zero)
            tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
            return tableView
        }()

        // ViewDidLoad
        override func viewDidLoad() {
           super.viewDidLoad()
           self.view.backgroundColor = .systemBackground
           
           tableView.delegate = self
           tableView.dataSource = self

           self.setupUI()
        }

        func setupUI() {
           self.setSubviews()
           self.setConstraints()
        }

        func setSubviews() {
           self.view.addSubview(headerLabel)
           self.view.addSubview(headView)
           self.stackView.addArrangedSubview(leftView)
           self.stackView.addArrangedSubview(rightView)
           self.view.addSubview(stackView)
           self.view.addSubview(tableView)
        }

        private func setConstraints() {
    
           headerLabel.snp.makeConstraints { make in
              make.top.equalTo(self.view.safeAreaLayoutGuide).offset(30)
              make.centerX.equalTo(self.view.safeAreaLayoutGuide)
           }
    
           headView.snp.makeConstraints { make in
              make.top.equalTo(self.headerLabel.snp.bottom).offset(24)
              make.leading.equalTo(self.view.safeAreaLayoutGuide).offset(16)
              make.trailing.equalTo(self.view.safeAreaLayoutGuide).offset(-16)
              make.height.equalTo(56)
          }
    
          stackView.snp.makeConstraints { make in
              make.top.equalTo(self.headView.snp.bottom).offset(16)
              make.leading.trailing.equalToSuperview().inset(16)
          }
    
          leftView.snp.makeConstraints { make in
              make.top.equalTo(self.stackView.snp.top)
              make.leading.equalTo(self.stackView.snp.leading)
              make.bottom.equalTo(self.stackView.snp.bottom)
              make.size.equalTo(CGSize(width: 163, height: 88))
          }
    
          rightView.snp.makeConstraints { make in
              make.top.equalTo(self.stackView.snp.top)
              make.trailing.equalTo(self.stackView.snp.trailing)
              make.bottom.equalTo(self.stackView.snp.bottom)
              make.size.equalTo(CGSize(width: 163, height: 88))
          }
    
          tableView.snp.makeConstraints { make in
             make.top.equalTo(self.stackView.snp.bottom).offset(36)
             make.leading.trailing.equalTo(self.view.safeAreaLayoutGuide)
             make.bottom.equalTo(self.view.safeAreaLayoutGuide)
          }
      }
}

extension UIViewController: UITableViewDelegate, UITableViewDataSource {

     public func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 10
     }

     public func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
       let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
       cell.textLabel?.text = "Hello"
       return cell
    }
}

[![enter image description here][1]][1]

Upvotes: 0

Views: 126

Answers (1)

Shreedharshan Msd
Shreedharshan Msd

Reputation: 41

To hide UIView when a text or number is typed in a textfield, you must add target to your UITextfield like you would add a target to UIButton, But, for a UITextfield the UIControl.Event has to be changed (.editingChanged).

For example:

let textField = UITextFiled()

override func viewDidLoad() {

  // Add all the required stuffs of UItextfield and add the following code

       textField(self, action: #selector(txtValueChanged(_ :)), for: .editingChanged)

}

@objc func txtValueChanged(_ sender: UITextField) {

  // You have to hide LeftView,RightView . So, add this code

      leftView.isHidden = true
      rightView.isHidden = true

}

This code will hide the views when a character is typed in UITextfield.

Upvotes: 0

Related Questions