Swift XcodeのCollectionView のレイアウトについて質問です。

Question

やりたいこと。
コレクションビューの横幅に対してセルを均等３個並ばせるレイアウトを作成したい。

import UIKit

class SearchViewController: UIViewController{
    
    @IBOutlet weak var usersListCollectionView: UICollectionView!
    
    private let cellId = "cellId"
    override func viewDidLoad() {
        super.viewDidLoad()
        
        usersListCollectionView.backgroundColor = .red
        usersListCollectionView.delegate = self
        usersListCollectionView.dataSource = self
        usersListCollectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: cellId)
        usersListCollectionView.contentInset = .init(top: 0, left: usersListCollectionView.frame.width * 0.025, bottom: 0, right: usersListCollectionView.frame.width * 0.025)
    }
}

extension SearchViewController:UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout{
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
         return 10
    }
    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = usersListCollectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath)
        cell.backgroundColor = .white
        return cell
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let collectionViewWidth = usersListCollectionView.frame.width
        print(collectionViewWidth)
        let cellWidth = (collectionViewWidth - collectionViewWidth * 0.1) / 3
        print(cellWidth)
        return .init(width: cellWidth, height: cellWidth)
    }
    
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        print(usersListCollectionView.frame.width * 0.025)
        return usersListCollectionView.frame.width * 0.025
        
    }
    
    
}

思うように動作しなかったのでprintで各幅を出力して確認してみたところピッタリ、コレクションビューの横幅に収まりました。
ですが表示されるコレクションビューはセクションに２つのセルのみです。
私の考えでは、セルの大きさに応じて可変的に一つのセクションに対して割り当てられるセルが収まっていれば３つ表示されると思ったのですがうまく表示されません。なぜでしょうか？

Comments

[tomato879241]

Interface BuilderからcollectionViewを選択して、header sizeとかmin spacingを調整してみてはどうでしょうか？

[hoshi-takanori]

Collection View の Min Spacing の値は確認しましたか？
https://stackoverflow.com/a/40020312

Answer 1

みなさん回答ありがとうございました。
結局のところピッタリ370だとなぜか縦２列になるので、全ての合計が369になるように計算したら３列で表示されました。愚策ですが。。。
floatの計算に問題があるのかもしれませんね。もしくはそういう仕様なのか