Swift CollectionView dan TableView di ScrollView
Jadi, bagaimana Anda bisa melihat di gambar di bawah ini, saya memiliki collectionView dan TableView di ScrollView. Dan itu bekerja tidak seperti yang saya harapkan. Anda bisa melihat masalahnya di gambar gif. CollectionView memiliki static height = 100 dan tableview memiliki selfsizeble height. Tinggi dan lebar StackView sama dengan tinggi dan lebar ScrollView. Sepertinya ada kesalahan kecil di suatu tempat, tetapi saya tidak dapat menemukannya.
di sini AutoSizeClass untuk TableView:
class AutoSizingTableView: UITableView {
override var intrinsicContentSize: CGSize {
self.layoutIfNeeded()
return CGSize(width: UIView.noIntrinsicMetric, height: contentSize.height)
}
override var contentSize: CGSize {
didSet{
self.invalidateIntrinsicContentSize()
}
}
override func reloadData() {
super.reloadData()
self.invalidateIntrinsicContentSize()
}
}
Masalahnya adalah Tampilan dengan Tampilan Koleksi tetap di tempat yang sama dan tidak menggulir ke atas.
Jawaban
Berdasarkan komentar Anda "dengan menonaktifkan pengguliran dalam tampilan tabel, tidak dapat digulir sama sekali" ... Anda telah melakukan kesalahan dengan penyiapan Anda.
Berikut adalah cara mengaturnya di Storyboard agar berfungsi. Perhatikan bahwa tampilan tabel harus menonaktifkan pengguliran :
Inilah sumber Storyboard itu:
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="16096" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="for-Xa-JUC">
<device id="retina4_7" orientation="portrait" appearance="light"/>
<dependencies>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="16087"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="collection view cell content view" minToolsVersion="11.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--Azdaev View Controller-->
<scene sceneID="UV2-bp-BSw">
<objects>
<viewController id="for-Xa-JUC" customClass="AzdaevViewController" customModule="TableAdd" customModuleProvider="target" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="Aiw-Z0-OHR">
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="NiW-5R-cfc">
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<subviews>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" spacing="8" translatesAutoresizingMaskIntoConstraints="NO" id="Iqj-ag-gPR">
<rect key="frame" x="0.0" y="0.0" width="375" height="348"/>
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Ewg-bZ-eyT">
<rect key="frame" x="0.0" y="0.0" width="375" height="100"/>
<subviews>
<collectionView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" translatesAutoresizingMaskIntoConstraints="NO" id="PVP-gp-7EW">
<rect key="frame" x="0.0" y="0.0" width="375" height="100"/>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<constraints>
<constraint firstAttribute="height" constant="100" id="4ie-da-XpJ"/>
</constraints>
<collectionViewFlowLayout key="collectionViewLayout" scrollDirection="horizontal" automaticEstimatedItemSize="YES" minimumLineSpacing="10" minimumInteritemSpacing="10" id="JhR-eW-5b9">
<size key="itemSize" width="80" height="80"/>
<size key="headerReferenceSize" width="0.0" height="0.0"/>
<size key="footerReferenceSize" width="0.0" height="0.0"/>
<inset key="sectionInset" minX="0.0" minY="0.0" maxX="0.0" maxY="0.0"/>
</collectionViewFlowLayout>
<cells>
<collectionViewCell opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" reuseIdentifier="SimpleCollCell" id="znX-Ra-Axt" customClass="SimpleCollCell" customModule="TableAdd" customModuleProvider="target">
<rect key="frame" x="0.0" y="10" width="80" height="80"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<collectionViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" id="GWE-KA-31W">
<rect key="frame" x="0.0" y="0.0" width="80" height="80"/>
<autoresizingMask key="autoresizingMask"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="7U6-uF-qZB">
<rect key="frame" x="19" y="30" width="42" height="20.5"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" red="0.99953407049999998" green="0.98835557699999999" blue="0.47265523669999998" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstItem="7U6-uF-qZB" firstAttribute="centerY" secondItem="GWE-KA-31W" secondAttribute="centerY" id="8E5-5k-QqV"/>
<constraint firstItem="7U6-uF-qZB" firstAttribute="centerX" secondItem="GWE-KA-31W" secondAttribute="centerX" id="FTH-Df-wyE"/>
</constraints>
</collectionViewCellContentView>
<connections>
<outlet property="theLabel" destination="7U6-uF-qZB" id="kcQ-Wy-2wY"/>
</connections>
</collectionViewCell>
</cells>
</collectionView>
</subviews>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<constraints>
<constraint firstAttribute="trailing" secondItem="PVP-gp-7EW" secondAttribute="trailing" id="941-fg-5DC"/>
<constraint firstItem="PVP-gp-7EW" firstAttribute="top" secondItem="Ewg-bZ-eyT" secondAttribute="top" id="9kx-ps-iUv"/>
<constraint firstItem="PVP-gp-7EW" firstAttribute="leading" secondItem="Ewg-bZ-eyT" secondAttribute="leading" id="OYx-qn-7cl"/>
<constraint firstAttribute="bottom" secondItem="PVP-gp-7EW" secondAttribute="bottom" id="OgJ-Yv-Jal"/>
</constraints>
</view>
<tableView clipsSubviews="YES" contentMode="scaleToFill" placeholderIntrinsicWidth="infinite" placeholderIntrinsicHeight="240" alwaysBounceVertical="YES" scrollEnabled="NO" dataMode="prototypes" style="plain" separatorStyle="default" rowHeight="-1" estimatedRowHeight="-1" sectionHeaderHeight="28" sectionFooterHeight="28" translatesAutoresizingMaskIntoConstraints="NO" id="XGR-gS-YDa" customClass="ContentSizedTableView" customModule="TableAdd" customModuleProvider="target">
<rect key="frame" x="0.0" y="108" width="375" height="240"/>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<prototypes>
<tableViewCell clipsSubviews="YES" contentMode="scaleToFill" preservesSuperviewLayoutMargins="YES" selectionStyle="default" indentationWidth="10" reuseIdentifier="SimpleTableCell" id="LTQ-ke-1N0" customClass="SimpleTableCell" customModule="TableAdd" customModuleProvider="target">
<rect key="frame" x="0.0" y="28" width="375" height="43"/>
<autoresizingMask key="autoresizingMask"/>
<tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" preservesSuperviewLayoutMargins="YES" insetsLayoutMarginsFromSafeArea="NO" tableViewCell="LTQ-ke-1N0" id="ILn-2o-e6E">
<rect key="frame" x="0.0" y="0.0" width="375" height="43"/>
<autoresizingMask key="autoresizingMask"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="QxE-9g-2Hm">
<rect key="frame" x="15" y="11" width="345" height="21"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<constraints>
<constraint firstAttribute="bottomMargin" secondItem="QxE-9g-2Hm" secondAttribute="bottom" id="2kY-7j-i6k"/>
<constraint firstAttribute="trailingMargin" secondItem="QxE-9g-2Hm" secondAttribute="trailing" id="8Rb-MN-fCq"/>
<constraint firstItem="QxE-9g-2Hm" firstAttribute="top" secondItem="ILn-2o-e6E" secondAttribute="topMargin" id="IFx-mV-xVp"/>
<constraint firstItem="QxE-9g-2Hm" firstAttribute="leading" secondItem="ILn-2o-e6E" secondAttribute="leadingMargin" id="SkZ-FP-3Xk"/>
</constraints>
</tableViewCellContentView>
<connections>
<outlet property="theLabel" destination="QxE-9g-2Hm" id="tCs-qB-RnZ"/>
</connections>
</tableViewCell>
</prototypes>
</tableView>
</subviews>
</stackView>
</subviews>
<constraints>
<constraint firstItem="Iqj-ag-gPR" firstAttribute="width" secondItem="cNU-lA-jis" secondAttribute="width" id="YWn-il-cIA"/>
<constraint firstItem="Iqj-ag-gPR" firstAttribute="bottom" secondItem="78Z-qi-tb8" secondAttribute="bottom" id="dWW-mF-X02"/>
<constraint firstItem="Iqj-ag-gPR" firstAttribute="leading" secondItem="78Z-qi-tb8" secondAttribute="leading" id="jlB-bm-lOp"/>
<constraint firstItem="Iqj-ag-gPR" firstAttribute="top" secondItem="78Z-qi-tb8" secondAttribute="top" id="oPw-KA-7Eb"/>
<constraint firstItem="Iqj-ag-gPR" firstAttribute="trailing" secondItem="78Z-qi-tb8" secondAttribute="trailing" id="t90-TH-ogv"/>
</constraints>
<viewLayoutGuide key="contentLayoutGuide" id="78Z-qi-tb8"/>
<viewLayoutGuide key="frameLayoutGuide" id="cNU-lA-jis"/>
</scrollView>
</subviews>
<color key="backgroundColor" systemColor="systemBackgroundColor" cocoaTouchSystemColor="whiteColor"/>
<constraints>
<constraint firstItem="NiW-5R-cfc" firstAttribute="top" secondItem="kCj-qX-p52" secondAttribute="top" id="18n-ZT-7rU"/>
<constraint firstItem="NiW-5R-cfc" firstAttribute="leading" secondItem="kCj-qX-p52" secondAttribute="leading" id="1BY-QR-X5K"/>
<constraint firstItem="NiW-5R-cfc" firstAttribute="trailing" secondItem="kCj-qX-p52" secondAttribute="trailing" id="YHh-qb-ygU"/>
<constraint firstItem="NiW-5R-cfc" firstAttribute="bottom" secondItem="kCj-qX-p52" secondAttribute="bottom" id="tzd-Zo-fNv"/>
</constraints>
<viewLayoutGuide key="safeArea" id="kCj-qX-p52"/>
</view>
<connections>
<outlet property="theCollectionView" destination="PVP-gp-7EW" id="MxW-WG-GPj"/>
<outlet property="theTableView" destination="XGR-gS-YDa" id="NhY-EO-L3y"/>
</connections>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="nbL-KS-cva" userLabel="First Responder" customClass="UIResponder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="447.82608695652175" y="3079.6875"/>
</scene>
</scenes>
</document>
dan kode demonstrasi:
final class ContentSizedTableView: UITableView {
override var contentSize:CGSize {
didSet {
invalidateIntrinsicContentSize()
}
}
override var intrinsicContentSize: CGSize {
layoutIfNeeded()
return CGSize(width: UIView.noIntrinsicMetric, height: contentSize.height)
}
}
class SimpleCollCell: UICollectionViewCell {
@IBOutlet var theLabel: UILabel!
}
class SimpleTableCell: UITableViewCell {
@IBOutlet var theLabel: UILabel!
}
class AzdaevViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UITableViewDataSource, UITableViewDelegate {
@IBOutlet var theCollectionView: UICollectionView!
@IBOutlet var theTableView: ContentSizedTableView!
override func viewDidLoad() {
super.viewDidLoad()
theTableView.dataSource = self
theTableView.delegate = self
theCollectionView.dataSource = self
theCollectionView.delegate = self
}
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 30
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let c = tableView.dequeueReusableCell(withIdentifier: "SimpleTableCell", for: indexPath) as! SimpleTableCell
c.theLabel.text = "Row \(indexPath.row)"
return c
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 10
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let c = collectionView.dequeueReusableCell(withReuseIdentifier: "SimpleCollCell", for: indexPath) as! SimpleCollCell
c.theLabel.text = "\(indexPath.item)"
return c
}
}
Hasil: