0

我的目标是在 UICollectionView 单元格的边框周围添加阴影，同时执行 UICollectionView 的批量更新，这将导致所选单元格的高度扩大。这个想法是边框周围的阴影会淡入视野，或者像在这个 GIF 中那样立即进入视野，但是随着单元格的增长，这样做会遵循单元格的实际大小。如代码所示，我特别希望阴影在单元格周围而不是在单元格本身内 - 这是为了保持适当的边界。

override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    if weekTasks[indexPath.section].count == 0 {
        let emptyCell = collectionView.dequeueReusableCell(withReuseIdentifier: "emptyCellID", for: indexPath) as! EmptyCell
        return emptyCell
    } else {
        let assignmentCell = collectionView.dequeueReusableCell(withReuseIdentifier: "assignCellID", for: indexPath) as! AssignmentCell
        assignmentCell.myAssignment = weekTasks[indexPath.section][indexPath.item]
        assignmentCell.contentView.backgroundColor = UIColor.white
        return assignmentCell
    }
}

// Sets up size of cell
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    if weekTasks[indexPath.section].count == 0 {
        return CGSize(width: screenWidth, height: 36 )
    } else if (collectionView.indexPathsForSelectedItems?.contains(indexPath))! {
        return CGSize(width: screenWidth, height: 110)
    } else {
        return CGSize(width: screenWidth, height: 46)
    }
}

override func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    cell?.contentView.layer.cornerRadius = 12
    cell?.contentView.layer.masksToBounds = true;
    cell?.contentView.backgroundColor = UIColor.white

    cell?.layer.shadowOffset = CGSize(width: 0 ,height: 1)
    cell?.layer.shadowRadius = 4
    cell?.layer.shadowOpacity = 0.2

    collectionView.performBatchUpdates(nil, completion: { done in
        if done {
            print("Sweet")
        }}
    )
}

override func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
    let cell = collectionView.cellForItem(at: indexPath)
    cell?.contentView.layer.cornerRadius = 0
    cell?.contentView.layer.masksToBounds = true;

    cell?.layer.shadowOpacity = 0
}

我的 CollectionView 单元格

class AssignmentCell: UICollectionViewCell, UIGestureRecognizerDelegate {
var heightConstraint: NSLayoutConstraint?

override init(frame: CGRect) {
    super.init(frame: frame)
    setupViews()
}

let helperView = UIView()

func setupViews() {

    self.contentView.addSubview(helperView)
    let topConstraint = NSLayoutConstraint(item: helperView, attribute: NSLayoutAttribute.top, relatedBy: NSLayoutRelation.equal, toItem: superview, attribute: NSLayoutAttribute.top, multiplier: 1, constant: 0)
    let leftConstraint = NSLayoutConstraint(item: helperView, attribute: NSLayoutAttribute.left, relatedBy: NSLayoutRelation.equal, toItem: superview, attribute: NSLayoutAttribute.left, multiplier: 1, constant: 0)
    let rightConstraint = NSLayoutConstraint(item: helperView, attribute: NSLayoutAttribute.right, relatedBy: NSLayoutRelation.equal, toItem: superview, attribute: NSLayoutAttribute.right, multiplier: 1, constant: 0)
    let bottomConstraint = NSLayoutConstraint(item: helperView, attribute: NSLayoutAttribute.bottom, relatedBy: NSLayoutRelation.equal, toItem: superview, attribute: NSLayoutAttribute.bottom, multiplier: 1, constant: 0)
    let heightConstraint = helperView.heightAnchor.constraint(equalToConstant: self.frame.height)
    helperView.addConstraints([topConstraint, leftConstraint, rightConstraint, heightConstraint])

    helperView.addSubview(titleView)
    titleView.frame = CGRect(x: 48, y: (self.frame.height / 2) - 10, width: screenWidth - 190, height: 20)

    helperView.addSubview(checkboxView)
    checkboxView.frame = CGRect(x: 10, y: (self.frame.height / 2) - 9, width: 18, height: 18)
}

func expandCell(to height: CGFloat) {
    heightConstraint?.constant = 110

    UIView.animate(withDuration: 0.3, animations: {
        self.layoutIfNeeded()
    }) { (completed) in
    }
}

}

在此处输入图像描述

4

1 回答 1

0

它实际上遵循单元格大小。您会得到这种效果，因为您正在设置固定的单元格高度并在之后为布局更改设置动画。您可以尝试自动设置单元格大小（仅适用于扩展单元格）。

在您的单元格中，创建一个方法以将大小从当前值设置为 x（在您的情况下为 110）。

添加一个与容器的高度相等的约束，然后像这样做：

func expandCell(to height: CGFloat) {
    self.cellHeightConstraint?.constant = height

    UIView.animate(withDuration: 0.3, animations: {
        self.layoutIfNeeded()
    }) { (completed) in
    }
}

// 编辑

在您的 ContentView 中添加一个新的 UIView 并在其中放置所有其他视图。将该视图的顶部、底部、左侧、右侧设置为 0，设置为其 superview(contentView) 和具有 @999 优先级的该视图的高度约束。见下图：

在此处输入图像描述

于 2018-11-19T11:43:28.123 回答