[英]Swift - How to fill collectionview with cells
I would like to fill my collectionview with cells. 我想用单元格填充我的collectionview。 So I sized them differently but they should fit next to each other. 因此,我调整了它们的大小,但它们应该彼此相邻。 My current situation is following: 我目前的情况如下:
I would like to have the cells next to eachother. 我想让细胞彼此相邻。 As following: 如下:
My Collectionview-Class looks as following: 我的Collectionview-Class如下所示:
class OverviewViewController: UICollectionViewController, UICollectionViewDelegateFlowLayout {
override func viewDidLoad() {
super.viewDidLoad()
setupCollection()
setupView()
}
private func setupCollection() {
self.collectionView!.register(GoalCell.self, forCellWithReuseIdentifier: goalCellIdentifier)
self.collectionView?.dataSource = self
self.collectionView?.delegate = self
self.collectionView?.backgroundColor = .white
}
private func setupView() {
self.navigationItem.title = "Goals"
if #available(iOS 11.0, *) {
self.navigationController?.navigationBar.prefersLargeTitles = true
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
override func numberOfSections(in collectionView: UICollectionView) -> Int {
return 1
}
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return DataProvider.sharedInstance.getGoals().count
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: goalCellIdentifier, for: indexPath) as! GoalCell
cell.goalEntry = DataProvider.sharedInstance.getGoals()[indexPath.row]
cell.setup()
return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
let cellHeight = UIScreen.main.bounds.height / 4.0 - 20
let cellWidth = UIScreen.main.bounds.width / 3.0 - 1.0
let cell = DataProvider.sharedInstance.getGoals()[indexPath.row]
switch cell.type! {
case GoalType.daily:
return CGSize(width: cellWidth, height: cellHeight)
case GoalType.yearly:
return CGSize(width: cellWidth * 2, height: cellHeight * 2)
case GoalType.lifely:
return CGSize(width: cellWidth * 3, height: cellHeight * 3)
}
}
I initialized my collectionview with following code: 我使用以下代码初始化了collectionview:
let overviewFlowLayout = UICollectionViewFlowLayout()
overviewFlowLayout.minimumLineSpacing = 0.0
overviewFlowLayout.minimumInteritemSpacing = 0.0
let overviewVC = OverviewNavViewController(rootViewController: OverviewViewController(collectionViewLayout: overviewFlowLayout))
I really don't know what to do anymore... I hope someone can help me a little! 我真的不知道该怎么办...我希望有人能帮我一点忙! Thanks! 谢谢!
You are using UICollectionViewFlowLayout, which doesn't work the way you have in mind. 您正在使用UICollectionViewFlowLayout,这与您的想法不符。 To get the kind of layout shown in your second screen shot, you would have to write your own layout class. 要获得第二个屏幕快照中显示的布局类型,您必须编写自己的布局类。
您将必须实现自己的自定义collectionViewLayout ,或者您可能尝试找到现成的开源解决方案,也许CHTCollectionViewWaterfallLayout可能与您要寻找的足够接近。
Eventually You need to use flowlayout,you can't use constrains for collectionviewcell in storyboard, 最终,您需要使用流布局,不能在情节提要中为collectionviewcell使用约束,
This function will make custom cells sizes with boundaries,i used mine to present 2 cells in a row 此功能将使自定义单元格的大小带有边界,我用我连续显示了2个单元格
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
let paddomg:CGFloat = 25
let collectionviewsize = collectionView.frame.size.width - paddomg
return CGSize(width: collectionviewsize/2 ,height: 120)
}
If i were you i would use two custom cells, and based on index i would assign sizes and position in viewlayout 如果我是你,我将使用两个自定义单元格,并根据索引我将在视图布局中分配大小和位置
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.