My app displays YouTube videos using CustomWebView and reading the iframe for the video.
Sample iframe
<! DOCTYPE html> <html> <body> <div id = "player"> </div> <script> var tag = document.createElement ('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName ('script') [0]; firstScriptTag.parentNode.insertBefore (tag, firstScriptTag); var player; function onYouTubeIframeAPIReady () {player = new YT.Player ('player', {height: '515', width: '950', videoId: 'DqM7xvLPfxU', playerVars: {'playsinline': 1}, events: {'onReady ': onPlayerReady,' onStateChange ': onPlayerStateChange}}); } function onPlayerReady (event) {event.target.playVideo (); } var done = false; function onPlayerStateChange (event) {if (event.data == YT.PlayerState.PLAYING &&! done) {setTimeout (stopVideo, 35000); done = true; }} function stopVideo () {player.stopVideo (); } </script> </body> </html>
The application works, but I would like the movie to be displayed without cross black stripes. I tried changing the height and width in the iframe but with no success. I would like the movie to be displayed on the entire screen of the smartphone, I get this effect after pressing the icon (the entire screen)
How to do it programmatically?