CODEWITHSUNDEEP
swiftuicollectionview
kylesureline
kylesureline

Reputation: 31

UICollectionView Strange gap between cells (Swift)

I'm trying to display 2 sections of images in columns of 3. For some reason, there are these strange gaps between some of the cells. I've looked everywhere in my storyboard and everything seems correct. I've also experimented with setting the columns to 2, 4, 5, 6, and so on. There are no strange white lines with the columns set to any other number. These lines appear both in the 5S simulator and on my physical iPhone 5S.

Simulator Screenshot

override func viewDidLoad() {
    super.viewDidLoad()

    let width = CGRectGetWidth(collectionView!.frame) / 3
    let layout = collectionViewLayout as! UICollectionViewFlowLayout
    layout.itemSize = CGSize(width: width, height: width)
}

Upvotes: 2

Views: 514

Answers (1)

CocoaNuts
CocoaNuts

Reputation: 189

This error is being caused by the floating point calculation you did for width.

An iPhone 5S has 320 pixels on its width. Assuming your collectionView has the same width as the screen, the width and height of each cell would be 320 / 3 = 106.666666667, which is a repeating decimal.

To fix this, I'd recommend using a number divisible by 3, and smaller than (and very close to) 320 for your collectionView width. So if you use 318, the resulting width and height of each cell would be 318 / 3 = 106, which is a nice number!

General Rule: UICollectionView width should be divisible by the number of cells in each row.

Upvotes: 1

Related Questions