iOS Auto layout: Table View Cell width = 0

Question

I'm using Xcode 6.0.1 and for the first time I'm using auto layout on a Table View with Static Cells .

I have a Text Field in the first table cell. This has a fixed height, but I want the width of the Text Field to scale with the width of the table (or the table cell, since these are the same width). This is because I want to take advantage of the extra width of the iPhone 6 and 6 Plus.

I have added a height constraint (40 pixels), and leading and trailing space constraints (14 pixels) to the Text Field . I've also centered the Y alignment to the superview. None of these are Relative to margin since I want to target iOS 7 and I believe this option causes problems with that.

My problem is that the width of the table cell wants to go to zero, and this is causing the width of my text field to go to zero as well, because of the leading and trailing space constraints. If I set a fixed width for my Text Field then everything is fine, but then it doesn't take advantage of the extra width available on an iPhone 6. My table and the table cells are scaling fine when I actually run the app, although they are showing as "misplaced" in Xcode which thinks the height and width should be zero (see screenshot below).

I've Googled this no end and I can't find anyone else who has had these issues. Scaling to the height of a table cell is a common issue, but not the width.

Here is my view hierarchy with the constrains on the Text Field (called Title ) showing....

And this is where I think the problem is, since the Expected height and width of the Table View Cell are both zero...

I've tried setting constraints on the Table View Cell etc to try and give it a non-zero width but this doesn't seem possible.

---

Here is the first 40 lines or so of my .storyboard file. I haven't fiddled with the XML, it's straight from Xcode.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="6245" systemVersion="14A379a" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" initialViewController="3">
    <dependencies>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="6238"/>
        <capability name="Constraints to layout margins" minToolsVersion="6.0"/>
    </dependencies>
    <scenes>
        <!--Dev Note Edit Screen-->
        <scene sceneID="2">
            <objects>
                <tableViewController storyboardIdentifier="DevNoteEditScreen" id="3" customClass="DevNoteEditScreen" sceneMemberID="viewController">
                    <tableView key="view" opaque="NO" clipsSubviews="YES" clearsContextBeforeDrawing="NO" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="static" style="grouped" separatorStyle="default" rowHeight="44" sectionHeaderHeight="11" sectionFooterHeight="11" id="4">
                        <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="13">
                                <cells>
                                    <tableViewCell contentMode="scaleToFill" misplaced="YES" selectionStyle="blue" hidesAccessoryWhenEditing="NO" indentationLevel="1" indentationWidth="0.0" translatesAutoresizingMaskIntoConstraints="NO" id="11">
                                        <rect key="frame" x="0.0" y="134" width="375" height="44"/>
                                        <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" tableViewCell="11" id="12">
                                            <rect key="frame" x="0.0" y="0.0" width="375" height="43.5"/>
                                            <autoresizingMask key="autoresizingMask"/>
                                            <subviews>
                                                <textField opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" contentHorizontalAlignment="left" contentVerticalAlignment="center" text="Title" placeholder="Title" minimumFontSize="17" translatesAutoresizingMaskIntoConstraints="NO" id="18">
                                                    <constraints>
                                                        <constraint firstAttribute="height" constant="40" id="kkF-JV-vbs"/>
                                                    </constraints>
                                                    <color key="textColor" red="0.16078431372549021" green="0.50196078431372548" blue="0.72549019607843135" alpha="1" colorSpace="calibratedRGB"/>
                                                    <fontDescription key="fontDescription" name="AvenirNext-DemiBold" family="Avenir Next" pointSize="19"/>
                                                    <textInputTraits key="textInputTraits" autocapitalizationType="sentences"/>
                                                    <connections>
                                                        <action selector="EditBegin:" destination="3" eventType="editingDidBegin" id="106"/>
                                                        <action selector="txtTitle_Changed:" destination="3" eventType="editingChanged" id="255"/>
                                                    </connections>
                                                </textField>
                                            </subviews>
                                            <constraints>
                                                <constraint firstAttribute="trailing" secondItem="18" secondAttribute="trailing" constant="14" id="08w-eu-Siz"/>
                                                <constraint firstItem="18" firstAttribute="leading" secondItem="12" secondAttribute="leading" constant="14" id="ImE-vD-cJD"/>
                                                <constraint firstAttribute="centerY" secondItem="18" secondAttribute="centerY" id="hA5-l7-zX6"/>
                                            </constraints>
                                        </tableViewCellContentView>
                                    </tableViewCell>

Answer 1

Weirdly I managed to fix this by editing the .storyboard file XML and removing the following from the <tableViewCell> element...

misplaced="YES"
translatesAutoresizingMaskIntoConstraints="NO"

And adding this inside the <tableViewCell> element...

<autoresizingMask key="autoresizingMask"/>

It seems that my storyboard file became messed up somehow.