How to reuse a table view cell without overlapping other cells in tableview ios swift

Question

I am getting the widgets/data overlapped in every cell when I scroll down or up my tableview. What I am doing is, I have an array in elements are wCheckinArray = ["Date", "TextFeild", "TextView", "Check", "Sign"] . Now I am checking if there is an element "anyElement" in wCheckinArray then I am making an anyElement in a cell and add as a subview in content view of a cell.

Example:

Under cellForRowAtIndexPath method of UITableView :

  let w = wCheckinArray[indexPath.row]
  if w.contains(Date) {
    // make a date picker  and add it as a subview to content view of cell 
  }
    // and so on

---

Real code:

var Cell : UITableViewCell?

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    print("cellforrowatindexpathruns")
    var instockSignView : Int = 1
    Cell = tempCheckinTable.dequeueReusableCell(withIdentifier: "tempCheckinCell")! as UITableViewCell

    if wCheckinArray.count == 0 && lCheckinArray.isEmpty {
      print("no textFields in Checkin")
    }
    else 
    {
      print("widget process i in winstock loop")
      let w = wCheckinArray[indexPath.row]

      if w.contains(wTextField)  {
         print("textField was placed")
         newLabel = UITextField(frame: CGRect(x: 10, y: 10, width: 250, height: 30))
         newLabel.textColor = UIColor.gray
         newLabel.tag = widgetTagOk     
         print("You have a instock textLabel with tag \(newLabel.tag)")

         if lCheckinArray.isEmpty || idCheckinArray.count != lCheckinArray.count {
            newLabel.text = " "
         } else {
            newLabel.placeholder = lCheckinArray[indexPath.row]
            newLabel.layer.cornerRadius = 3
            newLabel.layer.borderColor = UIColor.gray.cgColor
            newLabel.layer.borderWidth = 1

            //instockTextField += 1
            widgetTagOk += 1
            print("\(wCheckinArray.count)")
            Cell?.contentView.addSubview(newLabel)
                }
            }

            if w.contains(wTextView) {
                print("textView was placed")
                newTextView = UITextView(frame: CGRect(x:10, y: 35, width: 250, height: 50))
                newTextView.textAlignment = NSTextAlignment.justified
                newTextView.textColor = UIColor.black
                newTextView.backgroundColor = UIColor.white
                newTextView.font = UIFont.systemFont(ofSize: 15)
                newTextView.tag = widgetTagOk //instockTextView

                print("You have a instock textView with tag \(newTextView.tag)")
                if lCheckinArray.isEmpty || idCheckinArray.count != lCheckinArray.count {
                } else {
                    textViewLabel = UILabel(frame: CGRect(x:10, y: 10, width: 250, height: 20))
                    textViewLabel.text = "\(lCheckinArray[indexPath.row]):"
                    textViewLabel.textColor = .black
                    textViewLabel.tag = widgetTagOk
                    print("here is the TextView place text  \(lCheckinArray[indexPath.row])")
                    newTextView.layer.cornerRadius = 3
                    newTextView.layer.borderColor = UIColor.gray.cgColor
                    newTextView.layer.borderWidth = 1
                    widgetTagOk += 1 //instockTextView += 1
                    print("\(wCheckinArray.count)")
                    Cell?.contentView.addSubview(newTextView)
                    Cell?.contentView.addSubview(textViewLabel)

                }
            }

            if w.contains(wSign) { //wInstockArray.contains(wSign) {
                print("sign was place   d")
                newSignView = UIView(frame: CGRect(x:10, y: 35, width: 250, height: 50))
                newSignView.backgroundColor = UIColor.white
                newSignView.tag = instockSignView
                print("You have a instock signView with tag \(newSignView.tag)")
                if lCheckinArray.isEmpty || idCheckinArray.count != lCheckinArray.count {
                    print("signview can nit be added as a widget")
                } else {
                    textViewLabel = UILabel(frame: CGRect(x:10, y: 10, width: 250, height: 20))
                    textViewLabel.text = "\(lCheckinArray[indexPath.row]):"
                    textViewLabel.textColor = .black
                    textViewLabel.tag = widgetTagOk
                    print("here is the TextView place text  \(lCheckinArray[indexPath.row])")
                    newSignView.layer.cornerRadius = 3
                    newSignView.layer.borderColor = UIColor.gray.cgColor
                    newSignView.layer.borderWidth = 1
                    instockSignView += 1
                    print("\(wCheckinArray.count)")
                    print("signview has added as a instock widget")
                    Cell?.contentView.addSubview(newSignView)
                    Cell?.contentView.addSubview(textViewLabel)
                }
            }


            if w.contains(wDate) { //wInstockArray.contains(wSign) {
                print("date was placed")
                newDatePicker = UIDatePicker(frame: CGRect(x:10, y: 35, width: 250, height: 50))
                newDatePicker.backgroundColor = UIColor.white
                newDatePicker.tag = instockSignView
                print("You have a checkin date picker with tag \(newSignView.tag)")
                if lCheckinArray.isEmpty || idCheckinArray.count != lCheckinArray.count {
                    print("date picker can nit be added as a widget")
                } else {
                    textViewLabel = UILabel(frame: CGRect(x:10, y: 10, width: 250, height: 20))
                    textViewLabel.text = "\(lCheckinArray[indexPath.row]):"
                    textViewLabel.textColor = .black
                    textViewLabel.tag = widgetTagOk
                    print("here is the date picker place text  \(lCheckinArray[indexPath.row])")
                    newDatePicker.layer.cornerRadius = 3
                    newDatePicker.layer.borderColor = UIColor.gray.cgColor
                    newDatePicker.layer.borderWidth = 1
                    instockSignView += 1
                    print("\(wCheckinArray.count)")
                    print("date picker has added as a checkin widget")
                    Cell?.contentView.addSubview(newDatePicker)
                    Cell?.contentView.addSubview(textViewLabel)
                }
            }

            // } //for i in instockarr comment bracket
            print("could not add widgets")
            print("here is w id \(idCheckinArray),here is w name: \(wCheckinArray), here is w data \(lCheckinArray)")
        }
    return Cell!
    }

This is how tableView looks when I scroll up or down the tableView

What I have Googled

What I have googled is This question which suggests to me that I should check the clear graphics context which is done by default in Xcode

Also searched Here which suggest me to change the cell identifier for every cell, well how can I do? How can I change the cell identifier which I have mentioned in Tableview cell's attributes inspector in Xcode. Is there any solution to reuse this programatically.

Update

The tags of widget like textview.tag or textfield.tag are increasing when I scroll the tableview from bottom to upward here is how I printed the tag of textfield

Answer 1

You better remove your all subviews creating subview.And make sure your y position to every elements is not same

Cell = tempCheckinTable.dequeueReusableCell(withIdentifier: "tempCheckinCell")! as UITableViewCell

    for subView in cell.contentView.subviews{
                subView .removeFromSuperview()
            }