我有一个非常简单的集合视图,其中包含图像,我的Cell类如下所示:
class ImageListCell: UICollectionViewCell {
@IBOutlet weak var btnDelete: UIButton! {
didSet {
btnDelete.layer.cornerRadius = btnDelete.frame.height / 2
}
}
@IBOutlet weak var imageView: UIImageView!
@IBAction func btnDeleteTap(_ sender: Any) {
print("Delete image")
}
}
单元格的imageView约束在顶部和尾部边缘有一些填充:
如果我将ImageListCell背景设置为红色,将imageView背景设置为绿色,则如下所示:
完全正确!
然而,如果我所做的只是添加一个图像到imageView的约束得到所有愚蠢的?
这只发生在.aspectFill中,如果我将其更改为.scaleToFill,它会工作,但图像都被拉伸。
我确保我没有调整单元格大小或任何东西,并关闭了集合视图上的Estimated Size
。
有人知道为什么.aspectFill会覆盖我的约束吗?
2条答案
按热度按时间gdx19jrr1#
你的问题中有几处似乎不正确。
你所指的内容模式的值是
.aspectFit
和.aspectFill
。在Swift代码中没有这样的值。这些值是.scaleAspectFit
和.scaleAspectFill
。在情节串连图板中,视图的“内容模式”属性可以是“方面适合”、“方面填充”等。因为你是在故事板中设置单元格的,所以我将引用故事板属性设置。我所描述的一切都适用于集合视图单元格中的UIImageView插座。
您显示的第一个屏幕截图(您声称为
.aspectFit
)只有在您将“内容模式”设置为“方面填充”时才会出现(不是你声称的“宽高比适合”),并且你关闭了“剪裁到边界”设置。设置了“宽高比填充”,宽图像将正确地填充图像视图的高度(这就是为什么你仍然可以看到顶部的红色边框,但是图像的左边和右边会溢出到图像视图之外(这就是为什么你看不到右边的红色边框)。如果选中了“剪切到边界”,右侧红色边框将可见。集合视图单元格本身会剪切其所有内容,以防止溢出的图像溢出单元格的框架。你展示的第二张截图,你声称是
.aspectFill
,将是将“内容模式”设置为“缩放以填充”,而不是“纵横比填充”的结果。无论是否选中“剪辑到边界”,结果都是一样的。“缩放以填充”根据需要扭曲图像,以完全填充图像视图的高度和宽度。根据您的描述,您想将“内容模式”设置为“宽高比”。虽然“宽高比”并不真正需要,但启用“剪裁到边界”也无妨。这将显示整个图像,带有适当的绿色边框,并且没有失真。
tl;dr -你的限制很好。你并没有在第一张图片中将图片视图的内容模式设置为“Aspect Fit”。你只是将其设置为“Aspect Fill”并且“Clip to Bounds”关闭。
如果要在代码中执行此操作,则需要:
xxe27gdn2#
.aspectFit
的行为 * 完全符合预期:* 图像视图中图像外部周围没有空白,图像也没有失真。如果您不喜欢图像从右侧“泄漏”的事实,那只是因为您忘记将图像视图的clipsToBounds
设置为true
。.aspectFill
,而是.scaleToFill
,两者有很大的不同,所以你对现象的陈述甚至是不正确的。.scaleToFill
会扭曲图像;.aspectFill
不会这样做(但它会显示图像视图的绿色背景)。