Multiple UICollectionView scrolling in same layout - ios

I'm trying to build something close to this
As you see here , when you scroll down , all the view scroll
This is my view :
when i scroll down , only the second collection view which scroll
My view is like that :
I tried to use UIScrollView , but always the same result ?
Any idea how to make this kind of layouts ?
Thanks.

You can accomplish the first layout (red cells) with a tableView with cells that contain collectionViews (one horizontally scrolling collectionView per tableView cell). However, in your case, it looks like you want the top part to scroll horizontally, and have the whole thing to scroll vertically. I would do something like this: Have the whole thing in a collectionView with 2 types of cells. The first type would be most popular place cell that contains a horizontally scrolling collectionView. The second type of cell would be the individual hotel cells.
The layout on the storyboard would look something like this

Related

How to make a Horizontal and vertical scrolling TableView in iOS using storyboard?

here is my design structure
I was wondering about creating a horizontal and vertical scrolling tableview. I have tried a tableview inside a scrollview but I failed miserably. What to do?
I use swift4 but I wanted to do in storyboard.
The nature of content is like an excel sheet with lots of horizontal and vertical scrolling rows and columns of data.
Actually you can do this using a hack. Put the tableView inside a scrollView. Then you should give a dynamic width to the tableView by specifying a width in storyboard for tableView or any child view of that scrollView(So we get the horizontal scrolling).You have to adjust some constraints depending on your requirement
Mine worked fine but as many users have said try a collection View if its easy
Note. There is a default scrollView within a tableView, So adjust your height of tableView in a way so the scrollView of tableView work and not the parent scrollView, while scrolling from top to bottom
Instead of using TableView try using collection view, there you can use horizontal and vertical scrolling using storyboard?
Try to use collectionview instead of tableview.
If your requirement demands use of tableview anyhow, then you can use tableview within scrollview.
In tableview within scrollview approach, you need to distinguish your parent scrollview as well as tableview's scrollview. Try to differentiate parent scrollview and tableview's scrollview with different tags. Because both scrollview will call delegate methods of viewcontroller, if implemented. Just check tag of scrollview in all delegate methods of scrollview and perform action accordingly.
As per my understaing you want a view which you want vertical scroll view and horizontal inside it.
So here my suggestion is to use UITABLEVIEW for vertical scrolling and UICOLLECTIONVIEW for horizontal scrolling inside tableview
Both will work fine

Scrolling Views Along with Collection View Cells

On my view controller I have 1 collectionview underneath 2 views at the top of the view controller I set the collection views height based on the size of the views so the collectionview is big enough that it doesn't need to scroll. All 3 views are inside of a scrollview so that I can scroll the views and the collection cells seamlessly. This feels very inefficient but i can't think of another way of providing this sort of seamless scroll between the views and the collectionview. Is there something else I can do to achieve the same or at least similar result?
EDIT: https://gyazo.com/8e5febea0974b0e6e0660f1714d67cbc this will hopefully explain it better. label is the view inside of the scrollview above the collectionview and four buttons are collectionview cells. Now if I add 20 buttons instead of only 4 I can scroll the collection view but it won't scroll with the label. This might also help explain what I'm trying to achieve - http://jsfiddle.net/hDwPH/
Ignore This Dummy Code
From the screen shot, I assume that your view controller consists of
1 UILabel
Multiple UIButtons
Only 1 item per row
If so, you should consider using UITableView instead. The UILabel will be section header, The UIButtons will be the rows (UITableViewCell). So your UITableView consists of 1 section, 20 rows.
If you want your UILabel to float along with the UIButtons, set the
UITableView style to UITableViewStyleGrouped
If you want your UILabel to remain fixed, set the UITableView style to UITableViewStylePlain

UICollectionView scroll whole page

I have a viewController with some text and under it a UICollectionView (about 50% of the page).
My problem is that when I scroll on the collectionView just the cells are being scrolled and not the whole page (the text + the collection cells).
You can think about it like on Instagram profile page (half info half collectionView), when you scroll on Instagram everything is being scrolled and not just the collection cells.
Anyone knows how can I do it?
Thanks!
Add the text content as separate cells on top of the UICollectionView.
Preferably, create a different section which would contain the cells with the top text.
Keep the backgroundColor/backgroundImage of these cells plain to give the effect that they are simply added as UILabels on a form. Doing so will also differentiate from the rest of the actual UICollectionViewCells.
Now, when you scroll the UICollectionView. It will give an effect that the text along with the cells are scrolled.
In Attribute inspector > Scroll View > check Paging enable
Thats because your text/UILabels doesn't belong within the UIScrollView of your UICollectionView, thus it will not be scrolled when the collectionView is. You could create a UICollectionViewCell for your text, include it within your collectionview and expand the collectionView to fit the screen or use a UICollectionViewController

UICollectionView two cells in a single row

I am trying to layout a vertical scrolling collection view cells to layout like this
When I tried to size the cells like that it made the bottom right one go onto the next line instead of group them together.
Take a look at the UICollectionViewLayout class. There you should find methods you need to achieve your desired look.
https://developer.apple.com/library/prerelease/tvos/documentation/UIKit/Reference/UICollectionViewLayout_class/index.html

horizontal scrolling for each section in a table view

I want to implement a UICollectionView with multiple sections which each section scrolls horizontally and independently like the attached image
I suggest you to use UITableView with customized UITableViewCells with UIScrollView as subview on its contentViews.
There are many samples, for example here
You can use multiple UICollectionViews in table cells. The tableView will scrolls vertically and The collection views can be configured to scroll horizontally by setting particular set of properties which will restrict them to scroll vertically, and they will only scroll horizontally. One constraint to consider is it is much more difficult to do animations that need to move from one table cell to another and you can't use a neat single change of collection view layout to animate all the items in your table view. But if these constraints aren't a problem then this is a relatively easy solution. I also tried it once. It worked for me. Hope that it works for you as well.

Resources