Question

我们尝试向左滑动但我们未能像iOS Native App中的Instagram消息UI一样实现。请告诉我我该怎么做以及如何实现这一点。

Answer 1

与您分享代码：

而不是使用viewForHeaderInSection使用cellForRowAt来创建标题
此外，在为标题单元格设置Xib时请注意，您必须将标签保留在视图的中心。

import UIKit
class ViewController: UIViewController {

@IBOutlet weak var tableView: UITableView!

var headersIndex = [IndexPath]()
override func viewDidLoad() {
    super.viewDidLoad()

    tableView.register(UINib(nibName: "cell", bundle: Bundle.main), forCellReuseIdentifier: "cell")
    tableView.register(UINib(nibName: "HeaderTableViewCell", bundle: Bundle.main), forCellReuseIdentifier: "HeaderTableViewCell")
}
}
extension ViewController: UITableViewDataSource,UITableViewDelegate {
func numberOfSections(in tableView: UITableView) -> Int {
    return 5
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 10
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if indexPath.row == 5 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "HeaderTableViewCell") as! HeaderTableViewCell
        cell.centerLabel.text = "sanjay"
        cell.centerLabel.center.x = view.center.x
        if !headersIndex.contains(indexPath) {
            headersIndex.append(indexPath)
        }
        return cell
    } else {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! cell
        cell.leftLabel.text = "Message \(indexPath.row)"
        cell.rightLabel.text = indexPath.row.description
        return cell
    }
}
func scrollViewDidScroll(_ scrollView: UIScrollView) {
    for i in headersIndex {
        if let cell = tableView.cellForRow(at: i) {
            if tableView.visibleCells.contains(cell) {
                let header = cell as! HeaderTableViewCell
                header.centerLabel.center.x = view.center.x + scrollView.contentOffset.x
            }
        }

    }

}
}

Answer 2

你只需要在tableViewConstraints中进行一些修改。使表格视图尾随约束为负值，这将使表格视图移出超级视图，我已使用-50，如图所示

现在当你将tableViewCell的Xib包含在同一个Xib中的右侧标签时。

还可以转到storyboard并选择你的tableView，并在scrollView部分的属性检查器中启用所有三个选项，如下图所示：

现在尝试并随意询问您是否有任何疑问。

这就是它的样子：

如何制作Instagram聊天屏幕（UI）以便左滑动以查看iOS中的时间

2 个答案: