集合视图单元格布局

Question

Hi guys I am trying to create a AirBnB app lookalike horizontal scrolling. Everything is going great so far but I am walking into some issues. I try to make every 3rd item bigger. Somehow tho hey don't resize. see the screenshot below

The third item has nothing under it but it doesn't resize. to the full height. Instead it messes the whole layout.

How it should be is

Here is what I do

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {

    if indexPath.item % 3 == 0 && indexPath.item != 0 {
        return CGSizeMake(420, 520)
    }

    return CGSizeMake(420, 260)
}

What am I doing wrong here?

Answer 1

A cells size is set by the UICollectionViewDelegateFlowLayout method

optional func collectionView(_ collectionView: UICollectionView,
                      layout collectionViewLayout: UICollectionViewLayout,
      sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize

For example:

func collectionView(_ collectionView: UICollectionView,
                      layout collectionViewLayout: UICollectionViewLayout,
      sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize{

    if indexPath.item % 3 == 0 && indexPath.item != 0 {
        return CGSize(400,1200)
    }
    return CGSize(400,600)
}

Answer 2

I think you are counting your cells wrong if you want it like in the photo you should say:

if (indexPath.item + 1) % 3 == 0 && indexPath.item != 0 {
        return CGSizeMake(420, 520)
    }