UIView 纵横比混淆 systemLayoutSizeFittingSize

Posted 2023-02-27

【中文标题】UIView 纵横比混淆 systemLayoutSizeFittingSize

【英文标题】：UIView aspect ratio confuses systemLayoutSizeFittingSize

【发布时间】：2014-09-04 11:48:43

【问题描述】：

好的，另一个 UITableViewCell 动态高度问题，但有点扭曲。 不幸的是，我不能仅在发布时才跳转到 ios 8，否则问题将得到解决。需要 iOS >= 7.1。

我正在尝试实现一个单元格，该单元格顶部有两个图像，下方有一个标题标签，下方有一个描述标签。我知道两个顶部图像将是方形的，因此我希望它们具有相同的尺寸并保持方形纵横比，但在屏幕尺寸变化时调整大小（如方向变化或不同的设备）。

可能有助于可视化的图像（由于代表而无法包含。没关系颜色，可视化帮助）： http://i.stack.imgur.com/kOhkl.png

注意最后一个文本后面的空白，那不应该存在。

我在之前的应用程序中实现了动态高度，根据： Using Auto Layout in UITableView for dynamic cell layouts & variable row heights（成功），现在也使用了同样的方法。

我已经使用情节提要和编程设置了约束，但没有成功。

这是踢球者。调用时：

CGFloat height = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;

在：

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

高度值远大于阅读时的高度：

cell.contentView.frame

另一个问题是，如果我删除图像上的纵横比约束并且只将其更改为明确的高度约束，它就可以正常工作。

对于任何愿意帮助的人，我整理了一个非常简单的示例项目来说明问题： https://github.com/alefr/DynamicTableCellHeight

它设置为使用故事板进行约束，并且有一个额外的分支：ExplicitHeightConstraint，它除了将纵横比约束更改为图像的高度约束之外什么都不做。

**所以问题是：** 任何人都可以看出限制条件有什么问题会混淆高度计算，或者有没有人有任何替代建议来获得想要的结果？ （虽然我想对视图使用自动布局）。

作品中有很多限制（虽然没有什么特别花哨的），所以我认为查看提供的故事板（github 链接）比在此处明确说明它们更容易。但是，如果有人认为我也可以这样做。估计的高度计算如下：

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath 

// Don't care about memory leaks now:
DynamicTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"dynamicCell"];

[self populateCell:cell withContent:self.tableData[indexPath.row]];

// Make sure the constraints have been set up for this cell, since it may have just been created from scratch.
// Use the following lines, assuming you are setting up constraints from within the cell's updateConstraints method:
[cell setNeedsUpdateConstraints];
[cell updateConstraintsIfNeeded];

// Set the width of the cell to match the width of the table view. This is important so that we'll get the
// correct cell height for different table view widths if the cell's height depends on its width (due to
// multi-line UILabels word wrapping, etc). We don't need to do this above in -[tableView:cellForRowAtIndexPath]
// because it happens automatically when the cell is used in the table view.
// Also note, the final width of the cell may not be the width of the table view in some cases, for example when a
// section index is displayed along the right side of the table view. You must account for the reduced cell width.
cell.bounds = CGRectMake(0.0f, 0.0f, CGRectGetWidth(tableView.bounds), CGRectGetHeight(cell.bounds));

// Do the layout pass on the cell, which will calculate the frames for all the views based on the constraints.
// (Note that you must set the preferredMaxLayoutWidth on multi-line UILabels inside the -[layoutSubviews] method
// of the UITableViewCell subclass, or do it manually at this point before the below 2 lines!)
[cell setNeedsLayout];
[cell layoutIfNeeded];

// Get the actual height required for the cell's contentView
CGFloat height = [cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;

// So we can read debug values
CGRect contentFrame = cell.contentView.frame;
CGRect firstImageFrame = cell.firstArtwork.frame;
CGRect secondImageFrame = cell.secondArtwork.frame;
CGRect nameFrame = cell.name.frame;
CGRect numArtworksFrame = cell.numArtworks.frame;

// Add an extra point to the height to account for the cell separator, which is added between the bottom
// of the cell's contentView and the bottom of the table view cell.
height += 1.0f;
return height;


- (void)populateCell:(DynamicTableViewCell*)cell withContent:(DynamicContent*)content

    cell.firstArtwork.image = content.firstImage;
    cell.secondArtwork.image = content.secondImage;
    cell.name.text = content.name;
    cell.numArtworks.text = [NSString stringWithFormat:@"%@ artworks", content.numImages];

谢谢

【问题讨论】：

看起来 systemLayoutSizeFittingSize 使用 1x 图像的固有内容大小来计算高度，而不考虑纵横比。所以它返回的 494.5 高度实际上是使用图像固有尺寸的高度。

是的，你是对的。样本中使用的许多图像具有相同的分辨率。我尝试了不同分辨率的图像并得到了不同的结果。如果有人想尝试一下，请使用名为 SizeVariations 的分支更新存储库。如果我们想要适合整个图像，那么这可能是 systemLayoutSizeFittingSize 想要的行为。不知道如何设置约束以“尊重” UIImagesViews 的约束设置，而不必为尺寸拟合设置显式高度。但至少我有一些事情要做。感谢您指出。

老实说，你真的想尝试使用正确大小的图像，否则可能会导致屏幕外渲染，这对滚动性能造成很大影响。使用 Core Animation Profiler 并打开“Color Offscreen-rendered Yellow”，你就会明白我的意思了。 （P.S. 你能把我的第一条评论标记为有帮助吗？）

我不知道。在应用程序中，我们从服务器获取第三方图像，因此我无法预先控制尺寸（尽管它们有纵横比限制）。但是，我当然可以在客户获取它们后调整它们的大小。不知道当使用固有尺寸评估并且异步获取图像时约束将如何反应。我需要研究的东西以及性能分析。我想将评论标记为有帮助，但不知道如何。只是我完全不懂技术还是与我的低代表有关？

将鼠标悬停在我发表的您喜欢的评论上，然后单击“向上”箭头。应该这样做。

【参考方案1】：

我遇到了同样的情况，并解决了它以覆盖给定单元格中的 systemLayoutSizeFittingSize 函数并将 aspectRation 约束替换为高度约束。在以下示例中，mediaPlayerAspectRationConstraint 在视图生命周期中添加到视图中，mediaPlayerHeightContraint 将用于确定单元格的正确高度（请参见下面的代码）。

所以，我用了

CGFloat height = [cell systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;

而不是[cell.contentView systemLayoutSizeFittingSize:]。

- (CGSize)systemLayoutSizeFittingSize:(CGSize)targetSize 
    self.mediaPlayerHeightContraint.constant = CGRectGetHeight(self.experienceMedia.frame);

    //Lets replace it with an exact height constraint (workaround).

    //To remove the Unable to simultaneously satisfy constraints. exceptions
    [self.contentView layoutIfNeeded];

    [self.experienceMedia removeConstraint:self.mediaPlayerAspectRationConstraint];
    [self.experienceMedia addConstraint:self.mediaPlayerHeightContraint];

    [self setNeedsUpdateConstraints];

    CGSize res = [self.contentView systemLayoutSizeFittingSize:targetSize];

    [self.contentView layoutIfNeeded];

    [self.experienceMedia removeConstraint:self.mediaPlayerHeightContraint];
    [self.experienceMedia addConstraint:self.mediaPlayerAspectRationConstraint];

    [self setNeedsUpdateConstraints];

    return res;