Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 

README.md

react-native-flanimatedimage

FLAnimatedImage for React Native

This module is modified from https://github.com/browniefed/react-native-flanimatedimage with the following changes:

  • use Carthage or CocoaPods for FLAnimatedImage dependency
  • async image loading
  • return the image size onLoadEnd

Install

You have to install FLAnimatedImage first via Carthage or If you're using CocoaPods, you can put the following in your Podfile:

pod 'FLAnimatedImage'

then

npm install react-native-flanimatedimage --save

If you are using react-native@0.40 or below

npm install react-native-flanimatedimage@0.0.3 --save

Link

In XCode, in the project navigator:

  • Right click Libraries
  • Add Files to [your project's name]
  • Go to node_modules/react-native-flanimatedimage/RNFLAnimatedImage
  • Add the .xcodeproj file

In XCode, in the project navigator, select your project.

  • Add the libRNFLAnimatedImage.a from the deviceinfo project to your project's Build Phases ➜ Link Binary With Libraries

If your Catrhage/Pods folder is not under ios folder, please modify the Headers Search Paths in Build Settings - Search Paths - Header Search Paths

  • Click .xcodeproj file you added before in the project navigator and go the Build Settings tab. Make sure All is toggled on (instead of Basic).
  • Look for Header Search Paths and add the path where the FLAnimatedImage's header files are placed.

Usage

import FLAnimatedImage from 'react-native-flanimatedimage';

...
  onLoadEnd = (e) => {
    if (!e.nativeEvent.size) return;
    const { width, height } = e.nativeEvent.size;
    this.setState({
      width,
      height,
    });
  }
...
  <FLAnimatedImage style={style} source={source} onLoadEnd={this.onLoadEnd} />
...

About

FLAnimatedImage for React Native

Topics

Resources

License

Releases

No releases published
You can’t perform that action at this time.