Swift：使用collectionView创建imageView堆栈

Question

嘿，我想像照片一样创建dsadd user “cn=USERNAME,OU=XXXX,DC=XXXX,DC=XXX” -fn "FIRSTNAME" -ln "LASTNAME" -pwd PASSWORD -upn USERNAME@XXXX.XXX -pwdneverexpires yes -company "COMPANY" 的堆栈，如何执行此操作 它必须是动态的。我该如何移动单元格，使它们在另一个单元格之下？

Answer 1

使用class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout { @IBOutlet weak var collectionView: UICollectionView! override func viewDidLoad() { super.viewDidLoad() } func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 3 } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) cell.layer.borderWidth = 2.0 cell.layer.borderColor = UIColor.white.cgColor cell.layer.cornerRadius = 50.0 return cell } func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { return CGSize(width: collectionView.bounds.height, height: collectionView.bounds.height) } func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat { return 0 } func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat { return -50 } } 方法制作这种UI。

示例：

minimumLineSpacingForSectionAt

在上面的代码中

1. 配置minimumInteritemSpacingForSectionAt的{​​{1}}和UICollectionViewDelegateFlowLayout方法。

2. 由于collectionView中的单元格默认对齐left to right，因此要获得理想的结果，我们需要将它们对齐right to left。

如上面的屏幕快照所示，将semantic的{​​{1}}属性用于单元格的collectionView对齐。

截屏：

编辑1：

在right to left中将单元格居中的一种方法是与collectionView collectionView's和width一起玩。

CollectionView约束-centre it horizontally

在top, width, centeredorizontally中，根据viewDidAppear手动计算width的{​​{1}}。就您而言，collectionView

numberOfItems

Answer 2

您可以使用UICollectionView自定义布局。

  

集合视图布局是抽象UICollectionViewLayout类的子类。它们定义了集合视图中每个项目的视觉属性。各个属性是UICollectionViewLayoutAttributes的实例，并包含您的集合视图中每个项目的属性，例如项目的框架或变换。

     

The similar Tutorial

这是一个更复杂的布局，更改一些参数，您将获得所需的内容。

从github复制，mpospese/IntroducingCollectionViews

将一些翻译成Swift

class SpiralLayout: UICollectionViewLayout{
    let itemSize: CGFloat = 170

    var pageSize: CGSize!
    var contentSize: CGSize!
    var radius: CGFloat!
    var cellCounts: [Int]!
    var pageRects: [CGRect]!

    var pageCount: Int!

    override func prepare() {
        super.prepare()
        pageSize = collectionView?.bounds.size
        let iPad = UIDevice.current.userInterfaceIdiom == UIUserInterfaceIdiom.pad

        let scaleFactor: CGFloat = iPad ? 1 : 0.5
        let side = itemSize * scaleFactor
        radius = min(pageSize.width - side, pageSize.height - side * 1.2 )/2 - 5
        pageCount = collectionView?.numberOfSections
        var counts = [Int]()
        var rects = [CGRect]()
        for section in 0..<pageCount{
            counts.append((collectionView?.numberOfItems(inSection: section))!)
            rects.append(CGRect(origin:  CGPoint(x: CGFloat(section) * pageSize.width, y: 0), size: pageSize))
        }
        cellCounts = counts
        pageRects = rects
        contentSize = CGSize(width: pageSize.width * CGFloat(pageCount), height: pageSize.height)

    }


    override var collectionViewContentSize: CGSize{
        return contentSize
    }

    override func shouldInvalidateLayout(forBoundsChange newBounds: CGRect) -> Bool {
        return !pageSize.equalTo(newBounds.size)
    }


    func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
        var attributes = UICollectionViewLayoutAttributes(forCellWith: indexPath)
        attributes.size = CGSize(width: itemSize, height: itemSize)

        //  ...

        return  attributes
    }


}