Ios 如何在iPhone上布局三个控件，以便IB和模拟器匹配？

我正在尝试使用Xcode的Interface Builder为iPhone布局一个简单的UI，这样您就可以在顶部有一个文本框和按钮，而在它的正下方有一个表视图来填充剩余的可用空间。将有一个顶部酒吧，我需要考虑到以及。然而，就我的一生而言，我不知道如何布置它，使它在模拟器中看起来很好。我还发现模拟器和IB之间看起来有根本的不同

这是我目前在IB中的内容。请注意，顶部栏是如何保留空间的，文本框和发送按钮位于该栏下方一英寸左右，这两个控件和下面的tableview之间的空间非常小。请注意，顶部栏和文本框之间的巨大间隙仅存在于此，因为任何较小的间隙都会导致模拟器中的顶部栏与文本框重叠

下面是它如何在模拟器中显示的。请注意，文本框和按钮现在直接位于顶部栏的下方，文本框和tableview之间有一个巨大的空白

这是怎么回事？我知道这里可能有一些锚定点、拉伸或任何你称之为锚定点的东西，但我已经尝试了我能想到的每一种组合，它仍然有各种扭曲的效果。然而，我想做的很简单，我确信我只是错过了一些东西

我如何布置这些控件，使它们看起来到处都是

以下是.xib文件的源代码：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="4514" systemVersion="13B42" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none">
    <dependencies>
        <deployment defaultVersion="1792" identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="3747"/>
    </dependencies>
    <objects>
        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner" customClass="DetailViewController">
            <connections>
                <outlet property="btnSend" destination="ZmR-ty-Pna" id="awD-N6-FnH"/>
                <outlet property="conversationHistory" destination="hwz-En-aki" id="bzu-tE-l55"/>
                <outlet property="txtMessage" destination="csI-Yi-U19" id="1fy-Bm-2Tr"/>
                <outlet property="view" destination="1" id="3"/>
            </connections>
        </placeholder>
        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
        <view contentMode="scaleToFill" id="1">
            <rect key="frame" x="0.0" y="64" width="320" height="416"/>
            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
            <subviews>
                <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" id="ZmR-ty-Pna">
                    <rect key="frame" x="254" y="74" width="46" height="30"/>
                    <autoresizingMask key="autoresizingMask" flexibleMinX="YES" flexibleMaxY="YES"/>
                    <state key="normal" title="Send">
                        <color key="titleShadowColor" white="0.5" alpha="1" colorSpace="calibratedWhite"/>
                    </state>
                </button>
                <textField opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" borderStyle="roundedRect" minimumFontSize="17" id="csI-Yi-U19">
                    <rect key="frame" x="20" y="75" width="226" height="30"/>
                    <autoresizingMask key="autoresizingMask" widthSizable="YES" flexibleMaxX="YES" flexibleMaxY="YES"/>
                    <fontDescription key="fontDescription" type="system" pointSize="14"/>
                    <textInputTraits key="textInputTraits"/>
                </textField>
                <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" style="plain" separatorStyle="default" rowHeight="44" sectionHeaderHeight="22" sectionFooterHeight="22" id="hwz-En-aki">
                    <rect key="frame" x="0.0" y="113" width="320" height="303"/>
                    <autoresizingMask key="autoresizingMask" flexibleMinX="YES" flexibleMaxX="YES" flexibleMinY="YES"/>
                    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                </tableView>
            </subviews>
            <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
            <simulatedStatusBarMetrics key="simulatedStatusBarMetrics"/>
            <simulatedNavigationBarMetrics key="simulatedTopBarMetrics" translucent="NO" prompted="NO"/>
            <simulatedScreenMetrics key="simulatedDestinationMetrics"/>
        </view>
    </objects>
</document>

---

看起来您有一个半透明的导航控制器，但Interface Builder中的模拟指标设置不匹配。这是一个普遍的问题

尝试转到Interface Builder，找到有问题的视图控制器，转到Attributes inspector并将模拟指标、顶栏设置为“半透明导航栏”

模拟指标实际上不会改变应用程序的显示方式，但会改变Interface Builder中的“外观”，让您更好地了解运行时布局的显示方式

另一个选项是将导航控制器设置为半透明=否