These pens add a few features to content manager.
The first example adds transitions in four directions. I modified the showView method, adding parameters which describe the transition.
showView(newView, exit, start, enter)
- newView – The view to show
- exit – an object with properties describing the how the current view will exit
- start – an object with properties describing where the new view should be positioned before it enters.
- enter – an object with properties describing how the new view will enter
I also added four helper methods to to create transitions that slide in from four directions.
- pushLeft(newView)
- pushRight(newView)
- pushUp(newView)
- pushDown(newView)
In the example you’ll see the buttons all execute a pushRight(). Try changing these to pushUp, or pushDown.
This example keeps the views in an array, something like [A, B, C]. It chooses the transition based on the relationship and position of the current view to the new view.
If the new view (A for example) is to the left of the current view (B, for example) in the array the transition is pushRight(). If the new view (C for example) is to the right of the current view (B for example) the transition is push left.
To do this I added an array, viewsArray, and added all of the views to the array. I also added a new function: showViewInArray(newView). This function finds the index of the current view, and the new view and compares them, and decides which method to call: pushLeft(), or pushRight().