1.0.2 • Published 2 years ago

react-native-corner-video v1.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

react-native-corner-video

Video component for React Native applications, that extends react-native-video library and supports the following options:

  • corner minimization
  • works across the tabs
  • works across the stacked screens
  • starts playng from the current time

You can minimize video via long press on it and swipe to any corner

 

Instalation

yarn add react-native-corner-video

or

npm install react-native-corner-video

Note: You need to install react-native-video, react-native-gesture-handler and react-native-reanimated libs. They represent native dependencies of the package!!

Usage

In the App.js file, wrap everything in VideoProvider component

import { VideoProvider } from 'react-native-corner-video';
//
export default function App() {
  return (
    <VideoProvider>
    //
    </VideoProvider>
  )
}

Import VideoWrapper where you want to render your video

import VideoWrapper from  'react-native-corner-video';
//
<VideoWrapper
  style={styles.video}
  cornerProps={{
    width: 150,
    height: 100,
    top: 50,
    bottom: 50,
    left: 7
    right: 7
  }}
  videoProps={{
    source: { uri: <video_uri> },
    resizeMode: 'cover',
    controls: true
  }}
/>

Props

cornerPropstyperequireddesc
widthnumbertrueminimized video width
heightnumbertrueminimized video width
topnumbertruedistance from top
bottomnumbertruedistance from bottom
leftnumbertruedistance from left
rightnumbertruedistance from right
videoPropsRNVideo propsVideoPropertiestrue
reffalsevideo ref
onPressvoidfalsehandles long press event