iOS - 删除 UICollectionViewCell 之间的垂直空间
Posted
技术标签:
【中文标题】iOS - 删除 UICollectionViewCell 之间的垂直空间【英文标题】:iOS - Remove vertical space between UICollectionViewCell 【发布时间】:2020-07-02 15:00:39 【问题描述】:我有一个UICollectionView
,每行有三个单元格。除 iPhone SE 外,所有 iPhone 上的单元格之间都没有垂直间距。
iPhone SE 上的第二个和最后一个单元格之间大约有 1 点垂直间距。我不明白它来自哪里。如何摆脱它?
class ViewController: UIViewController
override func viewDidLoad()
super.viewDidLoad()
let collection = ColorCollectionView(sectionHeadersPinToVisibleBounds: false)
self.view.addSubview(collection)
collection.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 8).isActive = true
collection.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 8).isActive = true
collection.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -8).isActive = true
collection.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -8).isActive = true
collection.translatesAutoresizingMaskIntoConstraints = false
let colors: [UIColor] = [.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,
.systemGray, .systemGray2, .systemGray3,]
collection.colors = colors
class ColorCollectionView: UICollectionView
var colors: [UIColor] = []
var selectedColor: UIColor?
var headerName: String?
override init(frame: CGRect, collectionViewLayout layout: UICollectionViewLayout)
super.init(frame: frame, collectionViewLayout: layout)
self.backgroundColor = .clear
self.register(ColorCollectionViewCell.self, forCellWithReuseIdentifier:ColorCollectionViewCell.identifier)
self.dataSource = self
self.delegate = self
convenience init(sectionHeadersPinToVisibleBounds: Bool)
let layout = UICollectionViewFlowLayout()
layout.sectionHeadersPinToVisibleBounds = sectionHeadersPinToVisibleBounds
layout.scrollDirection = .vertical
self.init(frame: .zero, collectionViewLayout: layout)
required init?(coder aDecoder: NSCoder)
fatalError("init(coder:) has not been implemented")
extension ColorCollectionView: UICollectionViewDelegateFlowLayout
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
return CGSize(width: collectionView.frame.width / 3, height: 60)
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout,
minimumInteritemSpacingForSectionAt section: Int) -> CGFloat
return CGFloat.leastNormalMagnitude
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat
return 8
extension ColorCollectionView: UICollectionViewDataSource
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
return colors.count
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: ColorCollectionViewCell.identifier, for: indexPath)
let color = colors[indexPath.row]
cell.backgroundColor = color
return cell
class ColorCollectionViewCell: UICollectionViewCell
static let identifier = "ColorCollectionViewCell"
我已经包含了我所有的代码。
更新
视图的宽度:375.0
CollectionView 的宽度:359.0
CollectionVeiwCell 的宽度:119.66666666666667
【问题讨论】:
你是在模拟器还是真机上测试? @CZ54 我都在模拟器真机上测试过了。CGSize(width: collectionView.frame.width / 3, height: 60)
那有什么价值?我猜这是一条“半像素线”(“一半”,在您的情况下是“三分之一”或“三分之二”)。
【参考方案1】:
您应该尝试将 interCellSpacing 设置为以下内容:
self.tableView setIntercellSpacing:NSMakeSize(0, 0)];
看苹果docs。
表格视图通常在连续选择的行或列之间有 1 个像素的间隔。
将单元间距设置为 (0,0) 应该消除单元之间的分隔。
还要检查单元格的绘图代码。您看到的间隙可能是您的单元格子类的边界。您可以覆盖 drawRect(rect:) 方法并在那里设置边框宽度和边框颜色以查看边框是否有问题。所以在你的单元子类中:
override func drawRect(rect: CGRect)
self.layer.borderWidth = 1
self.layer.borderColor = UIColor.redColor().CGColor
希望对你有帮助!
编辑:
您可以尝试直接分配它,而不是直接使用 delegate 方法(我自己尝试过,它对我有用)
if let collectionViewFlowLayout = collection.collectionViewLayout as? UICollectionViewFlowLayout
// the width of your main view or your parent view
let width = UIScreen.main.bounds.width
// what ever item size you need
collectionViewFlowLayout.itemSize = CGSize(width: width / 2, height: width / 2)
// probably you need also to set the section inset
collectionViewFlowLayout.sectionInset = UIEdgeInsets(top: 20, left: 0, bottom: 10, right: 0)
layout
collectionViewFlowLayout.minimumInteritemSpacing = 0
collectionViewFlowLayout.minimumLineSpacing = 0
// assign your collection view layout to your collectionViewFlowLayout
yourCollectionView.collectionViewFlowLayout = collectionViewFlowLayout
【讨论】:
UICollectionView 有 setIntercellSpacing 吗? 可能是这样。我现在还不太确定。我知道它适用于 UITableView。我更新了我的答案。以上是关于iOS - 删除 UICollectionViewCell 之间的垂直空间的主要内容,如果未能解决你的问题,请参考以下文章
从 UICollectionView 中的 UIAttachmentBehavior 中删除振荡
iOS:使用约束动画 UICollectionView 垂直扩展?
iOS 中带有分页的 UICollectionView 的页数