UICollectionViewCompositionLayout 与包含固定比例 UIImageView 的自动调整单元格
UICollectionViewCompositionLayout with auto-sizing cells containing a fixed ratio UIImageView
目标是为包含固定纵横比 UIImageView
的全角单元格配置 UICollectionViewCompositionalLayout
(加上下面的一些其他视图,包括可变高度 UILabel
s 和 UIStackView
s) 并让单元格正确地自动调整大小。我天真的尝试没有用,我也不知道为什么。我在这里展示的简单案例在运行时给了我一堆约束错误。
我抄袭了 的代码,但它看起来很简单:
override func viewDidLoad() {
super.viewDidLoad()
let size = NSCollectionLayoutSize(
widthDimension: NSCollectionLayoutDimension.fractionalWidth(1),
heightDimension: NSCollectionLayoutDimension.estimated(100)
)
let item = NSCollectionLayoutItem(layoutSize: size)
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitem: item, count: 1)
let section = NSCollectionLayoutSection(group: group)
section.interGroupSpacing = 10
let layout = UICollectionViewCompositionalLayout(section: section)
collectionView.collectionViewLayout = layout
}
约束如下所示:
我一滚动,就收到这些约束错误:
2021-01-21 20:29:18.311491+0100 CompositionalLayoutDynamicHeight[96399:2597528] [LayoutConstraints] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want.
Try this:
(1) look at each constraint and try to figure out which you don't expect;
(2) find the code that added the unwanted constraint or constraints and fix it.
(
"<NSLayoutConstraint:0x6000020a82d0 UIImageView:0x138818600.width == 1.33333*UIImageView:0x138818600.height (active)>",
"<NSLayoutConstraint:0x6000020a8460 V:|-(0)-[UIImageView:0x138818600] (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a84b0 H:[UIImageView:0x138818600]-(0)-| (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a8500 V:[UIImageView:0x138818600]-(0)-| (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a8550 H:|-(0)-[UIImageView:0x138818600] (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a85a0 'UIIBSystemGenerated' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.leading == UIView:0x13881c4d0.leading (active)>",
"<NSLayoutConstraint:0x6000020a85f0 'UIIBSystemGenerated' H:[UIView:0x13881c4d0]-(0)-| (active, names: '|':CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280 )>",
"<NSLayoutConstraint:0x6000020a8640 'UIIBSystemGenerated' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.top == UIView:0x13881c4d0.top (active)>",
"<NSLayoutConstraint:0x6000020a8690 'UIIBSystemGenerated' V:[UIView:0x13881c4d0]-(0)-| (active, names: '|':CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280 )>",
"<NSLayoutConstraint:0x6000020a60d0 'UIView-Encapsulated-Layout-Height' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.height == 292.667 (active)>",
"<NSLayoutConstraint:0x6000020a6120 'UIView-Encapsulated-Layout-Width' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.width == 390 (active)>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x6000020a82d0 UIImageView:0x138818600.width == 1.33333*UIImageView:0x138818600.height (active)>
Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKitCore/UIView.h> may also be helpful.
AutoLayout 似乎正在创建与宽高比约束冲突的 UIView-Encapsulated-Layout-Height
约束——但为什么它不调整大小以适应它?
在为集合视图(和 Table 视图)布置 UI 元素时,自动布局会进行多次“通过”。
经常,尤其是在使用可变大小的单元格内容时,自动布局会在遍历约束时抛出警告。
消除该警告的最简单方法可能是为您的纵横比约束设置 Priority
小于必需值。
如果您将它设置为 Default High (750)
,这会告诉自动布局允许它“破坏”它而不抛出警告(但它仍然会被应用)。
我在具有动态项目宽度的水平滑块上遇到了同样的问题。我在我的案例中找到了解决方案,这对我来说像是一个错误。
创建 NSCollectionLayoutGroup
有两个函数。使用另一个为我修复了它。
这打破了我的限制:
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitem: item, count: 1)
这不是:
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitems: [item])
目标是为包含固定纵横比 UIImageView
的全角单元格配置 UICollectionViewCompositionalLayout
(加上下面的一些其他视图,包括可变高度 UILabel
s 和 UIStackView
s) 并让单元格正确地自动调整大小。我天真的尝试没有用,我也不知道为什么。我在这里展示的简单案例在运行时给了我一堆约束错误。
我抄袭了
override func viewDidLoad() {
super.viewDidLoad()
let size = NSCollectionLayoutSize(
widthDimension: NSCollectionLayoutDimension.fractionalWidth(1),
heightDimension: NSCollectionLayoutDimension.estimated(100)
)
let item = NSCollectionLayoutItem(layoutSize: size)
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitem: item, count: 1)
let section = NSCollectionLayoutSection(group: group)
section.interGroupSpacing = 10
let layout = UICollectionViewCompositionalLayout(section: section)
collectionView.collectionViewLayout = layout
}
约束如下所示:
我一滚动,就收到这些约束错误:
2021-01-21 20:29:18.311491+0100 CompositionalLayoutDynamicHeight[96399:2597528] [LayoutConstraints] Unable to simultaneously satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want.
Try this:
(1) look at each constraint and try to figure out which you don't expect;
(2) find the code that added the unwanted constraint or constraints and fix it.
(
"<NSLayoutConstraint:0x6000020a82d0 UIImageView:0x138818600.width == 1.33333*UIImageView:0x138818600.height (active)>",
"<NSLayoutConstraint:0x6000020a8460 V:|-(0)-[UIImageView:0x138818600] (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a84b0 H:[UIImageView:0x138818600]-(0)-| (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a8500 V:[UIImageView:0x138818600]-(0)-| (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a8550 H:|-(0)-[UIImageView:0x138818600] (active, names: '|':UIView:0x13881c4d0 )>",
"<NSLayoutConstraint:0x6000020a85a0 'UIIBSystemGenerated' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.leading == UIView:0x13881c4d0.leading (active)>",
"<NSLayoutConstraint:0x6000020a85f0 'UIIBSystemGenerated' H:[UIView:0x13881c4d0]-(0)-| (active, names: '|':CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280 )>",
"<NSLayoutConstraint:0x6000020a8640 'UIIBSystemGenerated' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.top == UIView:0x13881c4d0.top (active)>",
"<NSLayoutConstraint:0x6000020a8690 'UIIBSystemGenerated' V:[UIView:0x13881c4d0]-(0)-| (active, names: '|':CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280 )>",
"<NSLayoutConstraint:0x6000020a60d0 'UIView-Encapsulated-Layout-Height' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.height == 292.667 (active)>",
"<NSLayoutConstraint:0x6000020a6120 'UIView-Encapsulated-Layout-Width' CompositionalLayoutDynamicHeight.CollectionViewCell:0x13881c280.width == 390 (active)>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x6000020a82d0 UIImageView:0x138818600.width == 1.33333*UIImageView:0x138818600.height (active)>
Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKitCore/UIView.h> may also be helpful.
AutoLayout 似乎正在创建与宽高比约束冲突的 UIView-Encapsulated-Layout-Height
约束——但为什么它不调整大小以适应它?
在为集合视图(和 Table 视图)布置 UI 元素时,自动布局会进行多次“通过”。
经常,尤其是在使用可变大小的单元格内容时,自动布局会在遍历约束时抛出警告。
消除该警告的最简单方法可能是为您的纵横比约束设置 Priority
小于必需值。
如果您将它设置为 Default High (750)
,这会告诉自动布局允许它“破坏”它而不抛出警告(但它仍然会被应用)。
我在具有动态项目宽度的水平滑块上遇到了同样的问题。我在我的案例中找到了解决方案,这对我来说像是一个错误。
创建 NSCollectionLayoutGroup
有两个函数。使用另一个为我修复了它。
这打破了我的限制:
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitem: item, count: 1)
这不是:
let group = NSCollectionLayoutGroup.horizontal(layoutSize: size, subitems: [item])