简体   繁体   English

滚动视图中的堆栈视图不滚动

[英]Stack view within a scroll view doesn't scroll

I've been having such a hard time with this issue for the past 2 days.在过去的 2 天里,我一直很难解决这个问题。 The structure I'm looking for is as follows:我正在寻找的结构如下:

  1. I want to have a scroll view take up the entire screen so that it's scrollable vertically.我想让滚动视图占据整个屏幕,以便它可以垂直滚动。
  2. I want the image view to be added at the top of the scroll view and a vertical stack view to be added to below.我希望将图像视图添加到滚动视图的顶部,并将垂直堆栈视图添加到下方。

The key point is for the vertical stack view to increase in its height dynamically depending on the content.关键是垂直堆栈视图根据内容动态增加其高度。

First, I just tried adding the stack view without the image view just to test out the dynamic scrollable height.首先,我只是尝试添加没有图像视图的堆栈视图,只是为了测试动态可滚动高度。 Followed the SO answer from here :按照这里的SO答案:

  1. Added the scroll view with 0, 0, 0, 0 constraints.添加了具有 0、0、0、0 约束的滚动视图。
  2. Added the stack view to the scroll view.将堆栈视图添加到滚动视图。 Set the constraints to the Content Layout Guide , 0, 0, 0, 0 constraints.将约束设置为Content Layout Guide , 0, 0, 0, 0 约束。
  3. Set the width of the stack view to be equal the scroll view.将堆栈视图的宽度设置为等于滚动视图。

在此处输入图像描述

This gave me a constraint error saying I need to set a fixed height for the scroll view.这给了我一个约束错误,说我需要为滚动视图设置一个固定的高度。 Adding the constraint doesn't let me scroll.添加约束不允许我滚动。 I tried pinning the stack view to the scroll view directly, and not to the Content Layout Guide , but still doesn't work.我尝试将堆栈视图直接固定到滚动视图,而不是Content Layout Guide ,但仍然无法正常工作。

I followed Apple's documentation on the scroll view and added a content view within the scroll view before pinning the stack view to the content view:在将堆栈视图固定到内容视图之前,我遵循了 Apple 关于滚动视图的文档并在滚动视图中添加了一个内容视图:

在此处输入图像描述

This doesn't scroll either.这也不滚动。

The stack view's distribution was either set at equal spacing or fill.堆栈视图的分布设置为等间距或填充。

Please help.请帮忙。

This answer did work for me.这个答案对我有用。

Add the scroll view and pin four edges to safe area .添加scroll view并将四个边缘固定到safe area Make sure value of constraints is 0.确保约束的值为 0。

Add the stackview inside scrollview and pin four edges to scrollview with constraint value 0.在滚动视图中添加stackview scrollview ,并将四个边固定到约束值为 0 的scrollview

Set stack view's width equal to scroll view's width.设置stack view's宽度等于scroll view's宽度。

Add as many views inside stackview .stackview中添加尽可能多的视图。

To test if scrolling works, set fixed height for views inside stackview to make sure that scrollview has scrollable height.要测试滚动是否有效,请为stackview中的视图设置固定高度,以确保滚动scrollview具有可滚动高度。 Then with the stackview selected, drag with two fingers inside the viewcontroller .然后选择stackview ,用两根手指在viewcontroller内拖动。 The stackview should scroll within the scrollview . stackview应该在scrollview内滚动。

This is how the constraints are set:这是设置约束的方式:

在此处输入图像描述

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM