Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to trigger full-screen mode on play for embedded YouTube video in React Native WebView?

I have a YouTube video embedded in a React Native WebView. I'm using the react-native-android-fullscreen-webview-video library for Android which works well in both portrait and landscape mode, but I need the video to default to fullscreen when the user presses play.

I've tried other libraries for this, including react-native-youtube, but each resulted in buggy playback either in portrait or landscape.

This is my code. Everything works well, I just need fullscreen play by default.

<WebView source={{ uri: videoUrl }} />
like image 793
bshook Avatar asked Jan 26 '23 12:01

bshook


1 Answers

This is working fine for me

<WebView
 javaScriptEnabled={true}
 scrollEnabled={false}
 allowsFullscreenVideo={true}
 userAgent="Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 
 (KHTML, like Gecko) Chrome/77.0.3865.90 Safari/537.36"
 source={{uri: `https://www.youtube.com/embed/${videoID}?&autoplay=1&mute=1&showinfo=0&controls=1&fullscreen=1`}}
 style={styles.video}
/>

like image 76
Shubham Ram Avatar answered Jan 29 '23 11:01

Shubham Ram