如何创建自定义表格视图单元格（快速）

这个故事最初发布在AppMakers.Dev

在iOS中，您可以使用“自动布局”来定义表格视图单元格的高度。 在本教程中，我们将向您展示如何使Table View Cells自动调整大小。

首先，创建一个简单的TableView，它属于您的ViewController。

创建名为Table QuoteCell的自定义TableViewCell类。 在StoryBoard中打开ViewController并将CellID添加为tableViewCell标识符。

将两个名为quoteLabel和authorLabel的标签添加到自定义单元格。 向它们添加约束。 在QuoteTableViewCell类中为这些标签设置IBOutlets。

我们的应用程序将显示引号。 假设我们要在TableView中包含以下带引号的数据。 在您的ViewController中添加dataForTableView变量。

 让dataForTableView = [（“我没有失败。我刚刚找到了10,000种行不通的方法。”，“ Thomas A. Edison”），（“一个人不过是他思想的产物。他在想什么，他成为。”，“圣雄甘地”），（“业余者坐下来等待灵感，我们其余的人都站起来去上班。”，“斯蒂芬·金”），（“智慧不是教育的产物，而是终身尝试获得它。”，“阿尔伯特·爱因斯坦”）] 

让我们设置TableView。 我们的ViewController将包含以下代码：

  // 
  // ViewController.swift 
  // SelfSizingTableViewCells 
  // 
  //由Apps-Top.com团队创建 
  // Apps-Top.com 
  // 

 导入UIKit 

  ViewController类：UIViewController，UITableViewDelegate，UITableViewDataSource { 


  @IBOutlet弱var tableView：UITableView！ 

 让dataForTableView = [（“我没有失败。我刚刚找到了10,000种行不通的方法。”，“ Thomas A. Edison”），（“一个人不过是他思想的产物。他在想什么，他成为。”，“圣雄甘地”），（“业余者坐下来等待灵感，我们其余的人都站起来去上班。”，“斯蒂芬·金”），（“智慧不是教育的产物，而是终身尝试获得它。”，“阿尔伯特·爱因斯坦”）] 

 覆盖func viewDidLoad（）{ 
  super.viewDidLoad（） 
  //加载视图后进行其他任何设置，通常是从笔尖进行。 

  self.tableView.delegate =自我 
  self.tableView.dataSource =自我 

  } 

 覆盖func didReceiveMemoryWarning（）{ 
  super.didReceiveMemoryWarning（） 
  //处理所有可以重新创建的资源。 
  } 

  // tableView的Delegate和Datasource方法 



  func tableView（_ tableView：UITableView，heightForRowAt indexPath：IndexPath）-> CGFloat { 
 返回100 
  } 

  func tableView（_ tableView：UITableView，cellForRowAt indexPath：IndexPath）-> UITableViewCell { 

 让cellIdentifier =“ CellID” 

 让cell = tableView.dequeueReusableCell（withIdentifier：cellIdentifier）为？  QuotesTableViewCell 

 单元格？.quoteLabel.text = self.dataForTableView [indexPath.row] .0 
 单元格？.authorLabel.text = self.dataForTableView [indexPath.row] .1 

 返回单元格！ 

  } 

  func numberOfSections（在tableView中：UITableView）-> Int { 
 返回1 
  } 

  func tableView（_ tableView：UITableView，numberOfRowsInSection部分：Int）-> Int { 
 返回self.dataForTableView.count 
  } 


  } 

让我们运行我们的应用程序并查看结果：

您可以看到引号已被截断。 让我们解决这个问题。

要将表格视图单元格转换为自调整表格视图单元格，请执行以下操作：

选择您的quoteLabel并将Lines值设置为0：

将这两个方法添加到ViewController中：

  func tableView（_ tableView：UITableView，heightForRowAt indexPath：IndexPath）-> CGFloat { 

 返回UITableViewAutomaticDimension 

  } 

  func tableView（_ tableView：UITableView，EstimateHeightForRowAt indexPath：IndexPath）-> CGFloat { 
 返回100 
  } 

或者，您可以在ViewDidLoad中添加这些调用（可选）：

  tableView.rowHeight = UITableViewAutomaticDimensiontableView.estimatedRowHeight = 100 

系统使用“自动布局”来计算行的实际高度。 如Apple在这里建议的那样，在表格视图单元格的内容视图中布置其内容。 要定义单元格的高度，您需要一个不间断的约束和视图链（具有定义的高度），以填充内容视图的顶部边缘与其底部边缘之间的区域。 如果您的视图具有固有的内容高度，则系统将使用这些值。 如果不是，则必须将适当的高度限制添加到视图或内容视图本身。

更改AuthorLabel的底部约束从等于大于或等于。

运行该应用程序并查看结果。 Table View单元现在正在自动调整大小。 您会看到报价现在没有被裁剪。

让我们在dataForTableView数组中添加更长的引用。 将ViewController中的dataForTableView变量更改为此：

 让dataForTableView = [（“我没有失败。我刚刚找到了10,000种行不通的方法。”，“ Thomas A. Edison”），（“一个人不过是他思想的产物。他在想什么，他成为。”，“圣雄甘地”），（“业余者坐下来等待灵感，我们其余的人都站起来去上班。”，“斯蒂芬·金”），（“智慧不是教育的产物，而是”，“爱因斯坦”（Albert Einstein）），（“每天完成并完成它。您已尽力而为。一些错误和荒谬之处无疑会悄悄蔓延；请尽快将其忘记。 。明天是新的一天。您应该安详地开始，并且要有高昂的精神，以至于无法忍受您过去的废话。”，“拉尔夫·沃尔多·爱默生” 

现在再次运行您的应用以查看结果：

有用的链接：

https://developer.apple.com/library/content/documentation/UserExperience/Conceptual/AutolayoutPG/WorkingwithSelf-SizingTableViewCells.html

如果您喜欢此帖子，则可能对这些帖子也感兴趣：

iOS活动和Apple开发会议列表
适用于应用程序开发人员的最佳iOS开发播客

---

您可能感兴趣的相关帖子：
iOS活动-应用开发会议列表
最佳iOS开发播客列表

访问AppMakers.Dev网站，获取有关App开发的更多有趣帖子。 关注编辑