UIcollectionview with 2 different kind of cells

Question

I need to create a UIcollectionview with grids of cells with 3 cells per row. After a certain amount of cells, lets say 60, I need to display a big cell with image view inside of it, and the cells needs to be in full width of the UIcollectionview. I have done created the 3 cells part, but I failed to figure out how to insert the big image cell and how to layout it properly. Thanks.

See this links -https://www.raywenderlich.com/129059/self-sizing-table-view-cells / . https://stackoverflow.com/questions/25895311/uicollectionview-self-sizing-cells-with-auto-layout — Rashed, Apr 16 '18 at 18:08

Kowboj · Answer 1 · 2018-04-16T15:46:37.000

1

How about you do a few sections? And the header is the other cell. You can put an image there as well.

edited Apr 16 '18 at 15:46

answered Apr 16 '18 at 15:29

Kowboj

351
2
14

I don't think the image would be a header or footer. Imagine there are 5000 cells I need to display, every 60 small cells I need to display 1 bigger cell like an ad banner. Is there any way to do this? – kamenr Apr 16 '18 at 15:40
Change cell frame inside cellForRowAtIndex, if cell % 60 == 0 ? – Kowboj Apr 16 '18 at 16:00
i found out the willdisplaycell function will replace the banner cell with normal cell. Is there any way to solve it? – kamenr Apr 17 '18 at 03:42

BXV · Answer 2 · 2018-04-16T16:02:40.293

0

You could specify the size of the cell in the UICollectionViewFlowLayout delegate method

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        //logic to find if the cell is 60 th item and then and dont forget to return the size of the other cells.
    if 60th cell {
        return size
    } else {
    return size
    }

}

edited Apr 16 '18 at 16:02

answered Apr 16 '18 at 15:57

BXV

405
3
16

I got an issue, I can see the 60th cell is displaying correctly for a while, then it got replace by the normal cells when i slowly scroll down. – kamenr Apr 17 '18 at 03:11
i found out the willdisplaycell function will replace the banner cell with normal cell. Is there any way to solve it? – kamenr Apr 17 '18 at 03:29
that could be a logic issue with dequeue items, in item func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) { }. Please check the dequeue logic is correct. – BXV Apr 17 '18 at 14:44
yeah, I solved this issue. Now my current issue is how do I display the image on cell 60 but my normal data start from cell 61? Because the image view is also same with my normal item in cell 60 – kamenr Apr 17 '18 at 14:51
I didn't understand the question, Does your data source has 60th item as data for image view or the data source contains only the type 1 data? – BXV Apr 17 '18 at 15:01
there is an array of data of objects [users], so the numbers of users will be big. I need to display the users info on the cell1 which display 3 per row. On every increment of cell 61 I need to display a big banner image view which the data is just an URL. Now the problem is I can display the cell 61 image banner, but in the same time the 61st [users] is display into the cell 61 image banner too, so how can I prevent the [users] to display into the banner cell? – kamenr Apr 17 '18 at 15:12

UIcollectionview with 2 different kind of cells

2 Answers2