https://github.com/status-im/react-native-transparent-video
React Native video player with alpha channel (alpha-packing) support.
https://github.com/status-im/react-native-transparent-video
Last synced: 1 day ago
JSON representation
React Native video player with alpha channel (alpha-packing) support.
- Host: GitHub
- URL: https://github.com/status-im/react-native-transparent-video
- Owner: status-im
- License: mit
- Created: 2023-05-04T18:51:51.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-14T22:16:10.000Z (over 1 year ago)
- Last Synced: 2025-04-15T18:08:00.070Z (7 days ago)
- Language: Java
- Size: 7.44 MB
- Stars: 22
- Watchers: 4
- Forks: 15
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# react-native-transparent-video
React Native video player with alpha channel (alpha-packing) support. It works on iOS and Android.
Example of a mp4 video with alpha-packing:
https://github.com/status-im/react-native-transparent-video/assets/18485527/69ea988e-0c7d-4123-84a1-1ca46b61994e
### Recommendations
To achieve best compatibility across different Android devices and versions, please check the [video encoding recommendations](https://developer.android.com/guide/topics/media/media-formats#video-encoding) from the Android documentation portal.
## Installation
```sh
npm install @status-im/react-native-transparent-video
```
or
```sh
yarn add @status-im/react-native-transparent-video
```
## Usage
```js
import TransparentVideo from '@status-im/react-native-transparent-video';
const video = require('../assets/video.mp4');
function App() {
return (
);
}
const styles = StyleSheet.create({
transparentVideo: {
position: 'absolute',
top: 0,
left: 0,
right: 0,
bottom: 0,
},
});
```
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## Recognition
Special thanks to:
- Quentin Fasquel for this [Medium article](https://medium.com/@quentinfasquel/ios-transparent-video-with-coreimage-52cfb2544d54)
- Tristan Ferré for this [Medium article](https://medium.com/go-electra/unlock-transparency-in-videos-on-android-5dc43776cc72)
- [@pavelsemak](https://www.github.com/pavelsemak) for creating [this repository](https://github.com/pavelsemak/alpha-movie) and [@nopol10](https://www.github.com/nopol10) for [this fork](https://github.com/nopol10/alpha-movie) which implements the alpha-packing approach that was used to build this React Native library
## License
MIT