动画集合视图单元格

时间:2018-03-20 15:00:17

标签: swift uicollectionview uikit uicollectionviewcell uiviewanimation

如何为iOS中的左右门关闭或滑动等集合视图单元设置动画。 像这样:enter image description here

1 个答案:

答案 0 :(得分:3)

这是动画集合视图单元格的代码,如关闭门。 此集合有2列。 我为集合视图单元格大小添加了UICollectionViewDelegateFlowLayout方法的代码。 您可以自定义或根据您的要求进行更改。

enter image description here

此代码显示了一种生成动画的简单方法,如关闭门。

    // MARK: - UICollectionViewDelegateFlowLayout
    extension SettingsViewController: UICollectionViewDelegateFlowLayout {

        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
            return CGSize(width:CGFloat(settingsCollectionView.frame.size.width * 0.46), height: settingsCollectionView.frame.size.height * 0.25)
        }

        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
            return 10
        }

        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
            return 10
        }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

            // create a new cell if needed or reuse an old one
            let cell: SettingsCollectionCell = settingsCollectionView.dequeueReusableCell(withReuseIdentifier: identifier, for: indexPath) as! SettingsCollectionCell

            if !cell.isAnimated {

                UIView.animate(withDuration: 0.5, delay: 0.5 * Double(indexPath.row), usingSpringWithDamping: 1, initialSpringVelocity: 0.5, options: indexPath.row % 2 == 0 ? .transitionFlipFromLeft : .transitionFlipFromRight, animations: {

                    if indexPath.row % 2 == 0 {
                        AnimationUtility.viewSlideInFromLeft(toRight: cell)
                    }
                    else {
                        AnimationUtility.viewSlideInFromRight(toLeft: cell)
                    }

                }, completion: { (done) in
                    cell.isAnimated = true
                })
            }

       return cell
    }
}

这是AnimationUtility类的代码。

class AnimationUtility: UIViewController, CAAnimationDelegate {

    static let kSlideAnimationDuration: CFTimeInterval = 0.4

    static func viewSlideInFromRight(toLeft views: UIView) {
        var transition: CATransition? = nil
        transition = CATransition.init()
        transition?.duration = kSlideAnimationDuration
        transition?.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        transition?.type = kCATransitionPush
        transition?.subtype = kCATransitionFromRight
//        transition?.delegate = (self as! CAAnimationDelegate)
        views.layer.add(transition!, forKey: nil)
    }

    static func viewSlideInFromLeft(toRight views: UIView) {
        var transition: CATransition? = nil
        transition = CATransition.init()
        transition?.duration = kSlideAnimationDuration
        transition?.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        transition?.type = kCATransitionPush
        transition?.subtype = kCATransitionFromLeft
//        transition?.delegate = (self as! CAAnimationDelegate)
        views.layer.add(transition!, forKey: nil)
    }

    static func viewSlideInFromTop(toBottom views: UIView) {
        var transition: CATransition? = nil
        transition = CATransition.init()
        transition?.duration = kSlideAnimationDuration
        transition?.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        transition?.type = kCATransitionPush
        transition?.subtype = kCATransitionFromBottom
//        transition?.delegate = (self as! CAAnimationDelegate)
        views.layer.add(transition!, forKey: nil)
    }

    static func viewSlideInFromBottom(toTop views: UIView) {
        var transition: CATransition? = nil
        transition = CATransition.init()
        transition?.duration = kSlideAnimationDuration
        transition?.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
        transition?.type = kCATransitionPush
        transition?.subtype = kCATransitionFromTop
//        transition?.delegate = (self as! CAAnimationDelegate)
        views.layer.add(transition!, forKey: nil)
    }
}