Xcode 6 Adding tableHeaderView in IB

Question

In Xcode 5 I was able to drag a UIView into a UITableView in IB to create the header. However in Xcode 6, IB won't let me drop one inside. Is there no way to create the table header in IB anymore?

Answer 1

You just drag a UIView to the top of the table (above the "Prototype cells" text) and hold it there. The drop indicator changes to a single horizontal line with a small circle at either end. When you drop it, it makes a header.

You can do similar at the bottom to make a footer.

For a table view controller in a storyboard:

For a table view in a xib:

Answer 2

Right click the XIB file and select 'Open As' , select Source Code

Look for the tableview XML Element and replace with the following

  <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" showsHorizontalScrollIndicator="NO" showsVerticalScrollIndicator="NO" style="plain" separatorStyle="none" rowHeight="44" sectionHeaderHeight="22" sectionFooterHeight="22" id="YCz-1P-cVv">
                <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"/>
                <view key="tableHeaderView" contentMode="scaleToFill" id="vv3-pk-N2N">
                    <rect key="frame" x="0.0" y="0.0" width="320" height="156"/>
                    <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                    <subviews>
                        <imageView userInteractionEnabled="NO" contentMode="scaleToFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" id="yho-bJ-IzF">
                            <rect key="frame" x="0.0" y="25" width="320" height="44"/>
                            <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                        </imageView>
                    </subviews>
                    <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
                </view>
            </tableView>

Save and open the XIB with the Interface Builder XIB Document.

Answer 3

i think you should add table header and footer view by source code. first right click on IB and open as source code, then put below code

<tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" style="plain" separatorStyle="none" rowHeight="44" sectionHeaderHeight="28" sectionFooterHeight="28" translatesAutoresizingMaskIntoConstraints="NO" id="MZF-la-Fpw">
                <rect key="frame" x="0.0" y="0.0" width="320" height="568"/>
                <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                <view key="tableHeaderView" contentMode="scaleToFill" id="IDM-OR-d2g">
                    <rect key="frame" x="0.0" y="0.0" width="320" height="40"/>
                    <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                </view>
                <view key="tableFooterView" contentMode="scaleToFill" id="Q4z-o4-2rB">
                    <rect key="frame" x="0.0" y="518" width="320" height="50"/>
                    <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
                    <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                </view>
                <connections>
                    <outlet property="dataSource" destination="-1" id="guW-ch-dgt"/>
                    <outlet property="delegate" destination="-1" id="j1u-5q-dsq"/>
                </connections>
            </tableView>