Swift UICollectionView 在点击时显示/隐藏项目

Posted 2023-03-14

【中文标题】Swift UICollectionView 在点击时显示/隐藏项目

【英文标题】：Swift UICollectionView Show/Hide Items on Tap

【发布时间】：2020-10-14 09:03:05

【问题描述】：

在 UICollectionView 中，我想在点击项目时显示/隐藏更多内容。

目前，我通过在情节提要上设计一个更大的单元格来做到这一点，我希望始终在顶部显示 UILabel。当一个项目被点击时，didSelectItemAt() 和 sizeForItemAt() 调用编码为：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) 
        
        selectedIndex = indexPath.item
        
        print("didSelectItemAt: \(selectedIndex)")
        collectionView.reloadItems(at: [indexPath])


func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    
    var size = CGSize()
    size.width = collectionView.frame.width
    size.height = 50
    if let index = selectedIndex 
        print("SizeForItemAt item:\(indexPath.item), \(index)")
        if index == indexPath.item 
            size.height = 150
         else 
            size.height = 50
        
    

    return size

有这个输出（取自 iPhone 模拟器屏幕截图，转换为 GIF）。请注意，当隐藏/减小较高项目的高度时，蓝色框会在较低项目后面显示动画。

有没有更好的方法来实现这个？

【参考方案1】：

您可以通过将 UILabel 添加为 collectionview 部分并将展开/折叠视图添加为行来实现此目的。当用户选择标签时，您可以更改行高

声明节号：

func numberOfSections(in collectionView: UICollectionView) -> Int 
    return 2

在节中声明行数：

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
    if indexPath.section == 0
        return 1
    
    else indexPath.section == 1
        return 1
    
    
    return 0

然后在cellForRowAt中填写您的部分和行

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cellID", for: indexPath) as! CellViewController
        if indexPath.section == 0
           cell.yourLabel.text = "bla bla"
           if indexPath.row == 0
               // You can declare another cell in here
                let blueViewCell = collectionView.dequeueReusableCell(withReuseIdentifier: "blueViewCellID", for: indexPath) as! BlueViewController
           
        
 

在sizeForItemAt函数中

func collectionView(_ collectionView : UICollectionView,layout collectionViewLayout : UICollectionViewLayout,sizeForItemAt indexPath : IndexPath) -> CGSize
     if indexPath.section == 0
          if indexPath.row == 0 
             if firstSectionOpened == true 
               return 50
             else return 0 
            
       
     let width = collectionView.frame.width / CGFloat(4)
        return CGSize(width: width, height: width)
      
          

然后在 didSelect 中

    var firstSectionOpened : Bool = false
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) 
     if indexPath.section == 0 
          if firstSectionOpened == true
             firstSectionOpened = false
           
          else
          firstSectionOpened = true
          
         self.myCollection.reloadData()
        
     

【讨论】：

我不打算使用这些部分。我唯一能看到的是额外的firstSectionOpened Bool。我的方法是检查selectedIndex 变量设置为哪个项目被点击。也许我还需要这个 2nd Bool var 来检查它是否已打开。