Getting Started

Installation

• Go to the project folder in terminal and run the following code:

Yarn

yarn add @tra-tech/react-native-kitra

npm

npm install @tra-tech/react-native-kitra

• Packages you need to download separately to use:

React Native CLI

react-native-reanimated

yarn

yarn add react-native-reanimated

npm

npm install react-native-reanimated

Click for react-native-reanimated installation instructions.

react-native-gesture-handler

yarn

yarn add react-native-gesture-handler

npm

npm install react-native-gesture-handler

Click for react-native-gesture-handler installation instructions.

react-native-vector-icons

yarn

yarn add react-native-vector-icons

npm

npm install react-native-vector-icons

Click for react-native-vector-icons installation instructions.

react-native-pager-view

yarn

yarn add react-native-pager-view

npm

npm install react-native-pager-view

Click for react-native-pager-view installation instructions.

Expo

react-native-reanimated

npx expo install react-native-reanimated

After the installation completes, you must also add the Babel plugin to babel.config.js:

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: ['react-native-reanimated/plugin'],
  };
};

react-native-gesture-handler

npx expo install react-native-gesture-handler

Add this import to the top of your app entry file, such as App.js:

import 'react-native-gesture-handler';

react-native-pager-view

npx expo install react-native-pager-view

Implementation

Wrap your root component in KitraProvider from react-native-kitra.

import { KitraProvider } from '@tra-tech/react-native-kitra';
import App from './src/App';

export default function Main() {
  return (
    <KitraProvider>
      <App />
    </KitraProvider>
  );
}