如何使集合视图标题和单元格的大小相同

问题描述：

我创建了具有多个部分的集合视图。我希望标题视图和集合视图单元格的大小相同。如何使集合视图标题和单元格的大小相同

我已经试过几件事情：

在集合视图，这似乎对细胞或头部没有效果设置插图。
改变referenceSizeForHeaderInSection这也似乎没有任何效果。
更改了与可重用视图关联的Xib视图的大小。
从顶部，左侧，右侧和底部约束的XIB内的UILabel为0，并设置宽度300，但这似乎被重写（见下文，在图片中的涂黑的区域是应用程序名称）。

下面是我的一些方法：

viewDidLoad中

override func viewDidLoad() { 
    super.viewDidLoad() 
    collectionView.delegate = self 
    collectionView.dataSource = self 

    collectionView.contentInset = UIEdgeInsets(top: 30, left: 30, bottom: 0, right: 30) 

    collectionViewHeightAnchor.constant = view.frame.height/2 

    let nib = UINib(nibName: "CollectionReusableView", bundle: nil) 
    collectionView.register(nib, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "groceryHeader") 
}

Collection视图委托/数据源和头设置

// MARK: - Header 

func numberOfSections(in collectionView: UICollectionView) -> Int { 
    return foodItems.count 
} 

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize { 
    return CGSize(width: 120, height: 45) 
} 

func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView { 
    let (key, _) = foodItems[indexPath.section] 
    let cell = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "groceryHeader", for: indexPath) as! CollectionReusableView 
    cell.lbl.text = key 

    return cell 
} 



// MARK: - Cell 

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { 
    return foodItems[section].1.count 
} 

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize { 
    return CGSize(width: 120, height: 45) 
} 

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { 
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "foodCell", for: indexPath) 
    if let cell = cell as? FoodItemCell { 
     let (_, val) = foodItems[indexPath.section] 
     cell.titleLbl.text = val[indexPath.row].text 
     cell.quantityLbl.text = val[indexPath.row].quantity 
     cell.postId = val[indexPath.row].id 

     if let arr = UserDefaults.standard.getCheckedIds() { 
      cell.checkBoxImg.setImage(arr.contains(val[indexPath.row].id) ? UIImage(named: "checked") : UIImage(named: "unchecked"), for: .normal) 
     } 
    } 
    return cell 
}

预先感谢您。

答

听起来像是你需要你的标题的宽度是一定的规模。 UICollectionViewFlowLayout的默认值是填充集合视图的宽度。

你这里有几个选项：

1）创建一个大小在所需大小的补充意见（头）自定义布局。这可能被认为是“正确的”选项，但可能比您需要的更复杂。

2）只要你想要的大小（120）和中心X添加的“容器”视图页眉视图中，设置宽度与母体。如果根集合视图元素（UICollectionReusabableView）是透明的，它不会显示离开您的子视图（“容器”）作为唯一可见视图。

3）除非你使用UICollectionViewController你可以只集合视图的宽度设置为你想要的大小（120）。如果您使用UICollectionViewController，你可以与一个UIViewController更换，添加UICollectionView并设置DataSource和委托给的UIViewController。通过这种方式，默认流布局下的标题将填充cv，该cv只能根据需要放大。

谢谢你，这已经完成了。 –

如何使集合视图标题和单元格的大小相同

相关推荐