Following some questions on a different thread, I am uploading this video to explain how to use a ScrollView and inside have Grid Views.
Time Stamps
00:00 - 00:19: Create a second Grid View just to have 2 in the ScrollView.
00:20 - 00:26: Connect Grid View with the same data and make it horizontal. Note: You could connect it to a different List or a Datasource.
00:28 - 00:36: Add a ScrollView and inside a View. View need to be a subview of the ScrollView and also be the ONLY subview of it. This View will work as a Content View and everything inside it will be scrollable.
00:38 - 00:40: Set the Pin Constraints of the ScrollView. You can set any mix of Constraints but the device should be able to calculate the size of it without calculating the content of it, so you need to have 2 Constraints per Axis. Usually, if you want the whole Screen to be scrollable, then you set Top, Bottom, Left and Right to 0.
00:40 - 01:04: Set the Constraints of the Content View. This is the most important step to implement the ScrollView.
- Content View must have Top, Bottom, Left and Right Constraints with ScrollView equal to 0. In the video (00:42 - 00:50) we add first the Pin Constraints and then convert them to Constraints Mode, so Kodika automatically created the 4 constraints with the ScrollView but you can do it also manually.
- (00:52 - 00:58) Set the height of the Content View. This is the size of the content that will be scrollable.
- (00:59 - 01:03) Add an Equal Width Constraint between the Content View and the Scroll View. We need to set this so the Content View doesn’t scroll horizontally. The Grid Views will continue to be scrollable.
- Note: You can revert the last 2 steps if you want to have a Horizontal Scrollable ScrollView, so have a hardcoded width and an Equal Height Constraint.
01:04 - 01:13: Add the Grid Views in the Content View, so they are part of the scrollable content.
01:16 - 01:24: In this example we add also a Label. Note: You need to add the Label in the Content View and not directly in the design and also NEED to set the Constraints of it.