Search code examples
iosuicollectionviewios10

How to resize the collection view cells according to device screen size?


I noticed that the cells would always follow the definition in size inspector. Even if I have already applied UICollectionViewDelegateFlowLayout.

enter image description here

enter image description here

So that's how it looks. But I want the cells to rather look like how it was on a smaller iphone screen.

enter image description here


Solution

  • Implement sizeForItemAt method according to the view's frame size

    Swift

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    
        let height = view.frame.size.height
        let width = view.frame.size.width
        // in case you you want the cell to be 40% of your controllers view
        return CGSize(width: width * 0.4, height: height * 0.4)
    }
    

    Objective C

    - (CGSize)collectionView:(UICollectionView *)collectionView 
                  layout:(UICollectionViewLayout *)collectionViewLayout 
       sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
    
       CGFloat height = self.view.frame.size.height;
       CGFloat width  = self.view.frame.size.width;
       // in case you you want the cell to be 40% of your controllers view
       return CGSizeMake(width * 0.4, height * 0.4);
     }