Swift 3:以编程方式调整 UICollectionViewCell 的大小会导致单元格重叠
Swift 3: Resizing UICollectionViewCell programmatically causes cells to overlap
我正在尝试创建一个 UICollectionView
,每个单元格之间有 3 个单元格。
这工作正常。当我触摸一个单元格时,这个单元格应该展开,其他单元格应该折叠到特定高度。也工作得很好。
我无法解决的问题;当我点击一个单元格时,它会像我想要的那样展开;它与下面的重叠。下面的那个不会向下移动,为这个单元格的新高度腾出空间。
我该如何解决这个问题?
这是我目前与 UICollectionView
和 UICollectionViewCell
相关的内容
/**
* Tempory 3 items
*/
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 3
}
/**
* Defining the cells
*/
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! LicenseplateCollectionViewCell
cell.backgroundColor = .white
cell.layer.cornerRadius = 4
if(indexPath.row > 0){
cell.carStack.isHidden = true
}
return cell
}
/**
* Initial size
*/
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
// The first cell always start expanded with an height of 300
if(indexPath.row == 0){
return CGSize(width: collectionView.bounds.size.width, height: 300)
}else{
// The others start with an height of 80
return CGSize(width: collectionView.bounds.size.width, height: 80)
}
}
/**
* This functio shoud be handling everything like an accordeon system.
* When I touch one cell, the others should collapse.
*/
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
// Animate resize of cell after tapping
UIView.animate(withDuration: 0.2, animations: {
// For now I have 3 cells, which I will loop
for i in 0...2{
// If this is the active cell (I just tapped on) ...
if(indexPath.row == i){
let cell = collectionView.cellForItem(at: indexPath) as! LicenseplateCollectionViewCell
// This cell is expanded already, collapse it
if(cell.frame.size.height > 200){
cell.carStack.isHidden = true
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 80)
}else{
// Open up this cell
cell.carStack.isHidden = false
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 300)
}
}else{
// Other cells besides the one I just tapped, will be collapsed
print(indexPath.row, indexPath.section)
let customPath = IndexPath(row: i, section: 0)
print(customPath.row, customPath.section)
let cell = collectionView.cellForItem(at: customPath) as! LicenseplateCollectionViewCell
cell.carStack.isHidden = true
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 80)
}
}
})
}
我已经解决了这个问题。
animation/resize 不应出现在 didSelectItemAt
覆盖中。
首先我必须正确定义带有单元格配置的数组。在这里,我添加了一个带有布尔值的键 'active'。
当我点击一个单元格时,我将对象数组中的 'active' 布尔值切换为 true
,然后调用 collectionView.reloadData()
,这将执行 sizeForItemAt
在显示 UICollectionView
之前覆盖。这可确保单元格正确对齐并准确执行它们应执行的操作。
在 sizeForItemAt
中,我 return 基于对象数组中的 'active' 布尔值的适当高度。
我正在尝试创建一个 UICollectionView
,每个单元格之间有 3 个单元格。
这工作正常。当我触摸一个单元格时,这个单元格应该展开,其他单元格应该折叠到特定高度。也工作得很好。
我无法解决的问题;当我点击一个单元格时,它会像我想要的那样展开;它与下面的重叠。下面的那个不会向下移动,为这个单元格的新高度腾出空间。
我该如何解决这个问题?
这是我目前与 UICollectionView
和 UICollectionViewCell
/**
* Tempory 3 items
*/
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 3
}
/**
* Defining the cells
*/
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! LicenseplateCollectionViewCell
cell.backgroundColor = .white
cell.layer.cornerRadius = 4
if(indexPath.row > 0){
cell.carStack.isHidden = true
}
return cell
}
/**
* Initial size
*/
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
// The first cell always start expanded with an height of 300
if(indexPath.row == 0){
return CGSize(width: collectionView.bounds.size.width, height: 300)
}else{
// The others start with an height of 80
return CGSize(width: collectionView.bounds.size.width, height: 80)
}
}
/**
* This functio shoud be handling everything like an accordeon system.
* When I touch one cell, the others should collapse.
*/
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
// Animate resize of cell after tapping
UIView.animate(withDuration: 0.2, animations: {
// For now I have 3 cells, which I will loop
for i in 0...2{
// If this is the active cell (I just tapped on) ...
if(indexPath.row == i){
let cell = collectionView.cellForItem(at: indexPath) as! LicenseplateCollectionViewCell
// This cell is expanded already, collapse it
if(cell.frame.size.height > 200){
cell.carStack.isHidden = true
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 80)
}else{
// Open up this cell
cell.carStack.isHidden = false
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 300)
}
}else{
// Other cells besides the one I just tapped, will be collapsed
print(indexPath.row, indexPath.section)
let customPath = IndexPath(row: i, section: 0)
print(customPath.row, customPath.section)
let cell = collectionView.cellForItem(at: customPath) as! LicenseplateCollectionViewCell
cell.carStack.isHidden = true
cell.frame.size = CGSize(width: collectionView.bounds.size.width, height: 80)
}
}
})
}
我已经解决了这个问题。
animation/resize 不应出现在 didSelectItemAt
覆盖中。
首先我必须正确定义带有单元格配置的数组。在这里,我添加了一个带有布尔值的键 'active'。
当我点击一个单元格时,我将对象数组中的 'active' 布尔值切换为 true
,然后调用 collectionView.reloadData()
,这将执行 sizeForItemAt
在显示 UICollectionView
之前覆盖。这可确保单元格正确对齐并准确执行它们应执行的操作。
在 sizeForItemAt
中,我 return 基于对象数组中的 'active' 布尔值的适当高度。