CABasicAnimation has a fillMode property of type CAMediaTimingFillMode. The definition is as follows:

public struct CAMediaTimingFillMode : Hashable.Equatable.RawRepresentable {
    public init(rawValue: String)

}

extension CAMediaTimingFillMode {

    @available(iOS 2.0.*)
    public static let forwards: CAMediaTimingFillMode

    @available(iOS 2.0.*)
    public static let backwards: CAMediaTimingFillMode

    @available(iOS 2.0.*)
    public static let both: CAMediaTimingFillMode

    @available(iOS 2.0.*)
    public static let removed: CAMediaTimingFillMode
}
Copy the code

FillMode: Determines the behavior of the current object during the non-active period. Like before the animation starts, after the animation ends.

In addition, removedOnCompletion means that the animation will be removed from the layer once it has completed and the image will be restored to the state it was before the animation was executed. This defaults to True. If you want the layer to show the animation as it was after it was executed, you need to set removedOnCompletion to false and fillMode to forwards.

CAMediaTimingFillMode cases

You can write a program to test the effect of each enumeration value on the layer. Add a shift animation to a view that requires a delay of 3 seconds and see how the layer moves.

.forwards

let basicAnimation = CABasicAnimation()
basicAnimation.keyPath = "position.y";
basicAnimation.isRemovedOnCompletion = false
// beginTime: Start time of the animation
// CACurrentMediaTime() : the current time of the layer
// Delay animation execution for 3 seconds
basicAnimation.beginTime = CACurrentMediaTime(a)+3
basicAnimation.fillMode = .forwards
// The start position of the animation
basicAnimation.fromValue = 300;
// The end of the animation
basicAnimation.toValue = 500;
// Animation duration
basicAnimation.duration = 3;
animationView.layer.add(basicAnimation, forKey: nil)
Copy the code

Conclusion: Layer adds animation, and when the animation starts executing, layer quickly goes to the initial unknown of the animation, and then starts executing the animation. When isRemovedOnCompletion is false, stop at the end of the animation; true is a quick return to the layer itself.

.backwards

// Other codes are the same as.forwards
basicAnimation.fillMode = .backwards
Copy the code

Conclusion: After adding an animation to a layer, the layer immediately moves to the initial state of the animation, and 3 seconds later the animation starts executing. Regardless of the value of isRemovedOnCompletion, it quickly returns to the layer itself.

.both

// Other codes are the same as.forwards
basicAnimation.fillMode = .both
Copy the code

Conclusion: After adding an animation to a layer, the layer immediately moves to the initial state of the animation, and 3 seconds later the animation starts executing. When isRemovedOnCompletion is false, stop at the end of the animation; true is a quick return to the layer itself.

.both

// Other codes are the same as.forwards

basicAnimation.fillMode = .removed
Copy the code

Conclusion: After adding an animation to a layer, the layer immediately moves to the initial state of the animation, and 3 seconds later the animation starts executing. When isRemovedOnCompletion is false, stop at the end of the animation; true is a quick return to the layer itself.

conclusion

case	Before I start the animation	Start the animation	End of the animation
forwards	Do not move, save as is	Start animation by moving to the initial state of the start animation	You can set the end position, stopping at the end of the animation when isRemovedOnCompletion is false, or true to quickly return to the layer itself
backwards	Move to the initial state of the start animation	Start animation	There is no control over where it ends, regardless of the value of isRemovedOnCompletion, and it quickly returns to the layer itself
both	Move to the initial state of the start animation	Start animation	You can control where you finish. When isRemovedOnCompletion is false, stop at the end of the animation; true is to quickly return to the layer itself
removed	Do not move, save as is	Start animation by moving to the initial state of the start animation	There is no control over where it ends, regardless of the value of isRemovedOnCompletion, and it quickly returns to the layer itself

reference

FillMode,