TableView empty inside ScrollView unless I add another UIView? - ios

Question

I have a ViewController with a ScrollView inside (pinned to edges, 4 constraints). Everything fine.
I then add a TableViewController as a ChildViewController to the ScrollView. The TableViewController is hardcoded to have 3 rows. The TableViewController's view is pinned to the full ScrollView.
#IBOutlet weak var SV: UIScrollView!
override func viewDidLoad()
{
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let TVC = storyboard.instantiateViewController(withIdentifier: "TVC") as! TVC
addChildViewController(TVC)
SV.addSubview(TVC.view)
TVC.didMove(toParentViewController: self)
TVC.view.translatesAutoresizingMaskIntoConstraints = false
TVC.view.topAnchor.constraint(equalTo: SV.topAnchor).isActive = true
TVC.view.leadingAnchor.constraint(equalTo: SV.leadingAnchor, constant: 100).isActive = true
TVC.view.trailingAnchor.constraint(equalTo: SV.trailingAnchor, constant: -100).isActive = true
TVC.view.bottomAnchor.constraint(equalTo: SV.bottomAnchor).isActive = true
}
If I open debugger, I see that the ScrollView layout is ambiguous and that override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell never gets called for the table view controller (why ?).
Instead, if I simply add a label within the storyboard or any other view, inside the scrollview, and add 4 constraints to it, then the TableView will be shown and override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell is called as expected.
What's up with this ? ScrollView shouldn't be ambiguous, because the TableView should calculate it's own intrinsic content size ? What's wrong with the tableview that it never populates itself if it's alone inside the ScrollView ?
I'm adding the whole sampleproject. If you run it, the result is expected, the tableview is shown. If you go to storyboard and remove the label from the ScrollView, then the TableView won't be populated at all.
I don't know how I can directly add the sampleproject here, so I uploaded it. Just run it, then remove the only label from storyboard and re-run it, no more table view.
https://wetransfer.com/downloads/e0a75a995992cdc2be9120224515549920181003074547/1083bc9a3cb34fe9b1ab8e513b1520f020181003074547/e68826
PS: ignore other things, like child view controlers in there. My only question is why the tableview is shown when the label exists inside the same ScrollView and not shown when the label is removed.

Answer 1

First of all, the constraints applied to the views inside a ScrollView are a little bit, let's say, special. They are not linked to the ScrollView's frame, they are sort of linked to the ScrollView's "contentSize". Normally, if you would have a View inside another view, and the inside view is pinned in all directions to the superView, it will either stretch to match the parent size (if the parent constraints are well defined to a different parent), or the parent will "wrap" the child size, if the parent constraints are not defined relative to another parent.
Now the ScrollView behaves a little bit different in this case, the ScrollView size will never "wrap" the child. The child constraints are added just to tell the ScrollView, what's the scroll area (contentSize).
Moreover, in your case the UITableView, you can think of it like a "special" ScrollView, can't provide enough information for the ScrollView in order to compute the scrollableContent. If you pin the tableView in all directions, it will just tell the TableView, "align with the parent in all directions" but the scroll view will not know "how much can I scroll".
So because of the above problem, you usually add a UIView inside the ScrollView to act as a "container" and depending on the scrollDirection, you set the view width/height to be equal to the ScrollView or to the parent of the scrollView (again depending on the use case). Then all the content that you want to be inside the scrollView it's added inside the UIView. Also the content is pinned in such way, that it won't allow "compression" to force the parent view (aka container) to stretch to "wrap" the whole content, in this way, the scroll will know how much is the scroll area.
ScrollView shouldn't be ambiguous, because the TableView should calculate it's own intrinsic content size ?
This one is wrong, the intrinsic content size, defines the minimum size that the view needs in order to be drawn. Now think about this, how much space does a tableView needs in order to be drawn, if no other special implementation is added, the answer is 0. The tableView can have a width/height of 0, there's no constraints to prevent this.
Now to wrap it up, your implementation is a little bit wrong, to fix it, I suggest to have a close look over one of the many tutorials that shows how to implement a UIScrollView with auto-layout.
You'll see that most of the implementations will:
add a UIView inside the UIScrollView (aka "containerView)
then the view will be pinned in all directions to the UIScrollView
then either the width or the height of the container will be set to be equal to the scrollView or the parent of scroll view
then content will be added inside the "containerView"
then constraints will be applied to the content in such way that the container will have to wrap around the content.