如何调整自定义 UITableViewCell nib 文件的大小以适应 tableView？

Question

我的应用程序当前加载速度类似于 this。如您所见，这并不理想 b/c 单元格不会填满整个单元格。此外，如果您注意到每个单元格的最左侧，白色分隔线会在单元格末尾之前停止。

我正在使用 nib 文件 DayofWeekSpendingTableViewCell.xib 来自定义我的表格视图单元格。

我有一个 UITableViewController SummaryTableViewController 用于加载 nib 文件。在方法 tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) 中，我尝试设置两个标签的框架，以便它们占据视图的宽度，但这无济于事 b/c 我的应用程序仍然加载 this.

class SummaryTableViewController: UITableViewController {    
    override func viewDidLoad() {
        super.viewDidLoad()

        dayOfWeek = [ .Mon, .Tue, .Wed, .Thu, .Fri, .Sat, .Sun]
        totalSpentPerDay = [0, 7.27, 0, 0, 39, 0, 0]

        // Create a nib for reusing
        let nib = UINib(nibName: "DayofWeekSpendingTableViewCell", bundle: nil)
        tableView.registerNib(nib, forCellReuseIdentifier: "nibCell")

        self.tableView.separatorColor = UIColor.whiteColor()
    }

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

        // Configure the cell...
        let cell = tableView.dequeueReusableCellWithIdentifier("nibCell", forIndexPath: indexPath) as! DayOfWeekTableViewCell
        let day = dayOfWeek[indexPath.row]

        let height = CGFloat(55)
        let dayOfWeekWidth = CGFloat(80)
        cell.dayOfWeek.text = day.rawValue.uppercaseString
        cell.dayOfWeek.frame = CGRectMake(0, 0, dayOfWeekWidth, height)
        cell.dayOfWeek.backgroundColor = colorOfDay[day]

        cell.totalAmountSpent.text = "$\(totalSpentPerDay[indexPath.row])"
        cell.totalAmountSpent.frame = CGRectMake(cell.dayOfWeek.frame.maxX + 1, 0, view.bounds.width - dayOfWeekWidth, height)
        cell.totalAmountSpent.backgroundColor = colorOfDay[day]

        return cell
    }
}

如果有人能告诉我如何使自定义 UITableViewCell nib 文件适合视图，我将不胜感激！

Answer 1

所以，我看到了几件事。首先，看起来您的单元格笔尖可以使用一些自动版式约束。你的笔尖可能是 320px 宽度。在运行时间，您的单元格的内容视图实际上正在伸展以填充更大设备的新宽度，但是您放置的绿色视图只是保持在其 320px 配置中。您可以通过更改内容视图的颜色并查看该颜色出现在模拟器中来对此进行测试。我在这里复制了你的手机：

粉红色视图具有固定宽度，并且紧靠内容视图的顶部、左侧和底部放置。蓝色视图在粉红色视图右侧 4 磅，以在中间给出白色边距。它位于内容视图的顶部、右侧和底部。因此，当单元格的内容视图调整大小时，AutoLayout 约束将拉伸蓝色视图，使其右边缘与内容视图的右边缘保持齐平。

对于边缘插入，首先在每个单元格的table 和上设置边缘插入。您可以在 storyboard/nib 中执行此操作或在代码中这样做：

class ViewController: UITableViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let nib = UINib(nibName: "yubnub", bundle: nil)
        tableView.registerNib(nib, forCellReuseIdentifier: "yub")

        tableView.separatorInset = UIEdgeInsets.zero
        tableView.layoutMargins = UIEdgeInsets.zero
    }


    override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

        return 10
    }

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

        return tableView.dequeueReusableCellWithIdentifier("yub", forIndexPath: indexPath)
    }

    override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {

        cell.layoutMargins = UIEdgeInsets.zero
    }
}

Answer 2

应用以下解决方案，

1) 首先从情节提要中的尺寸检查器为您的表格视图提供完整的自动调整大小约束。

2) 现在移动到你的 nib 文件和 select tableViewcell 并给它完整的约束。

3) 现在 select 左侧标签并给它左上约束，给右标签右上约束。

现在不要忘记在您的视图控制器中实现 heightForRowatIndexPath 委托方法，并在您的自定义 xib 中提及您的 nib 文件的相同高度。

Answer 3

我也犯了同样的错误，是因为在storyboard中我的tableView的内容是Static Cell。我将其更改为动态原型并解决了问题。

如何调整自定义 UITableViewCell nib 文件的大小以适应 tableView？

How to resize custom UITableViewCell nib file to fit tableView?

uitableview

ios

uinib

swift