react-native-motion

Animate it! Easily!

Change your application from the left one to the right one! Animate it! Easily! Animated Transition Article or Animated Graph Article

Getting Started

$ yarn add react-native-motion

Usage of SharedElement

We need to specify source and destination for shared element. This library then will move the shared element from source position to destination position.

class Main extends Component {
  render() {
    return (
      
        
      
    );
  }
}
// List items page with source of SharedElement
import { SharedElement } from 'react-native-motion';

class ListPage extends Component {
  render() {
    return (
      
        {listItemNode}
      
    );
  }
}
// Detail page with a destination shared element
import { SharedElement } from 'react-native-motion';

class DetailPage extends Component {
  render() {
    return (
      
        {listItemNode}
      
    );
  }
}

Subscribe to the Newsletter

Get our latest news,tutorials,guides,tips & deals delivered to your inbox.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.