ui/ViewManager

A component that manages the transitions of views.

import ViewManager from '@enact/ui/ViewManager';

Members

ViewManagerClass

A ViewManager controls the visibility of a configurable number of views, allowing for them to be transitioned on and off the viewport.

import ViewManager from '@enact/ui/ViewManager';
Properties
arranger
Arranger

Arranger to control the animation

childProps
Object

An object containing properties to be passed to each child.

children
Node

Views to be managed.

May be any renderable component including custom React components or primitive DOM nodes.

component
Component

Type of component wrapping the children. May be a DOM node or a custom React component.

Default: 'div'
duration
Number

Time in milliseconds to complete a transition

Default: 300
end
Number

Index of last visible view.

Defaults to the current value of index.

Default: value of index
enteringDelay
Number

Time, in milliseconds, to wait after a view has entered to inform it by pass the enteringProp as false.

Default: 0
enteringProp
String

Name of the property to pass to the wrapped view to indicate when it is entering the viewport.

When true, the view has been created but has not transitioned into place. When false, the view has finished its transition.

The notification can be delayed by setting enteringDelay. If not set, the view will not be notified of the change in transition.

index
Number

Index of active view

Default: 0
noAnimation
Boolean

Indicates if the transition should be animated

Default: false
onAppear
Function

Called when each view is rendered during initial construction.

onEnter
Function

Called when each view completes its transition into the viewport.

onLeave
Function

Called when each view completes its transition out of the viewport.

onStay
Function

Called when each view completes its transition within the viewport.

onTransition
Function

Called once when all views have completed their transition.

onWillTransition
Function

Called once before views begin their transition.

reverseTransition
Boolean

Explicitly sets the transition direction.

If omitted, the direction is determined automaticallly based on the change of index or a string comparison of the first child's key.

start
Number

Index of first visible view. Defaults to the current value of index.

Default: value of index

SlideArrangerFunction

SlideArranger(config)Object

A basic arranger that must be configured with enter and leave direction

1 Param
config Object

Configuration object including amount, enter and leave properties

Object keys for config
amount
enter
leave
Returns
Object

An arranger

SlideBottomArranger

An arranger that enters from the top and leaves to the bottom.

SlideLeftArranger

An arranger that enters from the right and leaves to the left.

SlideRightArranger

An arranger that enters from the left and leaves to the right.

SlideTopArranger

An arranger that enters from the bottom and leaves to the top.

ArrayBooleanFunctionModuleNumberObjectString