问题描述
- 首先,我在包含堆栈视图的滚动视图中创建了一个名为
public async void EditTextSample() { Thread lUiThread = Thread.CurrentThread; //SelectedTab is the current tab viewed by the user in my application ITextSource lDocumentSnapshot = SelectedTab.TextEditor.Document.CreateSnapshot(); TextDocument lNewDocument = null; await Task.Run(() => { lNewDocument = new TextDocument(); string lCurrentText = lDocumentSnapshot.Text; string lNewText = ""; lNewDocument.Text = lNewText; lNewDocument.SetownerThread(lUiThread); }); SelectedTab.TextEditor.Document = lNewDocument; }
的视图,这意味着我现在拥有contentView
->view
->scrollView
- >contentView
。 - 我将内容视图的开头,结尾,顶部和底部锚点设置为与滚动视图内容布局指南中的约束相同。
- 我使内容视图的宽度与滚动视图框架布局指南的宽度相同。
- 我使堆栈视图的前导,尾随,顶部和底部锚点等于内容视图的相应锚点。
这不会滚动。
我尝试遵循此answer:
- 我摆脱了
stackView
,并将Content Layout Guides
的约束条件设为0,0应用于所有4个面,并将其水平和垂直地置于滚动视图的中心。 li> - 在尺寸检查器中,更改底部并将中心Y优先级调整为250。
- 将堆栈视图的底部锚点设置为
contentView
(而不是滚动视图)。
这只会滚动一点,但不会完全滚动底部。许多视图只是隐藏在屏幕之外。
我还尝试完全摆脱view
,并将堆栈视图固定到滚动视图或直接固定到contentView
,但没有一个起作用。
最后,我尝试了这种看起来很hacky的@R_404_6280@案:
view
P.S。我正在以编程方式为堆栈视图添加约束:
override func viewWillLayoutSubviews(){
super.viewWillLayoutSubviews()
scrollView.contentSize = CGSize(width: view.bounds.width,height: view.bounds.height+300)
}
解决方法
这是一个有效的示例-查看您是否可以弄清自己可能做过的事情。
我们将使用代码将堆栈视图直接添加到滚动视图中,而不是使用“内容视图”。
这是情节提要板布局:
以下是情节提要的源代码,因此您可以直接对其进行检查:
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="16096" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="dVO-AO-rAX">
<device id="retina3_5" orientation="portrait" appearance="light"/>
<dependencies>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="16087"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--Kevvv View Controller-->
<scene sceneID="e7x-2X-Pdg">
<objects>
<viewController id="dVO-AO-rAX" customClass="KevvvViewController" customModule="MiniScratch" customModuleProvider="target" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="ZMq-2S-yNo">
<rect key="frame" x="0.0" y="0.0" width="320" height="480"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" ambiguous="YES" translatesAutoresizingMaskIntoConstraints="NO" id="bEj-BB-5lU">
<rect key="frame" x="0.0" y="44" width="320" height="402"/>
<viewLayoutGuide key="contentLayoutGuide" id="VmC-Gj-CCr"/>
<viewLayoutGuide key="frameLayoutGuide" id="HBJ-Ua-m26"/>
</scrollView>
</subviews>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<constraints>
<constraint firstItem="bEj-BB-5lU" firstAttribute="leading" secondItem="goZ-oS-cQl" secondAttribute="leading" id="Jwq-Tg-wRK"/>
<constraint firstItem="goZ-oS-cQl" firstAttribute="bottom" secondItem="bEj-BB-5lU" secondAttribute="bottom" constant="34" id="bHJ-DL-1xi"/>
<constraint firstItem="bEj-BB-5lU" firstAttribute="trailing" secondItem="goZ-oS-cQl" secondAttribute="trailing" id="gIL-OY-ENf"/>
<constraint firstItem="bEj-BB-5lU" firstAttribute="top" secondItem="goZ-oS-cQl" secondAttribute="top" constant="44" id="zAh-qk-82E"/>
</constraints>
<viewLayoutGuide key="safeArea" id="goZ-oS-cQl"/>
</view>
<connections>
<outlet property="scrollView" destination="bEj-BB-5lU" id="jYI-Wh-d6w"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="ieG-NN-t0K" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="136.875" y="105"/>
</scene>
</scenes>
</document>
下面是示例代码,它将在堆栈视图中添加一个堆栈视图,在堆栈视图中添加40个标签,然后将堆栈视图适当地限制在滚动视图中:
class KevvvViewController: UIViewController {
@IBOutlet var scrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
let stack = UIStackView()
stack.axis = .vertical
stack.spacing = 12
stack.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(stack)
for i in 1...40 {
let v = UILabel()
v.backgroundColor = .yellow
v.text = "Label \(i)"
stack.addArrangedSubview(v)
}
NSLayoutConstraint.activate([
stack.topAnchor.constraint(equalTo: scrollView.contentLayoutGuide.topAnchor),stack.leadingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.leadingAnchor),stack.trailingAnchor.constraint(equalTo: scrollView.contentLayoutGuide.trailingAnchor),stack.bottomAnchor.constraint(equalTo: scrollView.contentLayoutGuide.bottomAnchor),stack.widthAnchor.constraint(equalTo: scrollView.frameLayoutGuide.widthAnchor),])
// to make it easy to see the scroll view frame
scrollView.backgroundColor = .cyan
}
}
向下滚动到第17个标签(iPhone 8)后的结果:
,似乎您只需要一个UIScrollView
和一个UIStackView
:
UIScrollView
和UIStackView
都将top,bottom,前导和尾随约束设置为其各自的超级视图。唯一的不同是UIStackView
的宽度和Safe Area
的宽度之间的最后一个约束。 (这取决于您希望UIStackView
的宽度)
您可能还需要将UIStackView
的{{1}}设置为Distribution
之类的内容,以确保始终根据其内容扩展。
此外,在Equal Spacing
中添加一些内容,以使自动布局停止抱怨。 (避免在界面构建器上出现红色约束)
试一下。