使用自动布局在某些单元格中加载图像

Posted

技术标签:

【中文标题】使用自动布局在某些单元格中加载图像【英文标题】:Load an image in certain cells using autolayout 【发布时间】:2016-03-10 01:13:18 【问题描述】:

所以我有一个 Feed 显示用户发布的帖子(使用 Parse)。目前,该单元格包含标题、发布用户的个人资料图像、日期、内容(文本)、一个 imageView(对于他们发布的图像)和一个喜欢和评论按钮。

我的问题是,使用自动布局显示他们发布的图像的最佳方法是什么。目前我一直将 imageView 高度设置为 0,然后我在代码中引用 imageView 的恒定高度。 该应用程序拉下所有帖子并开始加载帖子的 tableView。

在单元格中加载图片的代码是

if let imageToFetch = post.objectForKey("postImage") as? PFObject 
self.postImageHeight.constant = 500
if let fetchImage = imageToFetch.objectForKey("image") as? PFFile
    fetchImage.getDataInBackgroundWithBlock 
        (imageData: NSData?, error: NSError?) -> Void in
        if error == nil 
            if let imageData = imageData 
                let image = UIImage(data:imageData)
                self.postImage.image = image
                self.imageGesture(self.postImage)
            
        
    
 else 
    //Make the size constarints of the image 0
    self.postImageHeight.constant = 0

但这似乎是一种不稳定的方法,因为我正在对图像高度进行硬编码。任何关于这个问题的帮助都会得到帮助。

【问题讨论】:

您是否真的要拉伸/缩放图像,以实现单元格的一致外观? 我希望图像视图的大小与图像成比例。因此,横向图像会比它更高的图像更宽,而肖像图像反之亦然。里面的图像将始终设置为宽高比。 那么你的烦恼真的是如何从你从服务器获得的数据中读取图像像素信息? 不,我的一般问题是,我想要一个类似 facebook 的提要,用户可以在其中发布文本和图像。然后帖子应该展开以适合用户的帖子内容。文字和图像。文本展开正常。对于任何带有图片的帖子,我目前将 imageview 的高度设置为 500。我知道一定有更好的方法 拿到实物图后才能调整到正确的高/宽。 【参考方案1】:

您可以使用图像的size 属性更改它们。但为此,您需要使用此处引用的固定宽度kImageWidth

self.postImageHeight.constant = kImageWidth * image.size.height / image.size.width
self.layoutIfNeeded()

【讨论】:

这是一个很好的答案,现在,图像可以正确调整大小。但只有当我滚动图像并备份时。实际单元格不会使用 layoutIfNeeded 调整大小。 在 self.tableView.beginUpdates() 和 self.tableView.endUpdates() 之间使用 self.tableView.reloadRowsAtIndexPath() 使用委托给 viewController【参考方案2】:

简单答案:设置postImage.image后手动计算postImageHeight

/// .....
self.postImage.image = image
self.postImageHeight.constant = self.postImage.bounds.size.width * image.size.height / image.size.width
/// .....

更好的选择是给UITableViewCell子类添加一个特殊的方法:

func setPostImageWithImage(image: UIImage?) 
    postImageView.image = image

    // Manually adjust image height.
    if let image = image 
        postImageViewHeightConstraint.constant = postImageView.bounds.size.width * image.size.height / image.size.width
    
    else 
        // Collapse if there is no image.
        postImageViewHeightConstraint.constant = 0
    

【讨论】:

是的,shinoys222 有这个计算并且它有效,但问题是,图像是从网络上获取的。因此,单元格图像高度是在单元格加载后设置的。如果没有来自表格的奇怪效果,我似乎无法重新加载单元格。 我遇到了同样的问题,决定等到图像加载完毕后再插入一个新单元格。 图片加载后如何插入新单元格? 如何下载帖子?启动活动指示器,调用findObjects...,然后停止活动指示器?不要在获得对象后立即停止,等到相关的图片下载完成后,再停止微调器。 不,我明白,但图像视图在下载后应该调整大小。它目前没有。如果我向下滚动并备份图像高度是正确的

以上是关于使用自动布局在某些单元格中加载图像的主要内容,如果未能解决你的问题,请参考以下文章

带有图像和文本字段的自动布局表格单元格?

iOS 8 中的表格视图单元格自动布局

具有可变图像大小和自动布局的 UICollectionViewCell

表格视图单元格内的图像块并更改自动布局

仅通过自动布局确定 UICollectionView 单元格高度

使自定义单元格(使用自动布局创建)高度为零