Question

我已经按照here所述实现了一个集合视图。正如您所看到的，它使用iOS 9中提供的集合视图的单元格的交互式重新排序。但问题是，我无法控制单元格的重新排序。

说细胞是这样的 -

1  2  3  4
5  6  7  8
9  10 11 12

我想只交换单元格6和4.因此在重新排序后，单元格将是

1  2  3  6
5  4  7  8
9  10 11 12

在这里，在教程中，在程序的开头，集合视图是这样的 -

如果我将星巴克置于 Rose Tyler 之上，则会发生这种情况 -

请注意 Sarah Connor 的地方是星巴克。

我想控制单元格的重新排序，这样就可以交换 Rose Tyler 和 Starbuck 位置。

我该怎么做？

Answer 1

简单的解决方案是实现您自己的交互式单元格排序行为，只需在屏幕上沿着平移移动单元格，并在手势结束时在另一个单元格的位置（使用您自己的动画和数据源更新）进行交换。这是一个工作样本：

class ViewController: UIViewController, UICollectionViewDataSource {

    var arr: [String] = (0...100).map { return "\($0)" }

    lazy var collectionView: UICollectionView =  {
        let layout = UICollectionViewFlowLayout()
        let cv: UICollectionView = UICollectionView(frame: self.view.bounds, collectionViewLayout: layout)
        cv.register(Cell.self, forCellWithReuseIdentifier: Cell.id)
        layout.itemSize = CGSize(width: view.bounds.width/3.5, height: 100)
        cv.dataSource = self
        cv.addGestureRecognizer(longPressGesture)
        return cv
    }()

    lazy var longPressGesture: UILongPressGestureRecognizer = UILongPressGestureRecognizer(target: self, action: #selector(self.handleLongGesture(gesture:)))

    private var movingCell: MovingCell?

    override func viewDidLoad() {
        super.viewDidLoad()
        view = collectionView
    }

    @objc func handleLongGesture(gesture: UILongPressGestureRecognizer) {

        var cell: (UICollectionViewCell?, IndexPath?) {
            guard let indexPath = collectionView.indexPathForItem(at: gesture.location(in: collectionView)),
                let cell = collectionView.cellForItem(at: indexPath) else { return (nil, nil) }
            return (cell, indexPath)
        }

        switch(gesture.state) {

        case .began:
            movingCell = MovingCell(cell: cell.0, originalLocation: cell.0?.center, indexPath: cell.1)
            break
        case .changed:

            /// Make sure moving cell floats above its siblings.
            movingCell?.cell.layer.zPosition = 100
            movingCell?.cell.center = gesture.location(in: gesture.view!)

            break
        case .ended:

            swapMovingCellWith(cell: cell.0, at: cell.1)
            movingCell = nil
        default:
            movingCell?.reset()
            movingCell = nil
        }
    }

    func swapMovingCellWith(cell: UICollectionViewCell?, at indexPath: IndexPath?) {
        guard let cell = cell, let moving = movingCell else {
            movingCell?.reset()
            return
        }

        // update data source
        arr.swapAt(moving.indexPath.row, indexPath!.row)

        // swap cells
        animate(moving: moving.cell, to: cell)
    }

    func animate(moving movingCell: UICollectionViewCell, to cell: UICollectionViewCell) {
        longPressGesture.isEnabled = false

        UIView.animate(withDuration: 0.4, delay: 0, usingSpringWithDamping: 0.1, initialSpringVelocity: 0.7, options: UIViewAnimationOptions.allowUserInteraction, animations: {
            movingCell.center = cell.center
            cell.center = movingCell.center
        }) { _ in
            self.collectionView.reloadData()
            self.longPressGesture.isEnabled = true
        }
    }

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell: Cell = collectionView.dequeueReusableCell(withReuseIdentifier: Cell.id, for: indexPath) as! Cell
        cell.titleLable.text = arr[indexPath.row]
        return cell
    }

    private struct MovingCell {
        let cell: UICollectionViewCell
        let originalLocation: CGPoint
        let indexPath: IndexPath

        init?(cell: UICollectionViewCell?, originalLocation: CGPoint?, indexPath: IndexPath?) {
            guard cell != nil, originalLocation != nil, indexPath != nil else { return nil }
            self.cell = cell!
            self.originalLocation = originalLocation!
            self.indexPath = indexPath!
        }

        func reset() {
            cell.center = originalLocation
        }
    }

    final class Cell: UICollectionViewCell {
        static let id: String = "CellId"

        lazy var titleLable: UILabel = UILabel(frame: CGRect(x: 0, y: 20, width: self.bounds.width, height: 30))

        override init(frame: CGRect) {
            super.init(frame: frame)
            addSubview(titleLable)
            titleLable.backgroundColor = .green
            backgroundColor = .white
        }

        required init?(coder aDecoder: NSCoder) {
            super.init(coder: aDecoder)
        }
    }
}

Answer 2

对于集合视图项的重新排序，我们需要在集合视图上添加长按手势。并且为了重新排序具有特定indexPath的集合View项，UICollectionViewDelegate提供了“targetIndexPathForMoveFromItemAt”方法。要获得完整的教程，请按照Reordering CollectionView Item

进行操作

Answer 3

我会按以下步骤做...

第一步创建一个这样的模型

class CrewMembersModel {
    var name: String?
    var position: Int?

    fileprivate init (name: String, position: Int) {
        self.name = name
        self.position = position
    }

    static var crewMembersDataList: [CrewMembersModel]? = nil

    class func getMembersList() -> [CrewMembersModel] {
        if (self.crewMembersDataList == nil) {
            self.crewMembersDataList = [CrewMembersModel]()
            self.crewMembersDataList?.append(CrewMembersModel(name: "Sam Carter", position: 0))
            self.crewMembersDataList?.append(CrewMembersModel(name: "Dana Scully", position: 1))
            self.crewMembersDataList?.append(CrewMembersModel(name: "Rose Taylor", position: 2))
            self.crewMembersDataList?.append(CrewMembersModel(name: "Sarah Conor", position: 3))
            self.crewMembersDataList?.append(CrewMembersModel(name: "Starbuck", position: 4))
            self.crewMembersDataList?.append(CrewMembersModel(name: "River Tam", position: 5))
            self.crewMembersDataList?.append(CrewMembersModel(name: "Sarah Jane", position: 6))

        }
        return crewMembersDataList!.sorted(by: { $0.position! < $1.position!})
    }
}

请注意 在这里，您可以添加模型的其他属性，如图像等...

第二步在ViewController viewDidLoad方法中获取模型列表

self.crewMembersDataList = CrewMembersModel.getMembersList()

第3步在func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell解析模型数据

中

let crewMembersData: CrewMembersModel = self.crewMembersDataList[indexPath.row - 1]
cell.name = crewMembersData.name!

最后在第4步中，每当您进行更改时，都会更改所选单元格的位置并调用collectionView.reloadData（）

func changePositions(selectedModelOne: CrewMembersModel, selectedModelTwo: CrewMembersModel) {
    let tmpPosition = selectedModelOne.position!
    selectedModelOne.position = selectedModelTwo.position!
    selectedModelTwo.position = tmpPosition

    self.crewMembersDataList.sorted(by: { $0.position! < $1.position!})
    self.collectionView.reloadData()
}

请注意我没有检查整个代码，可能是一些语法问题

Answer 4

听起来好像你只是移动一个物体，或者你的情况是星巴克。

当你这样做时，列表将重新排序;基于此，Rose Tyler将在逻辑上处于你所展示的位置。

如果您将其视为主题公园中的骑行队列，那么您展示的行为就非常有意义。 Sam，Dana和Rose排在第二位和第三位，Sarah，Starbuck和River排名第四，第五和第六位。如果罗斯然后让星巴克走在她面前，那么罗斯排在第四位，莎拉现在排在第五位。

为了得到你想要的东西，你需要保留Rose在列表中的位置以及Starbuck在列表中的位置。然后，您需要移动每个需要逐个移动的人，而不是像当前那样移动星巴克。

Answer 5

UICollectionView *collection;
MSMutableArray *datasource;
NSIndexPath *from = [NSIndexPath indexPathForItem:0 inSection:0];
NSIndexPath *to = [NSIndexPath indexPathForItem:1 inSection:0];

// swap animated
[collection performBatchUpdates:^{
    // To avoid problems, you should update your data model inside the updates block 
    [datasource exchangeObjectAtIndex:from.item withObjectAtIndex:to.item];
    // for swap need two move operations
    [collection moveItemAtIndexPath:from toIndexPath:to];
    [collection moveItemAtIndexPath:to toIndexPath:from];
    // no need to update the moved cells because the content has not changed
    //[collection reloadSections:[NSIndexSet indexSetWithIndex:0]];
} completion:^(BOOL finished) {

}];

Collectionview交互式单元交换

5 个答案: