如何动态调整单个 UIStackView 的行高以填满整个屏幕？
Posted
技术标签:
【中文标题】如何动态调整单个 UIStackView 的行高以填满整个屏幕？【英文标题】：How to make a single UIStackView's row height dynamically adjusted to fill the entire screen? 【发布时间】：2019-07-16 18:48:14 【问题描述】：我的布局如下：
我希望Stack View 填满整个屏幕。我希望绿色 View 表现得像上面的行和底部视图之间的空间。绿色行应该有一个最小高度（比如 20 点），它应该根据设备的高度调整自己的高度，以填满整个屏幕。如果设备的高度较小，那么布局应该是可滚动的（我使用的是Scroll View）。
注意：底部的圆圈表示由于布局没有完全填充而留下的“空白空间”（实际上是内容View的背景颜色）。内容 View 不应该是可见的。
“菜单堆栈视图”具有以下属性：
【问题讨论】：
【参考方案1】： 绿色视图的高度约束应为>= 20
StackView 应该有一个宽度约束等于 ScrollView 的宽度
StackView 应该有一个高度约束等于 ScrollView 的高度，Priority: 750
StackView 应在 ScrollView 的所有 4 面都受到约束
应该这样做！
编辑：
刚刚看到您有一个 UIView 持有 StackView...
你真的不需要那个，所以你可以：
删除那个视图，让 StackView 成为滚动视图的“根”视图，或者
绿色视图的高度约束应为>= 20
StackView 应该在所有 4 个侧面都被限制到 UIView
UIView 应该有一个宽度约束等于 ScrollView 的宽度
UIView 应该有一个高度约束等于 ScrollView 的高度，Priority: 750
编辑 2：
如果您在 contentView / StackView 高度约束上看到Priority: 250 的答案，它可以工作，但并不总是在 IB / Storyboard 中立即更新（更改“查看为：设备”时）。将其设置为 @987654328 @也在运行时工作，并且在维护 Storyboard 中的布局方面做得更好。
这是一个示例故事板。它有两个视图“匹配”控制器——一个带有一个“内容视图”，一个没有：
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14490.70" targetRuntime="ios.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="lQ9-cT-kGJ">
<device id="retina6_1" orientation="portrait">
<adaptation id="fullscreen"/>
</device>
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14490.49"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--Without Content View-->
<scene sceneID="fpf-XB-SxY">
<objects>
<viewController id="lQ9-cT-kGJ" userLabel="Without Content View" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="fIT-Xh-wDY">
<rect key="frame" x="0.0" y="0.0" />
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="V9k-Oj-b66">
<rect key="frame" x="0.0" y="44" />
<subviews>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" translatesAutoresizingMaskIntoConstraints="NO" id="Iia-IH-hjS">
<rect key="frame" x="0.0" y="0.0" />
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="KHw-zC-OPn">
<rect key="frame" x="0.0" y="0.0" />
<color key="backgroundColor" red="0.99806135890000003" green="0.96808904409999996" blue="0.12760734560000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="bv0-aW-7AU"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="uGD-v3-lUW">
<rect key="frame" x="0.0" y="150" />
<color key="backgroundColor" red="0.9981210828" green="0.7443595529" blue="0.3907994628" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="E1D-ib-QRx"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Mje-14-Tbd">
<rect key="frame" x="0.0" y="300" />
<color key="backgroundColor" red="0.99805814029999995" green="0.40440851449999998" blue="0.31141346689999999" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="fMn-Hk-F5G"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="D49-Gt-N8s">
<rect key="frame" x="0.0" y="450" />
<color key="backgroundColor" red="0.99912148710000004" green="0.17214331029999999" blue="0.38572910430000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="5BE-5m-P8B"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="O9M-qj-KPE">
<rect key="frame" x="0.0" y="600" />
<color key="backgroundColor" red="0.33141675590000003" green="0.98072248699999998" blue="0.40079861880000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="20" id="giA-Vz-78H"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Lhc-kd-s85">
<rect key="frame" x="0.0" y="778" />
<color key="backgroundColor" red="1" green="0.2503993511" blue="0.97168940309999996" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="40" id="G0c-fN-TP7"/>
</constraints>
</view>
</subviews>
</stackView>
</subviews>
<color key="backgroundColor" red="0.0" green="0.47843137250000001" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstItem="Iia-IH-hjS" firstAttribute="width" secondItem="V9k-Oj-b66" secondAttribute="width" id="36y-ht-1ZL"/>
<constraint firstItem="Iia-IH-hjS" firstAttribute="height" secondItem="V9k-Oj-b66" secondAttribute="height" priority="750" id="BAJ-IB-R4g"/>
<constraint firstItem="Iia-IH-hjS" firstAttribute="top" secondItem="V9k-Oj-b66" secondAttribute="top" id="QHY-7z-ekV"/>
<constraint firstItem="Iia-IH-hjS" firstAttribute="leading" secondItem="V9k-Oj-b66" secondAttribute="leading" id="cKH-2e-Ovg"/>
<constraint firstAttribute="bottom" secondItem="Iia-IH-hjS" secondAttribute="bottom" id="cye-Ww-qAH"/>
<constraint firstAttribute="trailing" secondItem="Iia-IH-hjS" secondAttribute="trailing" id="udZ-yd-vnu"/>
</constraints>
</scrollView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstItem="sd1-79-0ea" firstAttribute="trailing" secondItem="V9k-Oj-b66" secondAttribute="trailing" id="WGi-oU-rbN"/>
<constraint firstItem="sd1-79-0ea" firstAttribute="bottom" secondItem="V9k-Oj-b66" secondAttribute="bottom" id="fnq-aB-tb0"/>
<constraint firstItem="V9k-Oj-b66" firstAttribute="leading" secondItem="sd1-79-0ea" secondAttribute="leading" id="g91-1x-kaM"/>
<constraint firstItem="V9k-Oj-b66" firstAttribute="top" secondItem="sd1-79-0ea" secondAttribute="top" id="reB-s3-Un5"/>
</constraints>
<viewLayoutGuide key="safeArea" id="sd1-79-0ea"/>
</view>
<navigationItem key="navigationItem" id="1y7-cc-tli"/>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="2g2-ck-IEI" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="2565" y="163"/>
</scene>
<!--With Content View-->
<scene sceneID="vq1-pI-V6t">
<objects>
<viewController id="lR1-JQ-SAe" userLabel="With Content View" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="rsN-vT-52r">
<rect key="frame" x="0.0" y="0.0" />
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="8Lg-op-1W1">
<rect key="frame" x="0.0" y="44" />
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ygo-gK-BzW" userLabel="ContentView">
<rect key="frame" x="0.0" y="0.0" />
<subviews>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" translatesAutoresizingMaskIntoConstraints="NO" id="eZ0-N0-ecD">
<rect key="frame" x="0.0" y="0.0" />
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Fta-Vk-7rB">
<rect key="frame" x="0.0" y="0.0" />
<color key="backgroundColor" red="0.99806135890000003" green="0.96808904409999996" blue="0.12760734560000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="qG6-fb-qL0"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="NQ2-Wg-vx6">
<rect key="frame" x="0.0" y="150" />
<color key="backgroundColor" red="0.9981210828" green="0.7443595529" blue="0.3907994628" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="gYm-9M-VUm"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Y11-gj-s20">
<rect key="frame" x="0.0" y="300" />
<color key="backgroundColor" red="0.99805814029999995" green="0.40440851449999998" blue="0.31141346689999999" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="qvn-Nt-dCb"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="8iH-mi-wRX">
<rect key="frame" x="0.0" y="450" />
<color key="backgroundColor" red="0.99912148710000004" green="0.17214331029999999" blue="0.38572910430000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="150" id="ZF1-YH-sre"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="983-cl-csE">
<rect key="frame" x="0.0" y="600" />
<color key="backgroundColor" red="0.33141675590000003" green="0.98072248699999998" blue="0.40079861880000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="20" id="LrL-s0-6aa"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Awz-rO-vcs">
<rect key="frame" x="0.0" y="778" />
<color key="backgroundColor" red="1" green="0.2503993511" blue="0.97168940309999996" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="height" constant="40" id="lCa-X5-V4P"/>
</constraints>
</view>
</subviews>
</stackView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstAttribute="bottom" secondItem="eZ0-N0-ecD" secondAttribute="bottom" id="Mqb-fG-5zQ"/>
<constraint firstAttribute="trailing" secondItem="eZ0-N0-ecD" secondAttribute="trailing" id="RBn-5m-9po"/>
<constraint firstItem="eZ0-N0-ecD" firstAttribute="leading" secondItem="ygo-gK-BzW" secondAttribute="leading" id="dpF-aq-8uV"/>
<constraint firstItem="eZ0-N0-ecD" firstAttribute="top" secondItem="ygo-gK-BzW" secondAttribute="top" id="uye-i9-kBk"/>
</constraints>
</view>
</subviews>
<color key="backgroundColor" red="0.0" green="0.47843137250000001" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstItem="ygo-gK-BzW" firstAttribute="height" secondItem="8Lg-op-1W1" secondAttribute="height" priority="750" id="34X-Z2-gJg"/>
<constraint firstItem="ygo-gK-BzW" firstAttribute="top" secondItem="8Lg-op-1W1" secondAttribute="top" id="34X-Z4-WAK"/>
<constraint firstAttribute="bottom" secondItem="ygo-gK-BzW" secondAttribute="bottom" id="Me7-yt-8gX"/>
<constraint firstItem="ygo-gK-BzW" firstAttribute="width" secondItem="8Lg-op-1W1" secondAttribute="width" id="XFS-SE-QbM"/>
<constraint firstItem="ygo-gK-BzW" firstAttribute="leading" secondItem="8Lg-op-1W1" secondAttribute="leading" id="mqg-gZ-hEy"/>
<constraint firstAttribute="trailing" secondItem="ygo-gK-BzW" secondAttribute="trailing" id="us5-aT-tnP"/>
</constraints>
</scrollView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstItem="8Lg-op-1W1" firstAttribute="top" secondItem="N1d-br-dMg" secondAttribute="top" id="NHA-1q-iN5"/>
<constraint firstItem="N1d-br-dMg" firstAttribute="trailing" secondItem="8Lg-op-1W1" secondAttribute="trailing" id="TGg-ig-3O1"/>
<constraint firstItem="N1d-br-dMg" firstAttribute="bottom" secondItem="8Lg-op-1W1" secondAttribute="bottom" id="da0-Ux-sH0"/>
<constraint firstItem="8Lg-op-1W1" firstAttribute="leading" secondItem="N1d-br-dMg" secondAttribute="leading" id="e0A-Yr-Bnq"/>
</constraints>
<viewLayoutGuide key="safeArea" id="N1d-br-dMg"/>
</view>
<navigationItem key="navigationItem" id="ZJ5-xB-PxK"/>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="ssf-O0-6hP" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="3361" y="163"/>
</scene>
</scenes>
</document>
【讨论】：
我复制粘贴了您的代码，它可以工作。这简直太不可思议了！我试图解决这个问题超过 3 天半，而你在不到 30 分钟内就完成了。无论如何，回到主题：我看到你应用了>= 20 这是应该解决我问题的“技巧”吗？您是否更改或修改了拥抱优先级或任何其他数据？
拥抱/压缩等没有变化。可能唯一重要的变化是“内容视图”高度约束的>= 20和Priority: 750。以上是关于如何动态调整单个 UIStackView 的行高以填满整个屏幕？的主要内容，如果未能解决你的问题，请参考以下文章