UICollectionView different size cell and item count

Question

Using UICollectionView flow delegate, I'm trying to accomplish this but I still need to remove the huge spacing in the two cell areas.

My Code :

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if indexPath.row == 0  || indexPath.row == 5 {
        return CGSize(width: (getWidth()/2) , height:  (getWidth()/2))
    }
    return CGSize(width: (getWidth()/4) , height: (getWidth()/4))
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
    return 0
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 0
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
    return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
}

Expected :

You will need to create your custom collectionViewLayout to get something like that. I don't think that's possible with off the box layout — Galo Torres Sevilla, Nov 29 '18 at 11:10
https://www.raywenderlich.com/392-uicollectionview-custom-layout-tutorial-pinterest This will help you. — Nilanshu Jaiswal, Nov 29 '18 at 11:11
problem seem like in your getWidth() function check it . OR Probably in your image constarint not 0 — Tm Goyani, Nov 29 '18 at 11:21
Can you please post a desired outcome? I have a solution for the layout like [this](https://imgur.com/a/FF4wNVP). Is it the same you want? — fewlinesofcode, Nov 29 '18 at 12:57
@a.masri check this -> https://octodev.net/custom-collectionviewlayout/ — dahiya_boy, Nov 29 '18 at 13:27
You can check this video tutorial: https://www.youtube.com/watch?v=x7ZZObAj_s8&t=2s It will be good if you will learn how to make a custom layout in CollectionView. It will help you to design other kinds of layout. — nitin.agam, Nov 29 '18 at 13:34

score 2 · Answer 1 · edited Nov 25 '19 at 19:54

It is impossible to do this using plain UICollectionViewLayout. By its nature, UICollectionViewLayout is a "line-braking-layout" and line-height is the height of its tallest element. Please see the following:

Apple docs on using UICollectionViewFlowLayout

However, the behavior you want can be achieved by subclassing UICollectionViewFlowLayout. Here is a guide on how to do it:

Creating custom layouts

UICollectionView different size cell and item count

1 Answers1