如何将 UICollectionViewFlowLayout 中的按钮居中放置两列？可能有更有效的方法来解决这个问题吗？

Question

我正在实现一个菜单，它在两列中包含多个按钮，我希望按钮文本在每个单元格的中间居中。

这是现在的样子：

这是我的代码 ViewController:

import SideMenu
import UIKit

class ViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {

    @IBOutlet weak var collectionView: UICollectionView!
    var button_titles : [String] = ["Action", "KnowHow", "Beginner", "Expert", "Level Up", "What is", "How to use", "Home"]
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.title = "Prana Power"
        collectionView.delegate = self
        collectionView.dataSource = self
        
        self.collectionView.register(UINib(nibName: "ButtonCollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "ButtonMainMenu")
    }
      
    override func viewWillAppear(_ animated: Bool) {
         super.viewWillAppear(animated)
         //collection.reloadData()
     }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let flowayout = collectionViewLayout as? UICollectionViewFlowLayout
        let space: CGFloat = (flowayout?.minimumInteritemSpacing ?? 0.0) + (flowayout?.sectionInset.left ?? 0.0) + (flowayout?.sectionInset.right ?? 0.0)
        let size:CGFloat = (collectionView.frame.size.width - space) / 2.0
        return CGSize(width: size, height: size)
    }
    

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return button_titles.count
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "ButtonMainMenu", for: indexPath) as? ButtonCollectionViewCell else { return UICollectionViewCell()}
        cell.btnClick.setTitle(button_titles[indexPath.item], for: .normal)
        cell.btnClick.titleLabel!.font = UIFont(name: "HelveticaNeue-Thin", size: 20)
        cell.backgroundColor = UIColor.lightGray
        return cell
    }
    
    
    }

所以按钮在我的 ButtonCollectionViewCell 情节提要中居中，正如在 debug view hierarchy 中看到的那样，但不在外部单元格中：

我已将集合视图的插图设置为：

我尝试使用的第二个答案作为解决方案：

func centerItemsInCollectionView(cellWidth: Double, numberOfItems: Double, spaceBetweenCell: Double, collectionView: UICollectionView) -> UIEdgeInsets {
    let totalWidth = cellWidth * numberOfItems
    let totalSpacingWidth = spaceBetweenCell * (numberOfItems - 1)
    let leftInset = (collectionView.frame.width - CGFloat(totalWidth + totalSpacingWidth)) / 2
    let rightInset = leftInset
    return UIEdgeInsets(top: 0, left: leftInset, bottom: 0, right: rightInset)
}

当我运行之后的代码似乎对我的观点没有影响。我试图将函数更改为

    func centerItemsInCollectionView(cellWidth: Double, numberOfItems: Double, spaceBetweenCell: Double, collectionView: UICollectionView) -> UIEdgeInsets {
        return UIEdgeInsets(top: 15, left: 15, bottom: 15, right: 15)
    }

检查它是否有任何影响，但在重新启动应用程序后一切都一样。

阅读 this post 后，我得到提示，我可能必须设置 minimumInteritemSpacing。我试图在我的 collectionView 函数中设置 flowayout?.minimumInteritemSpacing = 6 以返回 CGSize 但没有任何效果。

所以我的两个问题是：

有没有更简单的方法来实现我想要的布局？由于我对 iOS 和 swift 比较了解，所以我不太熟悉创建布局的所有可能性。
如何在当前代码中解决我的问题？

如果您对这个问题有任何提示、解决方案或见解，请告诉我。提前致谢！

Answer 1

使用故事板自动加载。您肯定有 约束冲突。

     |
-  Button -
     |

如何将 UICollectionViewFlowLayout 中的按钮居中放置两列？可能有更有效的方法来解决这个问题吗？

How can I center Buttons within UICollectionViewFlowLayout for two columns? Might there be a more efficient way to solve this?

ios

swift

uicollectionviewcell

uicollectionviewflowlayout

uiedgeinsets