Как сделать вид таблицы внутри прокрутки?
Мне нужно сделать табличное представление внутри представления прокрутки, чтобы страницу можно было прокручивать, а высота представления прокрутки зависела от количества данных в представлении таблицы. Я читал похожую ветку ниже, но моя проблема кажется другой
Как заставить прокрутку TableView внутри ScrollView вести себя естественно
я хочу, как на картинке ниже:
(перед прокруткой)
(после прокрутки вниз страницы)
Я не знаю, следует ли это делать с помощью автоматического размещения или с помощью кода. но я попытался упростить проблему, как на картинке ниже, но я не могу установить автоматическое размещение для представления таблицы
и вот ограничения.
ограничения для просмотра прокрутки
ограничения для базового представления
ограничения для желтого обзора
ограничения для просмотра таблицы
действительно нужна твоя помощь. Не могли бы вы мне помочь?
Представление таблицы уже является подклассом представления прокрутки. Вы не должны помещать его в режим прокрутки.
Ответы 3
Вы можете легко добиться этого, присвоив таблице начальную высоту, привязав ее к IB и изменив ее в соответствии с количеством строк, так как ваши изображения кажутся статичными, скажем 70, вы можете посмотреть этот макет, открыть Main.storyboard в качестве исходного кода и скопировать и вставить этот XML
<?xml version = "1.0" encoding = "UTF-8"?>
<document type = "com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version = "3.0" toolsVersion = "14113" targetRuntime = "iOS.CocoaTouch" propertyAccessControl = "none" useAutolayout = "YES" useTraitCollections = "YES" useSafeAreas = "YES" colorMatched = "YES" initialViewController = "BYZ-38-t0r">
<device id = "retina4_7" orientation = "portrait">
<adaptation id = "fullscreen"/>
</device>
<dependencies>
<deployment identifier = "iOS"/>
<plugIn identifier = "com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version = "14088"/>
<capability name = "Safe area layout guides" minToolsVersion = "9.0"/>
<capability name = "documents saved in the Xcode 8 format" minToolsVersion = "8.0"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID = "tne-QT-ifu">
<objects>
<viewController id = "BYZ-38-t0r" customClass = "ViewController" customModule = "CustomTexF" customModuleProvider = "target" sceneMemberID = "viewController">
<view key = "view" contentMode = "scaleToFill" id = "8bC-Xf-vdC">
<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 = "gQl-vh-MlV">
<rect key = "frame" x = "0.0" y = "20" width = "375" height = "647"/>
<subviews>
<view contentMode = "scaleToFill" translatesAutoresizingMaskIntoConstraints = "NO" id = "7JP-ij-rQ3">
<rect key = "frame" x = "0.0" y = "0.0" width = "375" height = "650"/>
<subviews>
<view contentMode = "scaleToFill" translatesAutoresizingMaskIntoConstraints = "NO" id = "oNu-7X-37n">
<rect key = "frame" x = "0.0" y = "0.0" width = "375" height = "200"/>
<color key = "backgroundColor" red = "1" green = "0.49823676220000002" blue = "1" alpha = "1" colorSpace = "calibratedRGB"/>
<constraints>
<constraint firstAttribute = "height" constant = "200" id = "IR2-Tm-rye"/>
</constraints>
</view>
<tableView clipsSubviews = "YES" contentMode = "scaleToFill" alwaysBounceVertical = "YES" dataMode = "prototypes" style = "plain" separatorStyle = "default" rowHeight = "-1" estimatedRowHeight = "-1" sectionHeaderHeight = "28" sectionFooterHeight = "28" translatesAutoresizingMaskIntoConstraints = "NO" id = "ivs-Bl-FXa">
<rect key = "frame" x = "0.0" y = "200" width = "375" height = "300"/>
<color key = "backgroundColor" white = "1" alpha = "1" colorSpace = "custom" customColorSpace = "genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstAttribute = "height" constant = "300" id = "Jir-gH-kN4"/>
</constraints>
</tableView>
<view contentMode = "scaleToFill" translatesAutoresizingMaskIntoConstraints = "NO" id = "Lma-pM-X0g">
<rect key = "frame" x = "0.0" y = "500" width = "375" height = "150"/>
<color key = "backgroundColor" white = "1" alpha = "1" colorSpace = "custom" customColorSpace = "genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstAttribute = "height" constant = "150" id = "1eR-tC-Mar"/>
</constraints>
</view>
</subviews>
<color key = "backgroundColor" white = "1" alpha = "1" colorSpace = "custom" customColorSpace = "genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstAttribute = "trailing" secondItem = "oNu-7X-37n" secondAttribute = "trailing" id = "IF5-Q4-Yyz"/>
<constraint firstItem = "oNu-7X-37n" firstAttribute = "leading" secondItem = "7JP-ij-rQ3" secondAttribute = "leading" id = "L5c-9H-y57"/>
<constraint firstItem = "ivs-Bl-FXa" firstAttribute = "leading" secondItem = "7JP-ij-rQ3" secondAttribute = "leading" id = "MTy-Go-8Nz"/>
<constraint firstAttribute = "trailing" secondItem = "ivs-Bl-FXa" secondAttribute = "trailing" id = "NBz-UU-WZr"/>
<constraint firstItem = "ivs-Bl-FXa" firstAttribute = "top" secondItem = "oNu-7X-37n" secondAttribute = "bottom" id = "Sn8-9m-9HT"/>
<constraint firstItem = "Lma-pM-X0g" firstAttribute = "leading" secondItem = "7JP-ij-rQ3" secondAttribute = "leading" id = "TSl-Yd-64k"/>
<constraint firstItem = "Lma-pM-X0g" firstAttribute = "top" secondItem = "ivs-Bl-FXa" secondAttribute = "bottom" id = "eGZ-3R-Rey"/>
<constraint firstAttribute = "bottom" secondItem = "Lma-pM-X0g" secondAttribute = "bottom" id = "pef-k0-8nU"/>
<constraint firstItem = "oNu-7X-37n" firstAttribute = "top" secondItem = "7JP-ij-rQ3" secondAttribute = "top" id = "qsE-OQ-4x6"/>
<constraint firstAttribute = "trailing" secondItem = "Lma-pM-X0g" secondAttribute = "trailing" id = "u4o-l3-56h"/>
</constraints>
</view>
</subviews>
<constraints>
<constraint firstAttribute = "bottom" secondItem = "7JP-ij-rQ3" secondAttribute = "bottom" priority = "250" id = "5Pl-Zc-jKy"/>
<constraint firstItem = "7JP-ij-rQ3" firstAttribute = "leading" secondItem = "gQl-vh-MlV" secondAttribute = "leading" id = "6wk-HX-XUh"/>
<constraint firstAttribute = "trailing" secondItem = "7JP-ij-rQ3" secondAttribute = "trailing" id = "hSU-wA-1v0"/>
<constraint firstItem = "7JP-ij-rQ3" firstAttribute = "top" secondItem = "gQl-vh-MlV" secondAttribute = "top" id = "o0p-fH-VhV"/>
<constraint firstItem = "7JP-ij-rQ3" firstAttribute = "width" secondItem = "gQl-vh-MlV" secondAttribute = "width" id = "wgf-e8-HLU"/>
</constraints>
</scrollView>
</subviews>
<color key = "backgroundColor" red = "1" green = "1" blue = "1" alpha = "1" colorSpace = "custom" customColorSpace = "sRGB"/>
<constraints>
<constraint firstItem = "6Tk-OE-BBY" firstAttribute = "bottom" secondItem = "gQl-vh-MlV" secondAttribute = "bottom" id = "Axy-dp-ZiJ"/>
<constraint firstItem = "6Tk-OE-BBY" firstAttribute = "trailing" secondItem = "gQl-vh-MlV" secondAttribute = "trailing" id = "LED-nS-Ba6"/>
<constraint firstItem = "gQl-vh-MlV" firstAttribute = "top" secondItem = "6Tk-OE-BBY" secondAttribute = "top" id = "RS2-MF-Aya"/>
<constraint firstItem = "gQl-vh-MlV" firstAttribute = "leading" secondItem = "6Tk-OE-BBY" secondAttribute = "leading" id = "euc-Qn-E0q"/>
</constraints>
<viewLayoutGuide key = "safeArea" id = "6Tk-OE-BBY"/>
</view>
</viewController>
<placeholder placeholderIdentifier = "IBFirstResponder" id = "dkx-z0-nzr" sceneMemberID = "firstResponder"/>
</objects>
</scene>
</scenes>
</document>
//
tableViewHeightConstraint.constant = 100 * 70
self.view.layoutIfNeeded()
и реализуем этот метод
func tableView(_ tableView: UITableView,
heightForRowAt indexPath: IndexPath) -> CGFloat {
return 70 // height for every row
}
Я считаю, что это лучший ответ, но я немного запутался, как динамически изменять высоту tableView, я попытался подключить heightContraint, но я не знаю, как вызвать tableViewHeightContraint.constant = numberOfRow * heightOfRow. вот скриншот того, что я пробовал i.stack.imgur.com/LYMsS.png, но результат странный. не могли бы вы помочь мне еще немного, сэр? :(
если у вас 100 строк, то это должно быть tableViewHeightConstraint.constant = 70 * 100 self.view.layoutIfNeeded
ммммм, это дает мне ошибку :( i.stack.imgur.com/tJhb1.png, я не знаю, как получить высоту строки, и я не уверен, куда поместить этот код, я полагаю, в viewDidLoad
Это решение на самом деле не использует «табличное представление», если начальная высота вашего табличного представления равна размеру всего содержимого, тогда все содержимое будет загружено, и функция повторного использования ячеек не используется.
Добавьте 4 ограничения tableView и установите для него фиксированную высоту:
теперь подключите iboutlet к ограничению высоты tableView и программно измените его значение:
heightConstraint.constant = yourArray.count * rowHeightOfTableView
Попробуйте и посмотрите, работает ли это в вашем сценарии.
Но все же я скажу, что не используйте оба. Лучше использовать только tableview и создавать собственные ячейки в соответствии с пользовательским интерфейсом.
Вы можете попробовать этот способ, сначала возьмите вид прокрутки, установите макет этого вида прокрутки (ведущий -> 0, хвостовой -> 0, верх -> 0, низ -> 0). Затем посмотрите внутри представления прокрутки и установите макет обзора (ведущий, задний, верхний, нижний, высота) и центр по горизонтали для просмотра. Затем возьмите желтый вид (календарь) изнутри и установите взятие макета (ведущий, задний, верхний, высота). Затем возьмите табличный вид и установите макет табличного представления (вертикальное пространство для желтого вида, ведущее, хвостовое, нижнее). Теперь вы устанавливаете все макеты.
зачем использовать
scrollview? вы можете добиться этого только с помощьюtableview. Создавайте настраиваемые ячейки для разных пользовательских интерфейсов.