集合视图中的几个动画

Question

我正在学习动画化集合视图，目前使用 CollectionViewPagingLayout template。

我不仅想在集合视图中使用滑动来导航，还想使用按钮。这个想法是滑动动画不同于按钮动画。

所以重点是 - 如何为一个集合视图配置两种不同的动画？

一个选择的动画完美运行：在 viewDidLoad 中我声明选择的模板：

override func viewDidLoad() {
        super.viewDidLoad()
        let layout = CollectionViewPagingLayout()
        collectionView.collectionViewLayout = layout
        collectionView.isPagingEnabled = true
        layout.numberOfVisibleItems = nil
    }

然后有两个按钮，作用与左右滑动相同。

在 class 结束后，我创建了一个带有一些动画的扩展，例如：

extension TargetCollectionViewCell: ScaleTransformView {
    var scaleOptionsDetailed: ScaleTransformViewOptions {
        return ScaleTransformViewOptions(
            minScale: 0.6,
            scaleRatio: 0.4,
            translationRatio: CGPoint(x: 0.66, y: 0.2),
            maxTranslationRatio: CGPoint(x: 2, y: 0)
        )
    }
}

但我不明白如何设置第二个动画 - 然后如何调用它。我想要的结果示例如下：对于滑动操作，扩展中的 minScale 参数应为 0.6。当我点击 right/left 按钮时 minScale 参数应该是 0.9.

模板作者提供的readme很详细-但我没有找到线索。我想，某种功能可能会有所帮助 - 或者另一个扩展。但是我试过了，完全没有弄清楚如何写那个方法。

非常感谢您的帮助。

Answer 1

最后，我自己搞定了。如果它对任何人都有用 - 可能的解决方案之一如下：

首先，创建一种动画，例如var animationType = 1。

然后，在扩展中，做一些案例：

extension TargetCollectionViewCell: ScaleTransformView {
    var scaleOptions: ScaleTransformViewOptions {
        if animationType == 1 {
            return ScaleTransformViewOptions(
                minScale: 0.01,
                maxScale: 0.01,
                scaleRatio: 0,
                translationRatio: .zero,
                minTranslationRatio: .zero,
                maxTranslationRatio: .zero,
                shadowEnabled: false,
                rotation3d: .init(angle: 0.8, minAngle: -90, maxAngle: 90, x: 0, y: 1, z: 0, m34: -0.001),
                translation3d: .init(translateRatios: (0, -1, 0), minTranslateRatios: (0, 0, 1.25), maxTranslateRatios: (0, 0, 1.25)))
        } else if animationType == 2 {
            return ScaleTransformViewOptions(
                minScale: 0.04,
                maxScale: 0.04,
                scaleRatio: 0,
                translationRatio: .zero,
                minTranslationRatio: .zero,
                maxTranslationRatio: .zero,
                shadowEnabled: false,
                rotation3d: .init(angle: 0.8, minAngle: -90, maxAngle: 90, x: 0, y: 1, z: 0, m34: -0.001),
                translation3d: .init(translateRatios: (0, -1, 0), minTranslateRatios: (0, 0, 1.25), maxTranslateRatios: (0, 0, 1.25)))
        } else {
            return ScaleTransformViewOptions(
                minScale: 0.07,
                maxScale: 0.07,
                scaleRatio: 0,
                translationRatio: .zero,
                minTranslationRatio: .zero,
                maxTranslationRatio: .zero,
                shadowEnabled: false,
                rotation3d: .init(angle: 0.8, minAngle: -90, maxAngle: 90, x: 0, y: 1, z: 0, m34: -0.001),
                translation3d: .init(translateRatios: (0, -1, 0), minTranslateRatios: (0, 0, 1.25), maxTranslateRatios: (0, 0, 1.25)))
        }
        
        return ScaleTransformViewOptions(
            
        )
    }
}

在我的示例中，唯一改变的是 minScale/maxScale 参数 - 当然，所有其他选项都可以更改为。

最后一件事 - 向 right/left 按钮添加一行代码，以便它更改动画类型。因此，对于左按钮，您添加：

 @IBAction func swipeLeftButton(_ sender: Any) {
       ...
       animationType = 1
        
    }

而不是......你放了一段代码，它描述了一个按钮的基本功能。在我的例子中 - 这是一个向左滑动的命令。

希望对某人有所帮助。

集合视图中的几个动画

Several animations in a collection view

swift

xcode

animation

uicollectionview

uicollectionviewlayout