Vertical and Horizontal Scroll Design using TableView and CollectionView (Container and Child Concept) in Swift

Sujal Shrestha
1 min readSep 23, 2018
Vertical + Horizontal Scrolling in Appstore app

We can see many apps which have vertical as well horizontal scroll design layout. It’s not a difficult design to code. There are different ways. One of the most used method is to use a TableViewController and embed a CollectionView inside the TableView cells.

But, the main challenge is to do it in a reusable and testable way. You can quickly make your ViewController/TableViewController massive and pile tons of boiler plate and delegate codes in them.

A quick fix to solve this issue is to use “Child ViewControllers”. We can make a separate CollectionViewController and add it as a child inside the TableView cells.

As you can see from the above code, it’s very easy to add an entire CollectionViewController i.e ChildController() as a child to any Viewcontroller or even inside a TableView cell.

This makes your code decoupled. There is no tight coupling between the TableView and the CollectionView. These two can act as different entities entirely. It also makes your CollectionViewController reusable and easily testable. Likewise, your tableviews aren’t cluttered with boilerplate override and delegate codes.

For full project demo you can visit my GitHub repo: https://github.com/sujalshrestha/ChildVCExample_iOS

--

--