!Keyframes

react-native-facebook-keyframes

A React Native wrapper for the Facebook Keyframes library.

Getting started

``bash
npm install react-native-facebook-keyframes --save

react-native link react-native-facebook-keyframes
`


$3

You must install Facebook Keyframes dependency using CocoaPods:

1. Install cocoapods in case you don't have already installed:

`bash
sudo gem install cocoapods
`
2. Go to [your project's name] ios folder (in this case MyProject):

`bash
cd MyProject/ios
`
3. Create a new Podfile file with the following contents:

`ruby
target '{MyProject}' do
pod 'Keyframes', :git => 'https://github.com/facebookincubator/Keyframes.git', :commit => '07ce61ee388360258777eb3342c87ba6128584d0'
end
`
3. Instal cocoapods dependencies and return to the project folder:

`bash
pod install
cd ../
`

Usage

1. Create a new keyframes json file (you can find a sample here)
2. Include the library in your js file:

`JSX
import KeyframesView from 'react-native-facebook-keyframes'
`

3. Use the component:

`JSX
style={{ width: 100, height: 100 }} // View styles
seek={1.0} // Seek to a given progress in range [0, 1]
src={require('./keyframes-logo.json')} // Animation file
/>
`

Running the demo project included in this project

1. Go to the demo/KeyframesDemo folder:

`bash
cd demo/KeyframesDemo
`

2. Install pod dependencies if running for iOS:

`bash
cd ios
pod install
cd ../
`

3. Run the project:

`bash
npm install
react-native run-ios
``

Demo

 

---
MIT Licensed