UICollectionView with different cell size

18.4k Views Asked by At

My goal is to create a UICollectionView with a layout as depicted below.

Is this possible without creating a custom UICollectionViewLayout?

4

There are 4 best solutions below

1
On
2
On

Use UICollectionViewDelegateFlowLayout method.

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

        let width : CGFloat
        let height : CGFloat

        if indexPath.item == 0 {
            width = 100
            height = 100
        } else {
            width = 50
            height = 50
        }
        return CGSizeMake(width, height)

}
2
On

Without creating a custom layout of collection view it is not possible to achieve what you want.

You can create custom cell size using its delegate method sizeforitematindexpath.

Also, check this link which helps to create a custom layout.

0
On

The answer from @Dejan Atanasov but for Swift 5

extension MainLobbyVC: UICollectionViewDelegateFlowLayout {
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        
        let width : CGFloat
        let height : CGFloat
        if indexPath.item == 0 {
            width = 100
            height = 100
        } else {
            width = 50
            height = 50
        }
        return CGSizeMake(width, height)
    }
}