Carousel
Carousel for scrolling pages
(code example)
info
This component extends ScrollView props.
tip
This component support **** modifiers.
#
Usage<Carousel onChangePage={() => console.log('page changed')}> {_.map(items, item => ( return renderItem(item, index); ))}</Carousel>
#
API#
allowAccessibleLayoutWhether to layout Carousel for accessibility
boolean
#
animatedShould the container be animated (send the animation style via containerStyle)
boolean
#
animatedScrollOffsetPass to attach to ScrollView's Animated.event in order to animated elements base on Carousel scroll offset (pass new Animated.ValueXY())
Animated.ValueXY
#
autoplayEnable to switch automatically between the pages
boolean
#
autoplayIntervalTime is ms to wait before switching to the next page (requires 'autoplay' to be enabled)
number
#
containerMarginHorizontalHorizontal margin for the carousel container
number
#
containerPaddingVerticalVertical padding for the carousel container (Sometimes needed when there are overflows that are cut in Android).
number
#
containerStyleThe carousel container style
ViewStyle
#
counterTextStyleThe counter's text style
ViewStyle
#
horizontalWhether pages will be rendered horizontally or vertically
boolean
#
initialPageThe initial page to start at
number
#
itemSpacingsThe spacing between the pages
number
#
loopIf true, will have infinite scroll (works only for horizontal carousel)
boolean
#
onChangePageCallback for page change event
(pageIndex, oldPageIndex, info) => void
#
onScrollAttach a callback for onScroll event of the internal ScrollView
function
#
pageControlPositionThe position of the PageControl component ['over', 'under'], otherwise it won't display
PageControlPosition
#
pageControlPropsPageControl component props
PageControlProps
#
pageHeightThe page height (all pages should have the same height).
number
#
pageWidthThe page width (all pages should have the same width). Does not work if passing 'loop' prop
number
#
pagingEnabledWill block multiple pages scroll (will not work with 'pageWidth' prop)
boolean
#
showCounterWhether to show a page counter (will not work with 'pageWidth' prop)
boolean