Swift CollectionView y TableView en ScrollView
Aug 22 2020
Entonces, ¿cómo puede ver en la imagen a continuación? Tengo collectionView y TableView en ScrollView. Y no funciona como esperaba. Puedes ver el problema en la imagen gif. CollectionView tiene una altura estática = 100 y la vista de tabla tiene una altura de tamaño propio. La altura y el ancho de StackView son iguales a la altura y el ancho de ScrollView. Parece que hay un pequeño error en alguna parte, pero no puedo averiguarlo.
aquí AutoSizeClass para 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()
}
}
El problema es que la vista con la vista de colección permanece en el mismo lugar y no se desplaza hacia arriba.
Respuestas
1 DonMag Aug 23 2020 at 00:19
Según su comentario "con el desplazamiento deshabilitado en la vista de tabla, no se puede desplazar en absoluto" ... ha hecho algo mal con su configuración.
Así es como debe distribuirse en Storyboard para que funcione. Tenga en cuenta que la vista de tabla debe tener el desplazamiento deshabilitado :
Aquí está la fuente de ese 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>
y código de demostración:
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
}
}
Resultados:
