CODEWITHSUNDEEP
react-native
John Conti
John Conti

Reputation: 31

Converting portrait video to landscape React-Native Android

My issue right now is when videos that were recorded in portrait mode get cut off or zoomed in when watching them in landscape. What is happening is the user has to scroll down to see the length of the video because the width is set to 100%. I am able to add 35% left and right padding to the view styling to make the video fit the screen but it doesn't seem very robust as it still gets slightly cut off on different devices. Is there any styling advice for this situation? I am new to this so if you want any more information regarding the problem let me know.

Upvotes: 2

Views: 778

Answers (1)

Dev
Dev

Reputation: 98

You can try wrapping up the <Video /> component inside a parent <View /> with flex: 1. Something like this will work -

<View style={{flex: 1}}>
   <View style={{flex: 1}}/>
   <Video style={{flex: 1}} resizeMode="contain" />
   <View style={{flex: 1}}/>
</View>

resizeMode="contain" will maintain the aspect ration of the video and the other two <View />s will occupy equal space causing the portrait video to render in landscape.

Upvotes: 1

Related Questions