Menu
YouTube Android Player API SDK has been fully deprecated. It is no longer supported or maintained by YouTube. So need to implement YouTube IFrame Player API in Android.
When play an YouTube video "An error occurred while initializing YouTube player" message shows.
681
asked Oct 16 '25 09:10
As per developer.google documentation https://developers.google.com/youtube/iframe_api_reference I create a sample app using IFrame YouTube player for android using Kotlin and jetpack compose.
use the below dependency
implementation "androidx.webkit:webkit:1.4.0"
Give internet permission in Manifest.xml
uses-permission android:name="android.permission.INTERNET"
Create a Compose function
@Composable
fun YoutubeVideoPlayer(videoId: String) {
val webView = WebView(LocalContext.current).apply {
settings.javaScriptEnabled = true
settings.loadWithOverviewMode = true
settings.useWideViewPort = true
webViewClient = WebViewClient()
}
val htmlData = getHTMLData(videoId)
Column(Modifier.fillMaxSize()) {
AndroidView(factory = { webView }) { view ->
view.loadDataWithBaseURL(
"https://www.youtube.com",
htmlData,
"text/html",
"UTF-8",
null
)
}
Button(onClick = {
webView.loadUrl("javascript:playVideo();")
}) {
Text(text = "Play Video")
}
Button(onClick = {
webView.loadUrl("javascript:pauseVideo();")
}) {
Text(text = "Pause Video")
}
Button(onClick = {
webView.loadUrl("javascript:seekTo(60);")
}) {
Text(text = "Seek Video")
}
}
}
Use getHTMLData function to load the HTML page contain IFrame
fun getHTMLData(videoId: String): String {
return """
<html>
<body style="margin:0px;padding:0px;">
<div id="player"></div>
<script>
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '450',
width: '650',
videoId: '$videoId',
playerVars: {
'playsinline': 1
},
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
player.playVideo();
// Player is ready
}
function seekTo(time) {
player.seekTo(time, true);
}
function playVideo() {
player.playVideo();
}
function pauseVideo() {
player.pauseVideo();
}
</script>
<script src="https://www.youtube.com/iframe_api"></script>
</body>
</html>
""".trimIndent()
}
Call compose function in Main activity
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
Column {
YoutubeVideoPlayer(videoId = "bHQqvYy5KYo")
}
}
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With