Question

我正在尝试在图形上添加7个x轴值。我正在尝试使用其中具有7个标签的水平stackview进行此操作，然后以编程方式设置每个标签（子视图）的内容。

但是我无法让这些标签停留在正确的位置。根据值的不同，某些标签有时会更宽，有时会更窄，间距似乎会发生变化，等等。（似乎将“分布”设置为“均等填充”会均匀地隔开它们，但是它们的宽度太窄了，仅显示小数点和数字紧靠其左侧。）

每个值（标签或文本字段）是一个小数点后加2到5个数字的数字（例如1.0、3.45、678.92）。

每个子视图无论其内容如何都应保持相同的宽度，并保持在其相应网格线下方的正确居中位置，并且每个子视图之间的间距应最小。

例如，是否有一种方法可以确保每个标签的宽度恒定为45，并且每个标签之间的间距为2，而不管标签的内容是1.1还是2345.9？

（而且，由于我是Swift的新手，是否有任何理由使用标签而不是文本字段？）

谢谢。

Answer 1

我尝试重新创建您的情况，但是一切正常。所以你尝试我的步骤：

根据您的内容（例如1.09、1.12345等）垂直创建7个标签
将它们嵌入堆栈视图
确保堆栈视图属性为：“垂直轴”，“对齐和分布”为“填充”，间距为2（根据您的选择）
最后，将宽度约束添加到45（根据您的选择），垂直和水平约束

希望它可以帮助：）

Answer 2

如果希望标签的宽度恒定为45，间距为2 ...，则有7个标签+ 6个“空格”：

(7 * 45) + (6 * 2) = 327

因此，如果为水平堆栈视图提供327的“宽度”约束并将“分布”设置为Fill Equally，则将获得所需的结果：

您可能已经注意到，要将诸如示例678.92之类的值放入宽度为45的标签中，您需要使用非常小的字体（我使用的是System 12）。

这是情节提要，所以您可以自己看看：

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14109" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
    <device id="retina4_7" orientation="portrait">
        <adaptation id="fullscreen"/>
    </device>
    <dependencies>
        <deployment identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14088"/>
        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <scenes>
        <!--View Controller-->
        <scene sceneID="NQ7-zI-PK9">
            <objects>
                <viewController id="CCM-nn-BIf" sceneMemberID="viewController">
                    <view key="view" contentMode="scaleToFill" id="C1V-ar-DQI">
                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                        <subviews>
                            <stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" alignment="top" spacing="2" translatesAutoresizingMaskIntoConstraints="NO" id="vuE-Tw-FZh">
                                <rect key="frame" x="24" y="327" width="327" height="14.5"/>
                                <subviews>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="1" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Pyl-0P-Y2W">
                                        <rect key="frame" x="0.0" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="2.4" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="we3-YL-c5s">
                                        <rect key="frame" x="47" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="3.8" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Aj1-ad-r0E">
                                        <rect key="frame" x="94" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="8.75" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="qnr-KX-c2b">
                                        <rect key="frame" x="141" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="10.3" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="hiY-qQ-iUG">
                                        <rect key="frame" x="188" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="22.44" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="oUW-RY-903">
                                        <rect key="frame" x="235" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="678.92" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Wa7-Qj-2h9">
                                        <rect key="frame" x="282" y="0.0" width="45" height="14.5"/>
                                        <color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                        <fontDescription key="fontDescription" type="system" pointSize="12"/>
                                        <nil key="textColor"/>
                                        <nil key="highlightedColor"/>
                                    </label>
                                </subviews>
                                <constraints>
                                    <constraint firstAttribute="width" constant="327" id="DsZ-ie-6Cr"/>
                                </constraints>
                            </stackView>
                        </subviews>
                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
                        <constraints>
                            <constraint firstItem="vuE-Tw-FZh" firstAttribute="centerY" secondItem="C1V-ar-DQI" secondAttribute="centerY" id="Xea-Fp-KaS"/>
                            <constraint firstItem="vuE-Tw-FZh" firstAttribute="centerX" secondItem="C1V-ar-DQI" secondAttribute="centerX" id="hTu-m6-hK6"/>
                        </constraints>
                        <viewLayoutGuide key="safeArea" id="ktE-hH-kAz"/>
                    </view>
                </viewController>
                <placeholder placeholderIdentifier="IBFirstResponder" id="ulR-Rg-tMI" userLabel="First Responder" sceneMemberID="firstResponder"/>
            </objects>
            <point key="canvasLocation" x="41" y="16"/>
        </scene>
    </scenes>
</document>

编辑：

另一种选择：给一个标签的宽度约束设置为45，设置堆栈视图Distribution: Fill Equally / Spacing: 2，但不要限制堆栈视图的宽度。

StackView子视图的恒定宽度

2 个答案: