I have a gif in react and i want to stop the loop I add an image in my view i give to the image the path of my gif and it's work but the gif go in infinite loop

Any idea to stop ?

<Image
    source={require('./img/anim.gif')}
 />

thanks

I have a gif in react and i want to stop the loop I add an image in my view i give to the image the path of my gif and it's work but the gif go in infinite loop

Any idea to stop ?

<Image
    source={require('./img/anim.gif')}
 />

thanks

• javascript
• android
• ios
• reactjs
• react-native

1 Answer 1

Edit react-native/Libraries/Image/RCTGIFImageDecoder.m

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"contents"];
    ...
animation.repeatCount = loopCount == 0 ? 0 : loopCount; // <-- fix for single play gif from joshbedo
animation.fillMode = @"forwards"; // <-- insert this line to prevent the image disappearing after animation

And for android

update to the latest fresco version (androidmanifest.xml)

pile '.facebook.fresco:animated-base-support:1.1.0' pile '.facebook.fresco:animated-gif:1.1.0'
 pile '.facebook.fresco:animated-webp:1.1.0' 
pile '.facebook.fresco:webpsupport:1.1.0'