前言
不知道還有多少小伙伴在用系統(tǒng)的VideoView用來(lái)播放視頻,應(yīng)該一直有一個(gè)問(wèn)題困擾的大家吧滑频,那就是播放前的一小段黑屏問(wèn)題给涕。無(wú)論是首次播放黑屏還是視頻切換黑屏,一個(gè)看似小小的問(wèn)題迅腔,卻非常難以解決。最近我們app需要播放一些簡(jiǎn)單的教程視頻靠娱,不值得引入三方庫(kù)增大包體積沧烈,所以就用了VideoView,黑屏問(wèn)題就來(lái)了像云。本篇旨在徹底解決黑屏的問(wèn)題锌雀。
單個(gè)視頻播放前的黑屏
這個(gè)問(wèn)題很好解決,網(wǎng)上也有一堆的教程迅诬。不過(guò)最近在我測(cè)試的過(guò)程中發(fā)現(xiàn)這些教程有時(shí)候并不能解決問(wèn)題腋逆。所以我?guī)?lái)我解決問(wèn)題的方式。
首先需要給VideoView
一個(gè)單獨(dú)的ImageView
設(shè)置背景百框,并且這個(gè)ImageView
的繪制級(jí)別一定要高于VideoView
闲礼,保證VideoView
和ImageView
都顯示的情況下,能讓ImageView
蓋住VIdeoView
铐维。
比如說(shuō)柬泽,我們用自定義一個(gè)布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<VideoView
android:id="@+id/simple_video_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:layout_margin="1px"
android:layout_alignParentTop="true" />
<ImageView
android:id="@+id/simple_video_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:background="@color/app_background" />
</RelativeLayout>
此時(shí)ImageView肯定會(huì)蓋住VideoView,顯示一個(gè)背景色嫁蛇。
然后需要在代碼中設(shè)置以下:
private fun initVideoView() {
binding.simpleVideoView.setOnPreparedListener {
it.setVideoScalingMode(MediaPlayer.VIDEO_SCALING_MODE_SCALE_TO_FIT_WITH_CROPPING)
binding.simpleVideoView.setOnInfoListener { _, what, _ ->
if (what == MediaPlayer.MEDIA_INFO_VIDEO_RENDERING_START) {
binding.simpleVideoBg.visibility = GONE
}
true
}
binding.simpleVideoView.start()
}
}
這個(gè)大家看過(guò)其他教程的情況下都理解是什么意思锨并,唯一不同的區(qū)別在于用我們?cè)趚ml中配置的ImageView來(lái)替代設(shè)置VideoView的背景。
同時(shí)給ImageView渲染下視頻的第一幀睬棚,可以用Glide來(lái)實(shí)現(xiàn)第煮。Glide可以加載視頻資源到ImageView上,就是加載的第一幀抑党。
這樣視頻播放的情況下就比較完美了包警,視頻渲染完成前會(huì)展示視頻第一幀,渲染完成后底靠,背景ImageView會(huì)隱藏害晦,顯示出被蓋住的VideoView,避開(kāi)了VIdeoView渲染視頻時(shí)的黑色背景暑中。
視頻來(lái)回切換導(dǎo)致黑屏
如果是在一個(gè)VideoView切換不同的視頻源壹瘟,并不會(huì)導(dǎo)致黑屏鲫剿。出現(xiàn)黑屏的情況在于使用多個(gè)VideoView來(lái)回切換的情況下,比如ViewPager左右切換稻轨,首次播放的情況下灵莲,用我們上邊的辦法是可以解決黑屏問(wèn)題,但來(lái)回切換就會(huì)發(fā)現(xiàn)黑屏又出現(xiàn)了殴俱。
問(wèn)題在于切換的后VideoView會(huì)被銷毀回收政冻,下次切換回來(lái)重新渲染視頻。而我們的背景ImageView已經(jīng)隱藏掉了线欲。
解決問(wèn)題的關(guān)鍵就在于切換走的VideoView要將背景色I(xiàn)mageView重新顯示出來(lái)就ok了赠幕。
不過(guò)不能在setOnPreparedListener中設(shè)置ImageView的顯示,不會(huì)有任何效果询筏,這種問(wèn)題要結(jié)合自己使用的控件來(lái)靈活處理。比如我們使用了ViewPager2竖慧,那就這樣處理:
private var oldPosition = 0
fun initValue() {
binding.commonNoviceCourseViewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
override fun onPageSelected(position: Int) {
if (oldPosition == position) return
val video = adapter.getViewByPosition(oldPosition, R.id.common_novice_course_video) as SimpleVideoView
video.getVideoBg().visibility = View.VISIBLE
oldPosition = position
}
})
}
使用的BaseQuickAdapter嫌套,就可以這么處理了。
這樣切換的時(shí)候圾旨,也就可以比較完美的展示首幀視頻踱讨,不會(huì)出現(xiàn)黑屏了。