JWStackTransition is a library that provides transition animations for navigation controllers, offering various transition effects such as clocks, fences, flips, and folds.

Its principle is provide transition classes that comply with the UIViewControlAnimatedTransitioning protocol for the delegate method navigationController(_ navigationController: UINavigationController, animationControllerFor operation: UINavigationController.Operation, from fromVC: UIViewController, to toVC: UIViewController) of UINavigationController.

It currently has 24 different kind of transition animation types, most of them can be customized.

This library was inspired by VCTransitionsLibrary and RetroTransition

• AntiClockWise
• Barrier
• Circle
• ClockWise
• Cube
• Door
• Explode
• Fence
• Flip
• Fold
• MultiCircle
• Multinest
• NatGeo
• Official
• Pan
• Rectangler
• Roll
• Rotate
• Sector
• Slant
• Split
• Swing
• TiledFlip
• Translate

The library currently contains the following animations

• anticlockwise - default case which is the same as anticlockwiseCustomized(1.5).

• anticlockwiseCustomized(startAngle: CGFloat) - default animation start angle is 1.5, angle range is [0.0, 2.0].

start angle is 0.0	start angle is 0.5	start angle is 1.0	start angle is 1.5	start angle is 2.0

• barrier - default case which is the same as barrierCustomized(.toTop, width: 20.0).

• barrierCustomized(_ type: JWStackTransitionAnimationBarrierFadeDirectionType, width: CGFloat) - default animation type is toTop, default barrier width is 20.0.

toTop and width is 20	toLeft and width is 5	toRight and width is 10	toBottom and width is 15

toVerticalCenter, 20	toHorizontalCenter, 25

• circle

• clockWise - default case which is the same as clockWiseCustomized(0.5).

• clockWiseCustomized(_ startAngle: Double) - default animation start angle is 0.5, angle range is [0.0, 2.0].

start angle is 0.0	start angle is 0.5	start angle is 1.0	start angle is 1.5	start angle is 2.0

• cube - default case which is the same as cubeCustomized(.fromLeftToRight)

• cubeCustomized(_ type: JWStackTransitionAnimationCubeType) - default animation case is fromLeftToRight.

fromLeftToRight	fromRightToLeft	fromTopToBottom	fromBottomToTop

• door - default case which is the same as doorCustomized(.horizontalOpen, scale: 0.8)

• doorCustomized(_ type: JWStackTransitionAnimationDoorType, scale: CGFloat) - default animation case is horizontalOpen, default animation scale is 0.8 and range is (0.0, 1.0].

horizontalOpen and scale is 0.8	horizontalClose and scale is 0.6	verticalOpen and scale is 0.4	verticalClose and scale is 0.2

• explode - default case which is the same as explodeCustomized(30.0)

• explodeCustomized(_ pieceWidth: CGFloat) - default explode piece width is 30.0.

explode piece width is 30.0	explode piece width is 10.0	explode piece width is 45.0	explode piece width is 60.0

• fence - default case which is the same as fenceCustomized(.verticalLeft, width: 20.0)

• fenceCustomized(_ type: JWStackTransitionAnimationFenceType, width: CGFloat) - default animation type is verticalLeft, default fence width is 20.0.

verticalLeft and width is 20.0	verticalRight and width is 5.0	verticalCross and width is 10.0

horizontalTop and width is 15.0	horizontalBottom and width is 20.0	horizontalCross and width is 25.0

• flip - default case which is the same as flipCustomized(.fromLeftToRight)

• flipCustomized(_ type: JWStackTransitionAnimationFoldType) - default animation type is fromLeftToRight.

fromLeftToRight	fromRightToLeft

• fold - default case which is the same as foldCustomized(.fromLeftToRight, foldNum: 2)

• foldCustomized(_ type: JWStackTransitionAnimationFoldType, foldNum: Int) - default animation type is fromLeftToRight, default fold number is 2.

fromLeftToRight and fold number is 2	fromLeftToRight and fold number is 4	fromRightToLeft and fold number is 6	fromRightToLeft and fold number is 8

• multiCircle - default case which is the same as multiCircleCustomized(20.0)

• multiCircleCustomized(_ diameter: CGFloat) - default single circle diameter is 20.0, diameter range is (0, 100].

diameter is 20.0	diameter is 40.0	diameter is 60.0	diameter is 5.0

• multinest

• natGeo - default case which is the same as natGeoCustomized(.geoLeft)

• natGeoCustomized(_ type: JWStackTransitionAnimationNatGeoType) - default animation type is geoLeft.

geoLeft	geoRight

• official - default case which is the same as officialCustomized(.crossDissolve)

• officialCustomized(_ type: JWStackTransitionAnimationOfficialType) - default animation type is crossDissolve.

crossDissolve	curlUp	curlDown

flipFromLeft	flipFromRight	flipFromTop	flipFromBottom

• pan - default case which is the same as panCustomized(.panLeft)

• panCustomized(_ type: JWStackTransitionAnimationPanType) - default animation type is panLeft.

panLeft	panRight	panTop	panBottom

• rectangler - default case which is the same as rectanglerCustomized(.waveIn)

• rectanglerCustomized(_ wave: JWStackTransitionAnimationRectanglerWave) - default animation type is waveIn.

waveIn	waveOut

• roll - default case which is the same as rollCustomized(.y)

• rollCustomized(_ axis: JWStackTransitionAnimationRollAxis) - default animation roll axis is y.

x	y	z

• rotate

• sector - default case which is the same as sectorCustomized(.left)

• sectorCustomized(_ edge: JWStackTransitionAnimationRectEdge) - default animation rect edge is left.

left	right	top	bottom

• slant - default case which is the same as slantCustomized(.topLeft)

• slantCustomized(_ corner: JWStackTransitionAnimationRectCorner) - default animation rect corner is topLeft.

topLeft	topRight	bottomLeft	bottomRight

• split - default case which is the same as splitCustomized(.horizontal)

• splitCustomized(_ type: JWStackTransitionAnimationSplitType) - default split type is horizontal.

horizontal	vertical	diamondHorizontal	diamondVertical

cross	leftDiagonal	rightDiagonal	crossDiagonal

• swing - default case which is the same as swingCustomized(.left)

• swingCustomized(_ edge: JWStackTransitionAnimationRectEdge) - default animation rect edge is left.

left	right	top	bottom

• tiledFlip - default case which is the same as tiledFlipCustomized(.flipFromRight, tiledRow: 10, tiledColumn: 5)

• tiledFlipCustomized(_ type: JWStackTransitionAnimationOfficialType, tiledRow: Int, tiledColumn: Int) - default animation type is flipFromRight, default tiled row is 10 and range is (0, 20], default tiled column is 5 and range is (0, 10].

flipFromRight	flipFromLeft	flipFromTop	flipFromBottom

crossDissolve	curlUp	curlDown

• translate - default case which is the same as translateCustomized(.left)

• translateCustomized(_ edge: JWStackTransitionAnimationRectEdge) - default animation rect edge is left.

left	right	top	bottom

Directory structure of JWStackTransition:

also, DeepWiki may help you better understand JWStackTransition.

• iOS 12.0 or later
• Swift 5.9.2
• Xcode 15.1

JWStackTransition is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'JWStackTransition', :git => 'https://github.com/Sfh03031/JWStackTransition.git'

Install and import JWStackTransition

import JWStackTransition

JWStackTransition extends the push and pop methods of UINavigationController, so it can be used as follows:

/// push
self.navigationController?.push(vc, type: type, duration: 1.0)

#another way
// self.navigationController?.push(vc, transition: JWStackTransition(type: type, duration: 1.0))

/// pop
self.navigationController?.pop(.antiClockWise, duration: 1.0)

#another way
self.navigationController?.pop(JWStackTransition(type: .antiClockWise, duration: 1.0))

2025.05.20, 0.1.1

• Initial version

Please make an issue or pull request if you have any request.

Bug reports, Documentation, or tests, are always welcome as well.

Sfh03031, [email protected]

JWStackTransition is available under the MIT license. See the LICENSE file for more info.