react-native-image-sequence
native modules for handling image sequence animations. (created because i had performance issues with a javascript only solution like: https://github.com/remobile/react-native-image-animation)
its a simple wrapper around iOS UIImageView.animationImages
and Android AnimationDrawable
Installation
npm i --save react-native-image-sequence
react-native link react-native-image-sequence
Features
These features only added to package react-native-image-sequence
// read image from Assets.xcassets (Only iOS)const images = uri: 'path' // add this property useXcassets: true ;// read image from bundle (Only iOS)const images = uri: 'path' // add this property bundleName: 'bundleName' ;// read image from assets floder (Only Android)const images = // add assets:/ scheme uri: 'asset:/{picPath}' ;
Examples
; const images = ; const centerIndex = Math; <ImageSequence images=images startFrameIndex=centerIndex style=width: 50 height: 50 />
Change animation speed
You can change the speed of the animation by setting the framesPerSecond
property.
<ImageSequence images=images framesPerSecond=24 />
Looping
You can change if animation loops indefinitely by setting the loop
property.
<ImageSequence images=images framesPerSecond=24 loop=false />