ios - 我应该如何从界面生成器正确设置 'Follow Readable Width'?

标签 ios xcode autolayout uilabel interface-builder

这只是我用来测试一些自动布局内容的示例项目。

我使用“跟随可读宽度”,但标签仍然一直延伸到边缘。我尝试了多种变体,但没有任何效果……

当我从 viewDebugger 中检查它时,我没有看到设置可读宽度的痕迹。

有人知道我做错了什么吗?

enter image description here

编辑:

根据提供的答案遵循说明。我做了以下事情:

  • 在 super View 上设置“遵循可读宽度”
  • 设置标签与其父 View 的边距之间的约束
  • 将我的标签的行数设置为 0

enter image description here

但是还是不行。

最佳答案

苹果关于这方面的文档也许有些缺乏......

遵循可读宽度使用 readableContentGuide确定“舒适的可读宽度”(我确信,基于大量研究)。

但是,由于可能并不完全直观,它适用于 View 的 subview ——而不是 View 本身。

所以,看看这个例子。两个普通 View Controller ,每个 Controller 都有一个标准的 UILabel。行数:0,系统字体为22.0。

请注意,它们受限于 super View 的边距(顶部:80,前导:0,尾随:0)——安全区!

唯一的区别是右侧 VC 的(根) View 选中了遵循可读宽度(True)。

enter image description here

每个标签的框架(使用 iPhone 12 Pro Max)为 388 x 144

如果我们将它们旋转到横向(并移动下面的右侧 VC):

enter image description here

我们可以看到标签有不同的框架:

  • 非跟随可读宽度:806 x 105.33
  • 遵循可读宽度:664 x 131.33

并且,澄清正在设置的内容:

enter image description here

这是另一个例子...

  • 标签嵌入 GreenView 中
  • GreenView 被限制在(根) View 安全区域(顶部:80,前导:0,尾随:0)
  • 标签仅限于 GreenView 的边距 - 所有四个边均为零

VC 都没有在(根) View 上检查跟随可读宽度

右侧/底部 VC 中的 GreenView 确实选中了跟随可读宽度(True):

enter image description here

enter image description here


编辑 - 这是用于检查的 Storyboard源(包括两个示例):

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17701" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
    <device id="retina6_7" orientation="portrait" appearance="light"/>
    <dependencies>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17703"/>
        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
        <capability name="System colors in document resources" minToolsVersion="11.0"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <scenes>
        <!--NonReadableWidth-->
        <scene sceneID="lu6-SQ-BUQ">
            <objects>
                <viewController title="NonReadableWidth" id="gRl-Y3-q5b" sceneMemberID="viewController">
                    <view key="view" contentMode="scaleToFill" id="KgH-rz-3jW">
                        <rect key="frame" x="0.0" y="0.0" width="428" height="926"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="i34-a2-9TU" userLabel="TestLabel">
                                <rect key="frame" x="20" y="124" width="388" height="184"/>
                                <color key="backgroundColor" red="0.45138680930000002" green="0.99309605359999997" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                <string key="text">A label can contain an arbitrary amount of text, but UILabel may shrink, wrap, or truncate the text, depending on the size of the bounding rectangle and properties you set. You can control the font, text color, alignment, highlighting, and shadowing of the text in the label.</string>
                                <fontDescription key="fontDescription" type="system" pointSize="22"/>
                                <nil key="textColor"/>
                                <nil key="highlightedColor"/>
                            </label>
                        </subviews>
                        <viewLayoutGuide key="safeArea" id="emo-4y-MRr"/>
                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                        <constraints>
                            <constraint firstAttribute="trailingMargin" secondItem="i34-a2-9TU" secondAttribute="trailing" id="0gf-bk-gRh"/>
                            <constraint firstItem="i34-a2-9TU" firstAttribute="top" secondItem="KgH-rz-3jW" secondAttribute="topMargin" constant="80" id="XTe-xu-XW0"/>
                            <constraint firstItem="i34-a2-9TU" firstAttribute="leading" secondItem="KgH-rz-3jW" secondAttribute="leadingMargin" id="cLh-qf-Blk"/>
                        </constraints>
                    </view>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="yRa-z0-zb1" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
            </objects>
            <point key="canvasLocation" x="-1440" y="-237"/>
        </scene>
        <!--ReadableWidth-->
        <scene sceneID="TAR-hp-Z7a">
            <objects>
                <viewController title="ReadableWidth" id="NWi-IO-XoQ" sceneMemberID="viewController">
                    <view key="view" contentMode="scaleToFill" layoutMarginsFollowReadableWidth="YES" id="kow-Rb-hSd">
                        <rect key="frame" x="0.0" y="0.0" width="428" height="926"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="vcL-Mg-4cn" userLabel="TestLabel">
                                <rect key="frame" x="20" y="124" width="388" height="184"/>
                                <color key="backgroundColor" red="0.45138680930000002" green="0.99309605359999997" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                <string key="text">A label can contain an arbitrary amount of text, but UILabel may shrink, wrap, or truncate the text, depending on the size of the bounding rectangle and properties you set. You can control the font, text color, alignment, highlighting, and shadowing of the text in the label.</string>
                                <fontDescription key="fontDescription" type="system" pointSize="22"/>
                                <nil key="textColor"/>
                                <nil key="highlightedColor"/>
                            </label>
                        </subviews>
                        <viewLayoutGuide key="safeArea" id="S18-p2-v7t"/>
                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                        <constraints>
                            <constraint firstItem="vcL-Mg-4cn" firstAttribute="top" secondItem="kow-Rb-hSd" secondAttribute="topMargin" constant="80" id="UMj-EB-aOr"/>
                            <constraint firstAttribute="trailingMargin" secondItem="vcL-Mg-4cn" secondAttribute="trailing" id="abZ-c7-vbB"/>
                            <constraint firstItem="vcL-Mg-4cn" firstAttribute="leading" secondItem="kow-Rb-hSd" secondAttribute="leadingMargin" id="mWF-6m-rMe"/>
                        </constraints>
                    </view>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="hUJ-qH-o5E" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
            </objects>
            <point key="canvasLocation" x="-763" y="-237"/>
        </scene>
        <!--NonRWSubview-->
        <scene sceneID="WVm-0d-Od7">
            <objects>
                <viewController title="NonRWSubview" id="6R3-mW-Koq" sceneMemberID="viewController">
                    <view key="view" contentMode="scaleToFill" id="Liz-uX-God">
                        <rect key="frame" x="0.0" y="0.0" width="428" height="926"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="sXo-q5-J4x">
                                <rect key="frame" x="0.0" y="124" width="428" height="200"/>
                                <subviews>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="0s4-WT-JDV" userLabel="TestLabel">
                                        <rect key="frame" x="8" y="8" width="412" height="184"/>
                                        <color key="backgroundColor" red="0.45138680930000002" green="0.99309605359999997" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <string key="text">A label can contain an arbitrary amount of text, but UILabel may shrink, wrap, or truncate the text, depending on the size of the bounding rectangle and properties you set. You can control the font, text color, alignment, highlighting, and shadowing of the text in the label.</string>
                                        <fontDescription key="fontDescription" type="system" pointSize="22"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                </subviews>
                                <color key="backgroundColor" systemColor="systemGreenColor"/>
                                <constraints>
                                    <constraint firstAttribute="bottomMargin" secondItem="0s4-WT-JDV" secondAttribute="bottom" id="7h2-iB-UEo"/>
                                    <constraint firstItem="0s4-WT-JDV" firstAttribute="leading" secondItem="sXo-q5-J4x" secondAttribute="leadingMargin" id="TGM-zO-ZYC"/>
                                    <constraint firstAttribute="trailingMargin" secondItem="0s4-WT-JDV" secondAttribute="trailing" id="jF5-JY-Ci4"/>
                                    <constraint firstItem="0s4-WT-JDV" firstAttribute="top" secondItem="sXo-q5-J4x" secondAttribute="topMargin" id="qol-3c-qpg"/>
                                </constraints>
                            </view>
                        </subviews>
                        <viewLayoutGuide key="safeArea" id="5qA-FN-o9s"/>
                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                        <constraints>
                            <constraint firstItem="5qA-FN-o9s" firstAttribute="trailing" secondItem="sXo-q5-J4x" secondAttribute="trailing" id="8FD-5n-0JT"/>
                            <constraint firstItem="sXo-q5-J4x" firstAttribute="leading" secondItem="5qA-FN-o9s" secondAttribute="leading" id="NOW-Zj-cj5"/>
                            <constraint firstItem="sXo-q5-J4x" firstAttribute="top" secondItem="5qA-FN-o9s" secondAttribute="top" constant="80" id="r8c-cG-kir"/>
                        </constraints>
                    </view>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="cCS-co-iqT" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
            </objects>
            <point key="canvasLocation" x="282" y="-237"/>
        </scene>
        <!--RWSubview-->
        <scene sceneID="74o-tj-jGs">
            <objects>
                <viewController title="RWSubview" id="UlY-lL-nBK" sceneMemberID="viewController">
                    <view key="view" contentMode="scaleToFill" id="jzc-UN-DU3">
                        <rect key="frame" x="0.0" y="0.0" width="428" height="926"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <view contentMode="scaleToFill" layoutMarginsFollowReadableWidth="YES" translatesAutoresizingMaskIntoConstraints="NO" id="l3Q-Yv-r11">
                                <rect key="frame" x="0.0" y="124" width="428" height="200"/>
                                <subviews>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="0vx-Wy-qHn" userLabel="TestLabel">
                                        <rect key="frame" x="8" y="8" width="412" height="184"/>
                                        <color key="backgroundColor" red="0.45138680930000002" green="0.99309605359999997" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <string key="text">A label can contain an arbitrary amount of text, but UILabel may shrink, wrap, or truncate the text, depending on the size of the bounding rectangle and properties you set. You can control the font, text color, alignment, highlighting, and shadowing of the text in the label.</string>
                                        <fontDescription key="fontDescription" type="system" pointSize="22"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                </subviews>
                                <color key="backgroundColor" systemColor="systemGreenColor"/>
                                <constraints>
                                    <constraint firstAttribute="trailingMargin" secondItem="0vx-Wy-qHn" secondAttribute="trailing" id="CrF-ue-Xql"/>
                                    <constraint firstItem="0vx-Wy-qHn" firstAttribute="top" secondItem="l3Q-Yv-r11" secondAttribute="topMargin" id="TuR-Zy-RMp"/>
                                    <constraint firstAttribute="bottomMargin" secondItem="0vx-Wy-qHn" secondAttribute="bottom" id="qPz-fc-ru5"/>
                                    <constraint firstItem="0vx-Wy-qHn" firstAttribute="leading" secondItem="l3Q-Yv-r11" secondAttribute="leadingMargin" id="uSi-gN-Z2k"/>
                                </constraints>
                            </view>
                        </subviews>
                        <viewLayoutGuide key="safeArea" id="3pL-pi-ttG"/>
                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                        <constraints>
                            <constraint firstItem="l3Q-Yv-r11" firstAttribute="leading" secondItem="3pL-pi-ttG" secondAttribute="leading" id="0XL-rC-Vvb"/>
                            <constraint firstItem="3pL-pi-ttG" firstAttribute="trailing" secondItem="l3Q-Yv-r11" secondAttribute="trailing" id="0x6-gc-xNv"/>
                            <constraint firstItem="l3Q-Yv-r11" firstAttribute="top" secondItem="3pL-pi-ttG" secondAttribute="top" constant="80" id="r0G-V7-Yya"/>
                        </constraints>
                    </view>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="yWI-Io-PLo" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
            </objects>
            <point key="canvasLocation" x="950" y="-237"/>
        </scene>
    </scenes>
    <resources>
        <systemColor name="systemBackgroundColor">
            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
        </systemColor>
        <systemColor name="systemGreenColor">
            <color red="0.20392156862745098" green="0.7803921568627451" blue="0.34901960784313724" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
        </systemColor>
    </resources>
</document>

编辑2

我在这里放置了一个示例项目:https://github.com/DonMag/FollowReadableWidth

但请注意,我发现这相当奇怪(也许有问题)。请参阅示例中的注释。

关于ios - 我应该如何从界面生成器正确设置 'Follow Readable Width'?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68546906/

相关文章:

ios - SoundCloud 表示声音可以流式传输,但无法在 iOS 或 OS X 上播放

ios - 更改 UIAlertView 中按钮的辅助功能标签 - iOS

swift - 安装 XLForm 后找不到 -lFirebase 的库

ios - Xcode 7 垂直 ScrollView 问题

ios - 尝试设置 UIButton 的约束时出错

ios - 如何在 iOS 中设置 View 的最大宽度?

ios - View Controller 在 Segue 后消失

ios - 在Swift中的 View Controller 之间传递数据(从TableView到DetailViewController)

ios - 克隆时 cocoa pod 卡住

ios - 同步身份验证 SwiftUI