如何在选择Swift 3.0上缩放UICollectionViewCell？

Question

这里我尝试在图像中显示选择UICollectionViewCell。我尝试将边框添加到所选单元格，边框位于单元格内容视图中。这是我的尝试：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    let cell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    let borderWidth: CGFloat = 6
    cell?.contentView.frame = (cell?.labelBackground.frame.insetBy(dx: +borderWidth, dy: +borderWidth))!
    cell?.contentView.layer.borderColor = cell?.backgroundColor?.cgColor
    cell?.contentView.layer.borderWidth = borderWidth
}

func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
    let cell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    let borderWidth: CGFloat = 0
    cell?.contentView.frame = (cell?.labelBackground.frame.insetBy(dx: +borderWidth, dy: +borderWidth))!
    cell?.contentView.layer.borderColor = UIColor.clear.cgColor
    cell?.contentView.layer.borderWidth = borderWidth

}

怎么做？

Answer 1

只需使用变换比例缩放选定的单元格，而不是为所选单元格添加边框宽度。在didSelect：

中编写此代码

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    let selectedCell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    priorityCollectionView.bringSubview(toFront: selectedCell!)

    UIView.animate(withDuration: 0.2, delay: 0, usingSpringWithDamping: 5, initialSpringVelocity: 0, options: [], animations: { 
        selectedCell?.transform = CGAffineTransform(scaleX: 1.2, y: 2)
        })  
}

在didDeselect中：

func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
    let unselectedCell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    UIView.animate(withDuration: 0.2, delay: 0, usingSpringWithDamping: 5, initialSpringVelocity: 0, options: [], animations: {
        unselectedCell?.transform = .identity
    })
}

结果：

Answer 2

如果要跟踪选择，则需要执行以下操作：

修改您的单元格类BCPriorityListCollectionViewCell并添加选择属性：

var isSelected: Bool = false

然后在cellForItemAtIndexPath中添加if语句来检测是否选择了该单元格，如下所示：

let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath)
if (cell.isSelected) {
    priorityCollectionView.bringSubview(toFront: cell)

    UIView.animate(withDuration: 0.2, delay: 0, usingSpringWithDamping: 5, initialSpringVelocity: 0, options: [], animations: { 
        cell.transform = CGAffineTransform(scaleX: 1.2, y: 2)
    })  
}

然后在didSelectItemAt中添加一行以设置选择属性：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    let selectedCell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    priorityCollectionView.bringSubview(toFront: selectedCell!)

    UIView.animate(withDuration: 0.2, delay: 0, usingSpringWithDamping: 5, initialSpringVelocity: 0, options: [], animations: { 
        selectedCell?.transform = CGAffineTransform(scaleX: 1.2, y: 2)
    })  
    selectedCell?.isSelected = true
}

也在didDeselectItemAt中添加确切的行，但具有false值：

func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
    let unselectedCell = priorityCollectionView.cellForItem(at: indexPath)  as? BCPriorityListCollectionViewCell
    UIView.animate(withDuration: 0.2, delay: 0, usingSpringWithDamping: 5, initialSpringVelocity: 0, options: [], animations: {
        unselectedCell?.transform = .identity
})
    unselectedCell?.isSelected = false
}

这样，如果您滚动到收藏夹视图的末尾，就不会丢失所选单元格的状态！

Answer 3

您可以使用滚动视图来放大和缩小collectionView中的图片

在Collectoinview单元格中添加滚动视图，并在滚动视图中添加图像视图。

然后在collectioncell文件中（这是单元文件的类型，在主viewcontroller中调用）声明滚动视图和图像视图的出口 我在单元格文件中将其声明为scr（scrollview）和zoomedImage（ImageView）。...

class FinalImageCollectionViewCell: UICollectionViewCell , UIScrollViewDelegate {

@IBOutlet weak var zoomedImage: UIImageView!
@IBOutlet weak var scr: UIScrollView!  

override func awakeFromNib() {
    self.scr.delegate = self

    let doubleTapGest = UITapGestureRecognizer(target: self, action: #selector(handleDoubleTapScrollView(recognizer:)))
    doubleTapGest.numberOfTapsRequired = 2
    scr.addGestureRecognizer(doubleTapGest)
}
func viewForZooming(in scrollView: UIScrollView) -> UIView? {
    return zoomedImage!
}
@objc func handleDoubleTapScrollView(recognizer: UITapGestureRecognizer) {
    if scr.zoomScale == 1 {
        scr.zoom(to: zoomRectForScale(scale: scr.maximumZoomScale, center: recognizer.location(in: recognizer.view)), animated: true)
    }
    else {
        scr.setZoomScale(1, animated: true)
    }
}
func zoomRectForScale(scale: CGFloat, center: CGPoint) -> CGRect {
    var zoomRect = CGRect.zero
    zoomRect.size.height = zoomedImage.frame.size.height / scale
    zoomRect.size.width  = zoomedImage.frame.size.width  / scale
    let newCenter = zoomedImage.convert(center, from: scr)
    zoomRect.origin.x = newCenter.x - (zoomRect.size.width / 2.0)
    zoomRect.origin.y = newCenter.y - (zoomRect.size.height / 2.0)
    return zoomRect
}}

通过此代码，您可以通过捏合（无手势）和双击进行放大和缩小。

如果发生错误..请确保已将scrollview的委托连接到ViewController

您可以对Single ViewController（单个图像）使用相同的代码 只需将覆盖功能func awakeFromNib（）的代码粘贴到viewDidLoad（）中，其余代码相同。