Add NSLayoutConstraint for a view inside a UITableCellView

Question

I would like to have a UIButton centred inside my UITableCellView. I've added the necessary code in the tableView cellForRowAt function but I get the error :

The view hierarchy is not prepared for the constraint: When added to a view, the constraint's items must be descendants of that view (or the view itself). This will crash if the constraint needs to be resolved before the view hierarchy is assembled. Break on -[UIView(UIConstraintBasedLayout) _viewHierarchyUnpreparedForConstraint:] to debug.

My code is the following :

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

            cell = UITableViewCell(
                style: .default, reuseIdentifier: Id.settingButtonCellIdentifier)
            cell!.backgroundColor = UIColor.clear
            cell!.preservesSuperviewLayoutMargins = false
            cell!.separatorInset = UIEdgeInsets.zero

            let button : UIButton = UIButton(type: UIButtonType.custom) as UIButton
            button.backgroundColor = UIColor.red
            button.setTitle("Click Me !", for: UIControlState.normal)

            cell!.addSubview(button)

            button.translatesAutoresizingMaskIntoConstraints = false
            button.addConstraint(NSLayoutConstraint(item: button, attribute: .leading, relatedBy: .equal, toItem: cell!, attribute: .leading, multiplier: 1, constant: 10))
            button.addConstraint(NSLayoutConstraint(item: button, attribute: .trailing, relatedBy: .equal, toItem: cell!, attribute: .trailing, multiplier: 1, constant: 10))
            button.addConstraint(NSLayoutConstraint(item: button, attribute: .top, relatedBy: .equal, toItem: cell!, attribute: .top, multiplier: 1, constant: 10))
            button.addConstraint(NSLayoutConstraint(item: button, attribute: .bottom, relatedBy: .equal, toItem: cell!, attribute: .bottom, multiplier: 1, constant: 10))
        }

        return cell!
    }

Any help would be appreciated !

Answer 1

Try this

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        cell = UITableViewCell(
            style: .default, reuseIdentifier: Id.settingButtonCellIdentifier)
        cell!.backgroundColor = UIColor.clear
        cell!.preservesSuperviewLayoutMargins = false
        cell!.separatorInset = UIEdgeInsets.zero

        let button : UIButton = UIButton(type: UIButtonType.custom) as UIButton
        button.backgroundColor = UIColor.red
        button.setTitle("Click Me !", for: UIControlState.normal)

        button.translatesAutoresizingMaskIntoConstraints = false


        cell!.contentView.addSubview(button)

        cell.contentView.addConstraint(NSLayoutConstraint(item: button, attribute: .leading, relatedBy: .equal, toItem: cell.contentView, attribute: .leading, multiplier: 1, constant: 10))
        cell.contentView.addConstraint(NSLayoutConstraint(item: button, attribute: .trailing, relatedBy: .equal, toItem: cell.contentView, attribute: .trailing, multiplier: 1, constant: 10))
        cell.contentView.addConstraint(NSLayoutConstraint(item: button, attribute: .top, relatedBy: .equal, toItem: cell.contentView, attribute: .top, multiplier: 1, constant: 10))
        cell.contentView.addConstraint(NSLayoutConstraint(item: button, attribute: .bottom, relatedBy: .equal, toItem: cell.contentView, attribute: .bottom, multiplier: 1, constant: 10))
    }

    return cell!
}