[英]UIStackView in UIScrollView not scrolling
I am having a bit of trouble implementing a UIStackView
in a UIScrollView
.我在
UIScrollView
实现UIStackView
时遇到了一些麻烦。 My view hierarchy looks something like this:我的视图层次结构如下所示:
┌─────────────────────────────┐
│ViewController │
│┌───────────────────────────┐│
││Spacer UIView ││
│└───────────────────────────┘│
│┌───────────────────────────┐│
││ UIScrollView ││
││┌─────────────────────────┐││
│││UIStackView │││
│││ │││
│││ │││
││└─────────────────────────┘││
│└───────────────────────────┘│
│┌───────────────────────────┐│
││Spacer UIView ││
│└───────────────────────────┘│
│┌───────────────────────────┐│
││UIView with other content ││
││height: 300 ││
│└───────────────────────────┘│
└─────────────────────────────┘
I have the spacer views so that the content get's vertically centered, if it is shorter than the full height of the screen.我有间隔视图,以便内容垂直居中,如果它短于屏幕的整个高度。 I layout the
NSLayoutConstraints
as follows V:|-[spacer1]-[scrollview]-[spacer2(==spacer1)]-[footerView]-|
我将
NSLayoutConstraints
布局如下V:|-[spacer1]-[scrollview]-[spacer2(==spacer1)]-[footerView]-|
The UIStackView get's filled with UIViews
each with a height of 50 (basically a table with rows).该UIStackView GET充满了
UIViews
每50的高度(基本上与行的表)。
So far so good.到现在为止还挺好。 As soon as my stack view has more rows than "room", I get an unending stream of error messages stating that the constraint (the height of the individual row) must be broken.
一旦我的堆栈视图的行数超过“房间”,我就会收到一连串无休止的错误消息,指出必须打破约束(单行的高度)。 The error messages keep on going back and forth with constantly new objects memory id - it basically never finishes.
错误消息会随着不断新的对象内存 id 不断来回传递 - 它基本上永远不会完成。 I am assuming that the content height of my scroll view does not get set correctly.
我假设我的滚动视图的内容高度没有正确设置。
In my viewDidLoad
I setup the spacer and scrollview as such:在我的
viewDidLoad
我设置了垫片和滚动视图:
let spacer1 = UIView()
spacer1.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(spacerView1)
spacerView1.widthAnchor.constraint(equalTo: self.view.widthAnchor).isActive = true
let scroll = UIScrollView()
scroll.translatesAutoresizingMaskIntoConstraints = false
scroll.showsHorizontalScrollIndicator = false
self.view.addSubview(scroll)
scroll.widthAnchor.constraint(equalTo: self.view.widthAnchor).isActive = true
let stack = UIStackView()
stack.axis = .vertical
stack.translatesAutoresizingMaskIntoConstraints = false
stack.alignment = .center
stack.spacing = 2
stack.distribution = .equalSpacing
scroll.addSubview(stack)
stack.topAnchor.constraint(equalTo: scroll.topAnchor).isActive = true
stack.leftAnchor.constraint(equalTo: scroll.leftAnchor).isActive = true
stack.rightAnchor.constraint(equalTo: scroll.rightAnchor).isActive = true
stack.bottomAnchor.constraint(equalTo: scroll.bottomAnchor).isActive = true
stack.widthAnchor.constraint(equalTo: scroll.widthAnchor).isActive = true
stack.heightAnchor.constraint(equalTo: scroll.heightAnchor).isActive = true
In another method which is called from another class, I then add UIViews
to the UIStackView
simply by adding them like: stack.addArrangedSubview(rowView)
.在从另一个类调用另一方法中,我然后添加
UIViews
到UIStackView
:简单地将其添加像stack.addArrangedSubview(rowView)
After adding the UIView to the stack view I resize the scroll view with将 UIView 添加到堆栈视图后,我调整滚动视图的大小
extension UIScrollView {
func resizeScrollViewContentSize() {
var contentRect = CGRect.zero
for view in self.subviews {
contentRect = contentRect.union(view.frame)
}
self.contentSize = contentRect.size
}
}
which gives the constraint breaking errors.这给出了约束破坏错误。
If I delete the height constraint of the stack view, then it collapses and the debug view hierarchy tells me that the height and vertical position of UIStackView are ambiguous.如果我删除堆栈视图的高度约束,那么它会折叠并且调试视图层次结构告诉我 UIStackView 的高度和垂直位置不明确。 I also tried to simply set
scroll.contentSize = stack.frame.size
once all the rows were added to the stack view.一旦所有行都添加到堆栈视图中,我还尝试简单地设置
scroll.contentSize = stack.frame.size
。 But that didn't work either.但这也不起作用。 I have also tried to add the rows to the stack view first and then add the stack view to the scroll view.
我还尝试先将行添加到堆栈视图,然后将堆栈视图添加到滚动视图。 That way the stack view should know its size requirements, but that didn't work either.
这样堆栈视图应该知道它的大小要求,但这也不起作用。
As mentioned this works fine, as long as the total height of the rows is smaller than the possible space.如前所述,只要行的总高度小于可能的空间,就可以正常工作。 As soon as I add one more row or I execute the app on a device with smaller screen size I get
Will attempt to recover by breaking constraint <NSLayoutConstraint:0x600000b29fe0 MyApp.RowView:0x7fc571e840f0.height == 50 (active)>
.一旦我再添加一行或在屏幕尺寸较小的设备上执行应用程序,我
Will attempt to recover by breaking constraint <NSLayoutConstraint:0x600000b29fe0 MyApp.RowView:0x7fc571e840f0.height == 50 (active)>
。
Basically the scrolling functionality of the UIScrollView
is not working with my stack view.基本上
UIScrollView
的滚动功能不适用于我的堆栈视图。 How can I force the scroll view to re-calculate the need height for it's content.如何强制滚动视图重新计算其内容所需的高度。
What am I missing or doing wrong?我错过了什么或做错了什么?
Thanks谢谢
To manage with this problem stackView height must be dynamic.为了解决这个问题,stackView 高度必须是动态的。 Try to set height constraint priority to 750, after subviews did layout, everything must work
尝试将高度约束优先级设置为 750,子视图布局后,一切正常
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.