Stagger | NativeBase | Universal Components for React and React Native

Nativebase logo
NativeBase
Data Display
Typography
Disclosure
Media and Icons
Others
Stagger
Stagger component provides a declarative API to add staggered transitions.
Show Code
Playground
Example
Playground
Props
initial
Initial styles before the transition starts
animate
The styles to which each child should animate to while entering.
exit
The styles to which each child should animate to while exiting.
visible
Determines whether to start the animation
Type: boolean
IStaggerStyleProps
Copy
interface IStaggerStyleProps extends ISupportedTransition {
transition?: {
stagger?: {
/**
* Delay to add to each child
*/
offset: number,
/**
* When true, delay is added from the last child
*/
reverse?: boolean,
},
type?: 'timing' | 'spring',
easing?: (value: number) => number,
overshootClamping?: boolean,
restDisplacementThreshold?: number,
restSpeedThreshold?: number,
velocity?: number | { x: number, y: number },
bounciness?: number,
speed?: number,
tension?: number,
friction?: number,
stiffness?: number,
mass?: number,
damping?: number,
delay?: number,
duration?: number,
useNativeDriver?: boolean,
};
}
Nativebase logo
MadeWithNativeBase