web-dev-qa-db-ja.com

UICollectionView 3列グリッド、1pxスペース?? (画像込み)

垂直方向または水平方向のセル間にスペースを残さないFlowLayoutを使用してUICollectionViewをセットアップしました。

私はすべてが機能していますが、2列目と3列目の間に奇妙な1pxのスペースがあり、その理由がわかりません!? iOSシミュレーターと実際のデバイスの両方で1pxのギャップが表示されることを確認しました。誰かがこれを経験しましたか?

私のUIViewControllerは、次のデリゲート/データソースです。

class MyViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout

間隔を削除するために必要な関数を実装し(そして、それらが実行されていることをprintステートメントで確認し)、セルが隣り合って並んでいることを視覚的に確認しました。

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets {
    return UIEdgeInsetsZero
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 0
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 0
}

最後に、返されるセルの幅(各色の正方形)を印刷して、それが(view.frame.width / 3)または(320/3)であることを確認しました。これは106.666667です。

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

    var totalHeight: CGFloat = (self.view.frame.width / 3)
    var totalWidth: CGFloat = (self.view.frame.width / 3)

    println(totalWidth) // this prints 106.666666667

    return CGSizeMake(totalWidth, totalHeight)
}

enter image description here

17
Alex

同様の状況では、数値のdouble型を避ける方がよいでしょう。使用する:

return CGSizeMake(ceil(totalWidth), ceil(totalHeight))
5
dimpiax

私は同じ問題を抱えていました、私は以下のコードでそれを修正しました:

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

    let paddingSpace = sectionInsets.left * 4
    let availableWidth = view.frame.width - paddingspace
    let widthPerItem  = availableWidth/3

    return CGSizeMake(width: widthPerItem, height: widthPerItem)
}

クラスの最初に以下の変数を定義します。

fileprivate let sectionInsets = UIEdgeInsets(top: 0.0, left: 0.5, bottom: 0.0, right: 0.0)
3
Tiago Couto

たとえば、画面幅= 320の場合、3で割ると106.6666になります。 Intと見なすと、106 * 3 = 318になります。320-318= 2であるため、最初の2つのセルに1ピクセルずつ2ピクセルを追加する必要があります。以下のソリューションを試してください。

public func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let columns = 3 
    let width = Int(UIScreen.main.bounds.width)
    let side = width / columns
    let rem = width % columns
    let addOne = indexPath.row % columns < rem
    let ceilWidth = addOne ? side + 1 : side
    return CGSize(width: ceilWidth, height: side)
}
1
Asike

これが、メソッドcollectionViewレイアウトで幅106の中央のセルと幅107のその他の2つのセルを作成するための私の解決策です。

NSInteger numColumns = 3;
CGSize deviceSize;
CGFloat width = self.view.frame.size.width / numColumns;
CGFloat height = width ;
NSInteger rem = (int)self.view.frame.size.width%numColumns; 
if(indexPath.row == (1 + numColumns*counter) && rem != 0) {  

    deviceSize = CGSizeMake(floor (width), ceil(height));
    counter++;
}
else {

    deviceSize = CGSizeMake(ceil (width), ceil(height));
}
deviceSize = CGSizeMake(deviceSize.width, deviceSize.height);
0