Swift CollectionView e TableView in ScrollView

Aug 22 2020

Quindi, come puoi vedere nella foto qui sotto, ho collectionView e TableView in ScrollView. E non funziona come mi aspettavo. Puoi vedere il problema nell'immagine gif. CollectionView ha altezza statica = 100 e tableview ha altezza auto-dimensionata. L'altezza e la larghezza di StackView sono uguali all'altezza e alla larghezza di ScrollView. Sembra che da qualche parte ci sia un piccolo errore, ma non riesco a scoprirlo.

qui AutoSizeClass per 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()
      }
    
  }

Il problema è che la vista con la vista raccolta rimane nella stessa posizione e non scorre verso l'alto.

Risposte

1 DonMag Aug 23 2020 at 00:19

In base al tuo commento "con lo scorrimento disabilitato in tableview non è affatto scorrevole" ... hai fatto qualcosa di sbagliato con la tua configurazione.

Ecco come deve essere disposto in Storyboard per farlo funzionare. Tieni presente che la visualizzazione tabella deve avere lo scorrimento disabilitato :

Ecco la fonte di quello Storyboard:

<?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>

e codice dimostrativo:

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
    }

}

Risultati: