时间戳

首页 > 解决方案 > 如何用图像调整表格视图单元格的大小？

ios - 如何用图像调整表格视图单元格的大小？

问题描述

我正在尝试制作食谱搜索应用程序。我正在尝试从 API 获取结果以及与这些结果关联的图像，并使用基本表格视图单元格将它们显示在表格视图中。

当我下载图像时，图像框架设置为其固有大小，因此它将是下载图像的尺寸。当我在此图像上设置约束时，它变小了，但您仍然可以看到框架正在影响文本放置。

这是设置约束之前的样子：https ://imgur.com/srmKJtV

这是设置约束后的样子：https ://imgur.com/DFLviBK

这是我用来设置单元格的代码：

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "recipe", for: indexPath)
         
    cell.imageView?.translatesAutoresizingMaskIntoConstraints = false
    cell.imageView?.heightAnchor.constraint(equalToConstant: 100).isActive = true
    cell.imageView?.widthAnchor.constraint(equalToConstant: 100).isActive = true
    cell.imageView?.image = recipeResults[indexPath.row].image
  
    cell.textLabel?.numberOfLines = 0
    cell.textLabel?.text = "\(recipeResults[indexPath.row].title)"
            
    return cell
}

有谁知道我如何将图像保持为 100x100 并使每一行中的文本排列得很好？

我还注意到我在使单元格出列时遇到问题，因为当我单击该行或向上/向下滚动时，图像会变回正常的大尺寸而不保持小尺寸。我怎样才能解决这个问题？

标签： iosswiftimagetableview

解决方案

使用自定义单元格而不是basic单元格。

通过这种方式，您将能够自定义您想要的组件。

  • .xib通过或在创建您自己的自定义单元格Interface Builder

  • 将水平添加到您的单元格中并将UIStackView其约束为leading,trailing和.topbottom

  • imageView将and添加label到stackView. 你应该给width你的imageView. 在您的情况下，它是硬编码的100。

推荐阅读