如何将静态单元格拖入 tableView swift?

How to drag a static cell into tableView swift?

我的故事板中有一个 tableView,我在其中添加了 4 个静态单元格,我的故事板看起来像:

我没有此 tableView 的任何数据源,因为我的单元格是静态的。

我使用下面的代码拖动一个单元格,它工作正常,直到我滚动 table。

import UIKit

class TableViewController: UITableViewController {

    var sourceIndexPath: NSIndexPath = NSIndexPath()
    var snapshot: UIView = UIView()
    let longPress: UILongPressGestureRecognizer = {
        let recognizer = UILongPressGestureRecognizer()
        return recognizer
        }()

    override func viewDidLoad() {
        super.viewDidLoad()

        longPress.addTarget(self, action: "longPressGestureRecognized:")
        self.tableView.addGestureRecognizer(longPress)

        self.tableView.allowsSelection = false
    }

    override func viewWillAppear(animated: Bool) {

        self.tableView.reloadData()
    }

    // MARK: UIGestureRecognizer
    func longPressGestureRecognized(gesture: UILongPressGestureRecognizer){

        let state: UIGestureRecognizerState = gesture.state
        let location:CGPoint = gesture.locationInView(self.tableView)
        if let indexPath: NSIndexPath = self.tableView.indexPathForRowAtPoint(location){

            switch(state){

            case UIGestureRecognizerState.Began:
                sourceIndexPath = indexPath

                let cell: UITableViewCell = self.tableView .cellForRowAtIndexPath(indexPath)!

                //take a snapshot of the selected row using helper method
                snapshot = customSnapshotFromView(cell)

                //add snapshot as subview, centered at cell's center
                var center: CGPoint = cell.center
                snapshot.center = center
                snapshot.alpha  = 0.0
                self.tableView.addSubview(snapshot)
                UIView.animateWithDuration(0.25, animations: { () -> Void in
                    center.y = location.y
                    self.snapshot.center = center
                    self.snapshot.transform = CGAffineTransformMakeScale(1.05, 1.05)
                    self.snapshot.alpha = 0.98
                    cell.alpha = 0.0
                    }, completion: { (finished) in
                        cell.hidden = true
                })

            case UIGestureRecognizerState.Changed:
                let cell: UITableViewCell = self.tableView.cellForRowAtIndexPath(indexPath)!

                var center: CGPoint = snapshot.center
                center.y = location.y
                snapshot.center = center
                print("location \(location.y)")

                //is destination valid and is it different form source?
                if indexPath != sourceIndexPath{
                    //update data source
                    //I have commented this part because I am not using any dataSource.
//                    self.customArray.exchangeObjectAtIndex(indexPath.row, withObjectAtIndex: sourceIndexPath.row)
                    //move the row
                    self.tableView.moveRowAtIndexPath(sourceIndexPath, toIndexPath: indexPath)
                    //and update source so it is in sync with UI changes
                    sourceIndexPath = indexPath
                }

                if (location.y < 68) || (location.y > 450) {
                    print("cancelled")
                    self.snapshot.alpha = 0.0
                    cell.hidden = false
                    UIView.animateWithDuration(0.10, animations: { () -> Void in

                        self.snapshot.center = cell.center
                        self.snapshot.transform = CGAffineTransformIdentity
                        self.snapshot.alpha = 0.0
                        //undo fade out
                        cell.alpha = 1.0

                        }, completion: { (finished) in
                            self.snapshot.removeFromSuperview()
                    })
                }

            case UIGestureRecognizerState.Ended:
                //clean up
                print("ended")
                let cell: UITableViewCell = tableView.cellForRowAtIndexPath(indexPath)!
                cell.hidden = false

                UIView.animateWithDuration(0.25, animations: { () -> Void in

                    self.snapshot.center = cell.center
                    self.snapshot.transform = CGAffineTransformIdentity
                    self.snapshot.alpha = 0.0
                    //undo fade out
                    cell.alpha = 1.0

                    }, completion: { (finished) in
                        self.snapshot.removeFromSuperview()
                })
                break

            default:
                break
            }
        }else{
            gesture.cancelsTouchesInView = true
        }
    }

    func customSnapshotFromView(inputView: UIView) -> UIView {

        // Make an image from the input view.
        UIGraphicsBeginImageContextWithOptions(inputView.bounds.size, false, 0)
        inputView.layer.renderInContext(UIGraphicsGetCurrentContext()!)
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext();

        // Create an image view.
        let snapshot = UIImageView(image: image)
        snapshot.layer.masksToBounds = false
        snapshot.layer.cornerRadius = 0.0
        snapshot.layer.shadowOffset = CGSize(width: -5.0, height: 0.0)
        snapshot.layer.shadowRadius = 5.0
        snapshot.layer.shadowOpacity = 0.4

        return snapshot
    }

}

拖动后滚动时看起来像:

如您所见,单元格没有再次出现。我想拖放静态单元格,我想保存它的位置,这样我在滚动时就不会再次重新排列。

Sample 项目以获取更多信息。

这只是一个演示项目,但我在我的单元格中添加了很多元素,每个单元格都有不同的 UI。

有一个库可以使用非常相似的方法完全满足您的需求。它称为 FMMoveTableView 但它适用于具有数据源的单元格。

我认为导致您出现问题的原因是,当您四处移动单元格然后滚动时,故事板中的数据源不再与 table 同步,因此您的单元格对象无法重新绘制。

我认为你应该这样实现你的table:

  1. 制作您的 4 个单元格自定义单元格。
  2. 每个子类。
  3. 创建一个包含数字 1 到 4 的数组
  4. 长拖时对数组重新排序
  5. 覆盖 cellForRowAtIndexPath 以显示正确数字的正确单元格

您可以创建多个动态单元格。 您只需要使用正确的标识符使单元格出列。

您这样做只是为了布局目的,也许 UICollectionView 或定制的 UIScrollView 可以完成这项工作?


不过,我有办法:

  1. 创建一个包含所有静态 UITableViewCells
  2. 的 IBOutlet 集合
  3. 创建一个索引列表来模拟"data source"
  4. 覆盖 cellForRowAtIndexPath 以使用您自己的索引列表进行绘制
  5. 更新列表顺序时,更新indexList,使视图"remembers"发生这种变化

这个 Table 视图控制器解释了一切:

class TableViewController: UITableViewController {

  @IBOutlet var outletCells: [UITableViewCell]!
  var indexList = [Int]()

  override func viewDidLoad() {
    super.viewDidLoad()
    // Prepare a index list.
    // We will move positions in this list instead
    // of trying to move the view's postions.
    for (index, _) in outletCells.enumerate() {
      indexList.append(index)
    }
  }

  override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    // Use dynamic count, not needed I guess but
    // feels better this way.
    return outletCells.count
  }

  override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    // Use the index path to get the true index and return
    // the view on that index in our IBOutlet collection
    let realIndexForPos = indexList[indexPath.row]
    return outletCells[realIndexForPos]
  }

  @IBAction func onTap(sender: AnyObject) {
    // Simulating your drag n drop stuff here... :)
    let swapThis = 1
    let swapThat = 2

    tableView.moveRowAtIndexPath(NSIndexPath(forItem: swapThis, inSection: 0), toIndexPath: NSIndexPath(forItem: swapThat, inSection: 0))

    // Update the indexList as this is the "data source"
    // Do no use moveRowAtIndexPath as this is never triggred
    // This one line works: swap(&indexList[swapThis], &indexList[swapThat])
    // But bellow is easier to understand
    let tmpVal = indexList[swapThis]
    indexList[swapThis] = indexList[swapThat]
    indexList[swapThat] = tmpVal
  }
}

要创建 IBOutlet,请使用 Interface Builder。 在每个 Table View Cell 上使用 Referencing Outlet Collection 并将每个视图单元格拖到控制器代码中的相同 @IBOutlet

您可以从 uitableview delegates 拖动 uitableview cell ...... 1) 在其委托中将 table 视图编辑样式设置为 none。

2) 实施 table 视图委托以启用单元格拖动,即 canMoveRowAtIndexPath 方法...