A collection of ModuleAnimation implementations that can be specified on the "animation"
option of ojModule binding.
These implementations assume that either the ojModule binding is on a real HTML element or, for ojModule binding on virtual element, each view is contained by a single HTML root element.
These implementations assume that either the ojModule binding is on a real HTML element or, for ojModule binding on virtual element, each view is contained by a single HTML root element.
- Source:
Fields
-
<static> coverStart
-
ModuleAnimation implementation for changing views by sliding the new view in to cover the old view.
This will take the text direction of the page into account. On "ltr" page, the new view will slide to the left. On "rtl" page, it will slide to the right.- Source:
-
<static> coverUp
-
ModuleAnimation implementation for changing views by sliding the new view up to cover the old view.
- Source:
-
<static> drillIn
-
ModuleAnimation implementation for drilling in to views by using animations that are dependent on the platform theme.
The default animations for each platform theme are as follows:
- Web theme: coverStart
- iOS theme: coverStart
- Android theme: coverUp
- Windows theme: zoomIn
The default animation can be changed with the following theme variable:
$animationDrillInDefault
: specify the animation for drilling in to views.
Valid values are the names of specific animation implementations such as "coverStart".
- Source:
Example
Set the default in the theme (SCSS) :
$animationDrillInDefault: coverStart !default;
-
<static> drillOut
-
ModuleAnimation implementation for drilling out of views by using animations that are dependent on the platform theme.
The default animations for each platform theme are as follows:
- Web theme: revealEnd
- iOS theme: revealEnd
- Android theme: revealDown
- Windows theme: zoomOut
The default animation can be changed with the following theme variable:
$animationDrillOutDefault
: specify the animation for drilling out of views.Valid values are the names of specific animation implementations such as "revealEnd".
- Source:
Example
Set the default in the theme (SCSS) :
$animationDrillOutDefault: revealEnd !default;
-
<static> fade
-
ModuleAnimation implementation for changing views by fading in the new view and fading out the old view.
- Source:
-
<static> revealDown
-
ModuleAnimation implementation for changing views by sliding the old view down to reveal the new view.
- Source:
-
<static> revealEnd
-
ModuleAnimation implementation for changing views by sliding the old view out to reveal the new view.
This will take the text direction of the page into account. On "ltr" page, the old view will slide to the right. On "rtl" page, it will slide to the left.- Source:
-
<static> zoomIn
-
ModuleAnimation implementation for changing views by zooming in on the new view.
- Source:
-
<static> zoomOut
-
ModuleAnimation implementation for changing views by zooming out on the old view.
- Source:
Methods
-
<static> switcher(callback) → {Object}
-
Returns an implementation of ModuleAnimation interface that switches between different animation implementations
Parameters:
Name Type Description callback
Function a callback function whose return value should be a string containing one of the animation types supported by oj.ModuleAnimations. The function will be passed a context object with the keys detailed below: - node - a DOM node where the ojModule binding is attached. This may be a virtual/comment node
- valueAccessor - value accessor for the binding
- isInitial - true if the initial View is about to be displayed, false otherwise
- oldViewModel - the instance of the ViewModel for the old View
- newViewModel - the instance of the ViewModel for the new View
- Source:
Returns:
switching implementation of the ModuleAnimation interface- Type
- Object