Xcode 6 中 UITableView 中的自动调整大小问题答案

【问题标题】：Auto resizing issue in UITableView in Xcode 6Xcode 6 中 UITableView 中的自动调整大小问题
【发布时间】：2014-12-01 12:57:48
【问题描述】：

我在 UITableview 的 xcode 6 中使用自动调整大小，但它无法正常工作。我想使用自动调整大小。我在情节提要的 UITableviewController 类的静态单元格中添加了文本字段。横向或纵向屏幕之外的文本字段。我不想使用自动布局，我的整个项目都在自动调整大小。

Demo Project

【问题讨论】：

标签： uitableview ios7 storyboard xcode6 autoresizingmask

【解决方案1】：

在搞砸了几个小时后，我只是在 cellForRowAtIndexPath 中手动设置了框架...

在我的情况下，我的标签应该总是距离单元格的右边缘 8 点......我会运行它并且标签会消失。所以在cellForRowAtIndexPath，我加了一点“hack”来修复框架……

if (cell.weight.frame.origin.x != cell.frame.size.width - 138) {
    CGRect frame = cell.weight.frame;
    frame.origin.x = cell.frame.size.width - 138;
    cell.weight.frame = frame;
}

在这种情况下，138 是我的标签宽度 (131) 加上我想要的单元格右侧的填充 (7)...

它并不完全漂亮，但它对我有用！

【讨论】：

【解决方案2】：

我最近遇到了同样的问题。我在 UITableViewCell 的内容视图中添加了一个标签，并且每次它隐藏时 (x >> 320)。我意识到问题出在源代码 XML 中。

XML 是：

<tableViewCell contentMode="scaleToFill" selectionStyle="default" indentationWidth="10" reuseIdentifier="InvoiceCell" rowHeight="60" id="B9T-xx-TCx" customClass="InvoiceCell"> 
    // My custom cell is 60 height
    <rect key="frame" x="0.0" y="0.0" width="320" height="44"/> 
    // Wrong Autoresizing
    <autoresizingMask key="autoresizingMask"/> 
    <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="B9T-xx-TCx" id="nvL-MG-mGs">
        //No rect frame and wrong autoresizing mask
        <autoresizingMask key="autoresizingMask"/>

解决我的问题只需将“tableViewCell”和“tableViewCellContentView”更改为：

<tableViewCell contentMode="scaleToFill" selectionStyle="default" indentationWidth="10" reuseIdentifier="InvoiceCell" rowHeight="60" id="B9T-xx-TCx" customClass="InvoiceCell"> 
    //Add/change this 2 lines in <tableViewCell>
    <rect key="frame" x="0.0" y="0.0" width="320" height="60"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES"/>

和

<tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="B9T-xx-TCx" id="nvL-MG-mGs">
    //Add/change this 2 lines in <tableViewCellContentView>
    <rect key="frame" x="0.0" y="0.0" width="320" height="60"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES"/>

所以，问题解决了！希望对大家有所帮助。

【讨论】：

很高兴它能帮到你。

【解决方案3】：

这是 Xcode 6 .xib 和 .storyboard 处理问题。很快，Xcode 为表格视图单元格及其contentView 设置了不正确的框架。让我更深入地解释一下。

自动调整蒙版的工作原理

基本上，它将视图frame 绑定到其父视图的frame。我们可以指定哪些边距和尺寸是灵活的，哪些是固定的。当 superview 改变它的边界时，我们的视图边界也会根据我们的 autoresize 规范而改变。这不仅发生在运行时，也发生在 Xcode Interface Builder 中。尝试使用子视图制作一些视图，为子视图设置不同的自动调整大小选项并调整主视图的大小。您会看到子视图在 Xcode 中已正确调整大小。方便吧？

错误来源

在将表格视图单元格从 iPhone 故事板复制到 iPad 故事板后，我首先发现了完全相同的问题。在深入研究 .storyboard 文件后，我发现单元格及其contentView 在 .storyboard 中仍然有 320x91 的帧（而不是 iPad 的 768x91 尺寸），而在屏幕和检查器中，它的尺寸都是正确的。实际序列化数据与视觉表现不一致。

<tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="prototypes" style="plain" separatorStyle="default" rowHeight="91" sectionHeaderHeight="22" sectionFooterHeight="22" id="nKc-Lp-03y">
    <rect key="frame" x="0.0" y="58" width="768" height="901"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
    <prototypes>
        <tableViewCell contentMode="scaleToFill" selectionStyle="blue" accessoryType="disclosureIndicator" hidesAccessoryWhenEditing="NO" indentationLevel="1" indentationWidth="0.0" reuseIdentifier="PriceEvaluateCell" rowHeight="91" id="cis-7J-9wV" customClass="PriceEvaluateCell">
            <rect key="frame" x="0.0" y="434" width="320" height="91"/>
            <!-- note how small frame is! But it is drawn with iPad width -->
            <autoresizingMask key="autoresizingMask"/>
            <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="cis-7J-9wV" id="cYU-lI-DGN">
                <rect key="frame" x="0.0" y="0.0" width="320" height="90"/>
                <!-- here is same issue -->
                <autoresizingMask key="autoresizingMask"/>
                <subviews>
                    <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="TItle" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" id="AOE-zL-Dv0">
                        <rect key="frame" x="9" y="3" width="305" height="21"/>
                        <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                        <!-- this view draws OK, it has small size, left alignment and flexible right margin -->
                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
                        <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
                        <color key="highlightedColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                    </label>
                    <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" text="FGPrice" textAlignment="right" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" id="wPa-dC-JzV">
                        <rect key="frame" x="623" y="20" width="104" height="21"/>
                        <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                        <!-- this is bad view, it has flexible LEFT and will misplace every time you open the file -->
                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
                        <color key="textColor" red="0.40000000600000002" green="1" blue="0.40000000600000002" alpha="1" colorSpace="calibratedRGB"/>
                        <color key="highlightedColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                    </label>
                </subviews>
            </tableViewCellContentView>
            <connections>
                <!-- ... -->
            </connections>
        </tableViewCell>
    </prototypes>
    <connections>
        <!-- ... -->
    </connections>
</tableView>

所以，当我根据 iPad 尺寸（例如 x="624" y="19" width="80" height="21"）和灵活的左边距设置单元格子视图 frame 时。它在内部超出了单元格的范围，而在视觉上仍然显示正确设置。当情节提要保存然后从文件中重新加载时，单元格及其contentView 会自动从 320x91 调整为 768x91，并且由于其自动调整大小，该子视图会自动调整到最右边。

现在让我们看看你的情况。您拥有宽度灵活的文本字段。每次打开项目，它的框架都会越来越宽。看起来存储宽度和视觉宽度之间存在相同的不一致。打开项目的 .storyboard 后，我们可以看到表格视图单元格及其contentView 根本没有指定任何frame！所以我们可以说，在您的情况下，Xcode 为您的单元格及其contentView 隐式设置了一些非常小的框架。

里面是这样的。

<tableView key="view" clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="static" style="plain" separatorStyle="default" rowHeight="246" sectionHeaderHeight="22" sectionFooterHeight="22" id="zuY-va-uVD">
    <rect key="frame" x="0.0" y="0.0" width="320" height="568"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
    <sections>
        <tableViewSection id="KFU-cy-GoW">
            <cells>
                <tableViewCell contentMode="scaleToFill" selectionStyle="default" indentationWidth="10" rowHeight="245" id="WCc-Ec-YKn">
                <!-- note there is no frame at all -->
                    <autoresizingMask key="autoresizingMask"/>
                    <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="WCc-Ec-YKn" id="DtD-vs-Xwy">
                        <!-- and here too -->
                        <autoresizingMask key="autoresizingMask"/>
                        <subviews>
                            <textField opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" text="autorsizing" borderStyle="roundedRect" minimumFontSize="17" id="NCA-qk-Isa">
                                <!-- and here frame is already went wrong... -->
                                <rect key="frame" x="60" y="108" width="900" height="30"/>
                                <autoresizingMask key="autoresizingMask" widthSizable="YES" flexibleMaxY="YES"/>
                                <color key="backgroundColor" red="0.89019607840000003" green="0.89019607840000003" blue="0.89019607840000003" alpha="1" colorSpace="calibratedRGB"/>
                                <fontDescription key="fontDescription" type="system" pointSize="14"/>
                                <textInputTraits key="textInputTraits"/>
                            </textField>
                        </subviews>
                    </tableViewCellContentView>
                </tableViewCell>
            </cells>
        </tableViewSection>
    </sections>
    <connections>
        <outlet property="dataSource" destination="1kU-E8-zzp" id="pca-5d-SRg"/>
        <outlet property="delegate" destination="1kU-E8-zzp" id="WxC-Qa-ToS"/>
    </connections>
</tableView>

如何解决

目前还没有找到最终解决方案，但我们可以解决该错误。如果 Xcode 本身不能设置合适的帧，我们可以手动设置。使用任何文本编辑器（纯 XML）打开情节提要并修复框架：

<tableView key="view" clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="static" style="plain" separatorStyle="default" rowHeight="246" sectionHeaderHeight="22" sectionFooterHeight="22" id="zuY-va-uVD">
    <rect key="frame" x="0.0" y="0.0" width="320" height="568"/>
    <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
    <sections>
        <tableViewSection id="KFU-cy-GoW">
            <cells>
                <tableViewCell contentMode="scaleToFill" selectionStyle="default" indentationWidth="10" rowHeight="245" id="WCc-Ec-YKn">
                    <autoresizingMask key="autoresizingMask"/>
                    <!-- we insert the correct frame (exact size we can get from xcode editor, which draws it properly) -->
                    <rect key="frame" x="0.0" y="0.0" width="320" height="245"/>
                    <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="WCc-Ec-YKn" id="DtD-vs-Xwy">
                        <!-- and here we do the same -->
                        <rect key="frame" x="0.0" y="0.0" width="320" height="244"/>
                        <autoresizingMask key="autoresizingMask"/>
                        <subviews>
                            <textField opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" text="autorsizing" borderStyle="roundedRect" minimumFontSize="17" id="NCA-qk-Isa">
                                <!-- set any size that is smaller than parent frame. You will be able to change it with Xcode later -->
                                <rect key="frame" x="60" y="108" width="200" height="30"/>
                                <autoresizingMask key="autoresizingMask" widthSizable="YES" flexibleMaxY="YES"/>
                                <color key="backgroundColor" red="0.89019607840000003" green="0.89019607840000003" blue="0.89019607840000003" alpha="1" colorSpace="calibratedRGB"/>
                                <fontDescription key="fontDescription" type="system" pointSize="14"/>
                                <textInputTraits key="textInputTraits"/>
                            </textField>
                        </subviews>
                    </tableViewCellContentView>
                </tableViewCell>
            </cells>
        </tableViewSection>
    </sections>
    <connections>
        <outlet property="dataSource" destination="1kU-E8-zzp" id="pca-5d-SRg"/>
        <outlet property="delegate" destination="1kU-E8-zzp" id="WxC-Qa-ToS"/>
    </connections>
</tableView>

然后关闭 Xcode，从编辑器中保存情节提要，然后重新打开 Xcode。瞧！文本字段离开了它的疯狂方式，现在按预期运行。

【讨论】：

真是一个很好的解释。谢谢，你节省了我很多工作时间。 @Vivek Yadav 必须将其作为正确答案。
如果您使用一个可调整大小的场景，@VivekYadav 应该适用于两者。
我检查过了，但不适用于两个方向，请检查一下
刚刚检查了您的演示项目和我的工作项目。方向变化处理得很好......你能分享更多关于方向错误的信息吗？并且请重新检查自动调整蒙版，修复后可能会出错
因为这个问题，我开始使用自动布局，它工作正常。