【问题标题】:Xcode Imageview Aspect Fit Remove Extra SpaceXcode Imageview Aspect Fit 删除额外空间
【发布时间】:2016-11-23 11:45:24
【问题描述】:

我在 UITableViewCell 中有一个图像视图。

如果图像很大,带有 Aspect Fit 的 Imageview 会在顶部和底部创建大量额外空间。额外的空间(灰色背景颜色)如下图所示。

如何删除多余的空间?


几点说明:

  1. 此特定图像为 890 x 589,屏幕截图是在 iphone 6S 模拟器上拍摄的。

  2. 我正在使用 UITableViewAutomaticDimension 来实现自动表格单元格高度。

  3. 图像视图没有高度限制,因此可以相应地调整大小。

提前谢谢你。

【问题讨论】:

  • 你有没有想过这个问题?我也需要这样做,但在任何地方都找不到答案。
  • 我也想做同样的事情。
  • 任何人都可以解决这个问题。请帮助我。
  • @lostintranslation 我也面临同样的问题,请帮助我。
  • 请查看解决方案here

标签: xcode uitableview uiimageview tableview aspect-fit


【解决方案1】:

我有同样的问题。当原始图像大小(宽度和/或高度)大于保存它的 UIImageView 并且使用 Aspect Fit 调整图像大小以适合 UIImageView 时,就会发生这种情况。

在这里,图像宽度大于 UIImageView 的大小,因此 Aspect Fit 会调整图像大小,保持原始纵横比。如果您读取图像大小(通过手表或断点或其他方式),您将看到图像大小为(例如)600(h)x 800(w)(3:4 比例)。 UIImageView 宽度为(例如)320(w),因此显示的图像缩放为 240(h) x 320(w)(保持 3:4 的比例)。但是图像宽度仍然是 600 x 800,并且由于对 UIImageView 高度没有限制,因此 UIImageView 大小为 600 x 320 ->它将 UIImageView 高度设置为原始图像高度(600),因为它可以。

我的解决方案是这样的:(Swift 3)

在 Main.storyboard 中的 UIImageView 中添加高度约束,并通过 Outlet 链接:

@IBOutlet weak var displayimage: UIImageView!
@IBOutlet weak var displayimageHeightConstraint: NSLayoutConstraint!

然后测试 UIImageView 是否比它持有的图像小(宽度)。如果是这样,设置高度约束,使 UIImageView 的高宽比与图像纵横比相同:

if displayimage.frame.size.width < (displayimage.image?.size.width)! {
    displayimageHeightConstraint.constant = displayimage.frame.size.width / (displayimage.image?.size.width)! * (displayimage.image?.size.height)!
}

由于UIImageView高度受限且宽度设置为原始图像宽度的调整大小问题,如果图像两侧存在空白,也可以进行互补操作。

@IBOutlet weak var displayimageWidthConstraint: NSLayoutConstraint!

if displayimage.frame.size.height < (displayimage.image?.size.height)! {
    displayimageWidthConstraint.constant = displayimage.frame.size.height / (displayimage.image?.size.height)! * (displayimage.image?.size.height)!
}

【讨论】:

    【解决方案2】:

    上述答案在使用 UITableViewAutomaticDimension 时不起作用。

    一般的问题是tableView函数中的“cellForRowAt indexPath”tableView还没有布局单元格和子视图。

    所以解决这个问题的一种方法是使用 UITableView 的子类:

    class MyUITableView: UITableView {
    
        // Makes real device cell width available in "cellForRowAt indexPath"
        override func dequeueReusableCell(withIdentifier identifier: String, for indexPath: IndexPath) -> UITableViewCell {
            let cell = super.dequeueReusableCell(withIdentifier: identifier, for: indexPath)
            cell.frame.size.width = self.frame.size.width
            cell.layoutIfNeeded()
            return cell
        }
    }
    

    现在您可以使用任何解决方案,例如 Md Rais 评论中的链接。以我自己的代码为例:

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! ViewCell
    
        if let attach = eventsByDay[indexPath.section][indexPath.row].attachPhoto {
            let cellWidth = cell.attachPhoto.frame.size.width
            let scale = cellWidth / attach.size.width
            let size = CGSize(width: cellWidth, height: attach.size.height * scale)
    
            UIGraphicsBeginImageContextWithOptions(size, true, 0.0)             
            attach.draw(in: CGRect(origin: CGPoint.zero, size: size))
            cell.attachPhoto.image = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
        } else {
            cell.attachPhoto.image = nil
        }
    
        // ...
        return cell
    }
    

    【讨论】: