Swift TableViewCell xib没有约束 [英] Swift TableViewCell xib doesn't have constraints

问题描述

我有两个 TableView s，当我设计原型时，我使用故事板中的原型单元设计它，使其可重复使用我试图将其拉出来 .xib 并加载它。当它从 cellID.xib 加载时，它会在运行时丢失所有约束，并且所有内容都相互叠加。

I have two TableViews, when I designed the original I designed it using the prototype cell in the storyboard, to make it reusable I tried to pull it out into a .xib and load that instead. When it is loaded from cellID.xib however it loses all the constraints at runtime, and everything is layered on top of each other.

let cellIdentifier = "cellID"
override func viewDidLoad() {
    super.viewDidLoad()

    tableView.register(UINib(nibName: cellIdentifier, bundle: nil), forCellReuseIdentifier: cellIdentifier)
    tableView.rowHeight = UITableViewAutomaticDimension
    tableView.estimatedRowHeight = 300
}

故事板中的原型单元格（用于工作）

Prototype cell in Storyboard (Used to work)

推荐答案

问题

在问题标题中，您询问了如何解决Swift TableViewCell xib没有约束的问题。此外，在赏金中，您指定答案应为：

The Problem

In your question title, you asked how to solve an issue where "Swift TableViewCell xib doesn't have constraints." Additionally in the bounty, you specify that the answer should be:

一个足够的答案，显示为什么约束在移动到$ b $时会丢失b xib，当它们存在于xib中时，以及如何解决这个问题。

An adequate answer showing why constraints are lost when moved to a xib, when they exist in the xib, and how to address this problem.

根据我的理解，你的问题有两个部分：

From my understanding, your question has two parts:

1. 自定义TableViewCell xib没有约束的问题


2. 为什么复制时会丢失约束/从Storyboard原型粘贴到xib

对于问题＃1，我使用了几乎所有与屏幕截图中显示的相同的约束在自定义单元格xib中它工作。我将在下面详细解释。

For issue #1, I used almost all of the same constraints as you had displayed in your screenshot in a custom cell xib and it worked. I will explain in more detail below.

对于问题＃2，我发现约束不会丢失。您可能需要共享您的项目，以便其他人可以复制您遇到的问题。我将具有类似约束的Storyboard原型单元复制/粘贴到xib上，并且我没有任何约束问题。所以我可以确认复制/粘贴功能是否有效。

For issue #2, I found that constraints are not lost. You may need to share your project so that others can replicate the issue you are having. I copy/pasted a Storyboard prototype cell with similar constraints over to a xib and I did not have any issues with constraints. So I can confirm that the copy/paste feature does work.

我创建了以下演示来测试您的问题。请参阅下面的屏幕截图。 tableView包含六个单元格。第一个和第二个相同，并且具有重用标识符 MyCell 。第3个和第4个相同，并且具有重用标识符 MyCopyPasteCell 。第5和第6个是相同的，并具有重用标识符 MyPrototypeCell 。

I created the following demo to test your issue. Refer to the screenshot below. The tableView contains six cells. The 1st and 2nd are the same and have reuse identifier MyCell. The 3rd and 4th are the same and have reuse identifier MyCopyPasteCell. The 5th and 6th are the same and have reuse identifier MyPrototypeCell.

MyCell 存在于xib中，几乎使用了屏幕截图中显示的所有相同约束。如您所见，没有约束问题。 MyCopyPasteCell 使用类似的约束，并从Storyboard原型复制/粘贴到xib。 MyPrototypeCell 是复制的原始原型。即使将原型复制到xib，最后四个单元看起来完全相同。从原型到xib的约束没有问题。

MyCell exists in a xib and uses nearly all the same constraints that you showed in your screenshot. As you can see, there are no constraints issues. MyCopyPasteCell uses similar constraints and was copy/pasted from a Storyboard prototype over to a xib. MyPrototypeCell is the original prototype that was copied. These last four cells look exactly the same even though the prototype was copied over to the xib. The constraints carried over from prototype to xib without an issue.

在下面的代码中，我列出了您在 ContentView 的屏幕截图中显示的所有约束。 （注意我还实现了 height = 20 ， aspect = 1：1 和 height = 75 约束，虽然它们未在下面列出。）由于我没有使用它们，因此注释掉了两个约束。我还添加了一个约束来替换另一个未使用的约束。

In the code below, I list all the constraints that you showed in your screenshot for your ContentView. (Note that I also implemented the height=20, aspect=1:1, and height=75 constraints, although they are not listed below.) Two constraints are commented out since I did not use them. I also added one more constraint to replace another unused one.

// bottomMargin = Profile Image View.bottom + 188.5
bottomMargin = Profile Image.bottom + 17
Profile Image View.top = Username Label.top
Profile Image View.leading = leadingMargin + 2
Profile Image View.top = topMargin + 20
Username Label.leading = Content Text View.leading    
// Username Label.top = topMargin + 20        
Username Label.trailing = Content Text View.trailing
Username Label.leading = Profile Image View.trailing + 15
trailingMargin = Username Label.trailing + 10
Content Text View.top = Username Label.bottom + 5
Content Text View.leading = leadingMargin + 92
bottomMargin = Content Text View.bottom + 20

第一个评论约束 // bottomMargin = Profile Image View.bottom + 188.5 没有意义，因为它会将图像的底部与单元格的底部分开188.5。这也与故事板中的原型单元格（用于工作）屏幕截图完全不符。我用 bottomMargin = Profile Image.bottom + 17 替换它，它只用188替换188.5。

The first commented constraint // bottomMargin = Profile Image View.bottom + 188.5 did not make sense as it would separate the bottom of the image from the bottom of the cell by 188.5. This also did not match your Prototype cell in Storyboard (Used to work) screenshot at all. I replaced it with bottomMargin = Profile Image.bottom + 17, which just replaces the 188.5 with 17.

第二个评论约束 //用户名Label.top = topMargin + 20 （将username和topMargin分开20）在技术上可以正常工作。但是，它的功能是多余的 Profile Image.top = topMargin + 20 （将Profile Image和topMargin分隔为20）和 Profile Image View.top =用户名Label.top （将配置文件图像和用户名设置为相同的顶部分隔，即20）。

The second commented constraint // Username Label.top = topMargin + 20 (which separates username and topMargin by 20) can technically work. However, its functionality is redundant to Profile Image.top = topMargin + 20 (which separates Profile Image and topMargin by 20) and Profile Image View.top = Username Label.top (which sets the Profile Image and Username to the same top separation i.e. by 20).

以下是我的视图控制器。基本上我创建了三个部分，每个部分有两个单元格/行。 MyCell 和 MyCopyPasteTableViewCell 来自xib，并在 viewDidLoad（）。 MyPrototypeCell 来自故事板，未在 viewDidLoad（）中注册。

The following is my view controller. Basically I create three sections with two cells/rows per section. MyCell and MyCopyPasteTableViewCell are from a xib and are registered in the viewDidLoad(). MyPrototypeCell is from the Storyboard and is not registered in viewDidLoad().

//  MyTableViewController.swift
import UIKit    
class MyTableViewController: UITableViewController {

    let myCell = "MyCell"
    let myCopyPasteCell = "MyCopyPasteTableViewCell"
    let myPrototypeCell = "MyPrototypeCell"

    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.register(UINib(nibName: myCell, bundle: nil), forCellReuseIdentifier: myCell)
        tableView.register(UINib(nibName: myCopyPasteCell, bundle: nil), forCellReuseIdentifier: myCopyPasteCell)
        tableView.rowHeight = UITableViewAutomaticDimension
        tableView.estimatedRowHeight = 300
    }

    // MARK: - Table view data source
    override func numberOfSections(in tableView: UITableView) -> Int {
        return 3
    }

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

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        if indexPath.section == 0 {
            let cell = tableView.dequeueReusableCell(withIdentifier: myCell, for: indexPath)
            return cell
        } else if indexPath.section == 1 {
            let cell = tableView.dequeueReusableCell(withIdentifier: myCopyPasteCell, for: indexPath)
            return cell
        } else {
            let cell = tableView.dequeueReusableCell(withIdentifier: myPrototypeCell, for: indexPath)
            return cell
        }
    }
}

Github链接

https：// github .com / starkindustries / TableViewCellConstraintsTest

这篇关于Swift TableViewCell xib没有约束的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！