Dynamic cell size of UICollectionView

Question

1) How can I achieve as shown in the UICollectionView picture?

2) I tried the method -(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath and passed different sizes, but it does not contain spaces between cells. Can I remove these spaces? I want a different height and width for each cell

Current Output: .

Answer 1

Sorry, this is very late ... But perhaps this will help people who have not yet found the answer. If you have images in the array, you can simply specify the image size and make adjustments to the cell size from there:

 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { UIImage *image = [imageArray objectAtIndex:indexPath.row]; //You may want to create a divider to scale the size by the way.. return CGSizeMake(image.size.width, image.size.height); } 

Hope this helps.

Answer 2

Perhaps this layout will suit your needs. Please take a look at this project: https://github.com/betzerra/MosaicLayout

I’m not sure that 100% it will fully satisfy your requirements, but in the worst case it can help you write your custom UICollecionViewFlowLayout (which is the only way to achieve your goal).

Answer 3

You cannot achieve a result similar to your question with the standard UICollectionViewFlowLayout , which in its base implementation (without a subclass) creates a grid.

To get what you want, you must create your own subclass of UICollectionViewLayout (or, possibly, UICollectionViewFlowLayout ), where you do all the calculations necessary to place each element in the right frame.

Take a look at a great tutorial and here is for something similar to what you want .

Answer 4

Instead of creating variable image heights in a line, fix the same image height sizes, but they can have different widths in a line. Create such combinations and display, and you can reuse the same cell for different heights with one or more images of different widths in a row. I did the same, gives the same feeling that you like Google Image Search