視頻播放有3種解決方案,使用HTML5的自帶video、從HBuilder9.1.3起新增的plus.video的原生視頻播放,以及使用Native.js。
-
HTML5自帶video標簽,可以播放符合HTML5規范的視頻格式。
注意不含flv、ra等三方商業公司的規范格式。
HTML5的video在Android上有較多瀏覽器兼容性問題,這里有篇網友分享的經典文章講述了HTML5 video的使用注意,強烈推薦觀看。
http://ask.dcloud.net.cn/article/569
注意事項,Android上使用video標簽播放視頻時,務必打開硬件加速,否則只有聲音沒有畫面。
HBuilder8.8.4以前的版本,在Android5的部分rom上是默認關閉硬件加速的,此時需強制打開硬件加速。創建webview時style里有個hardwareAccelerated參數,設置為true。
硬件加速的詳解參考文檔http://ask.dcloud.net.cn/article/55
視頻全屏播放時有時不能自動橫屏最大化,參考http://ask.dcloud.net.cn/article/1077
HTML5自帶video,如果想實現手勢拖動進度,這里有篇參考文章http://ask.dcloud.net.cn/article/13263,但受限於HTML5的性能,拖動無法流暢跟手。
iOS的視頻播放,使用uiWebview和wkWebview有不同效果,wkWebview的視頻播放自帶AirPlay功能,可以直接連接電視。但需要注意wkWebview和uiWebview的差異,詳見http://ask.dcloud.net.cn/article/1318 -
plus.video的原生視頻
很多開發者對於HTML5自帶視頻有幾處不滿:
a) 支持格式不豐富,比如flv
b) 全屏后手勢拖動不流暢,不能順滑的拖動進度和音量、亮度
在開發者提供直播推流時,5+引擎引入了專業視頻解碼庫,也就順便提供了plus.video的原生視頻播放能力。
但plus.video的原生視頻播放會增加不少包體積,需要開發者自己平衡好需求。
5+App里原生視頻控件需要使用js創建,參考http://www.html5plus.org/doc/zh_cn/video.html
uni-app里的video組件,默認不是HTML的video,默認就是原生video。
使用原生video注意它的層級較高,覆蓋原生控件,在5+app里使用plus.nativeObj.view,在uni-app里使用cover-view或plus.nativeObj.view都可以。 -
除了HTML5的video,開發者也可以在Android上使用Native.js調用系統播放器來放視頻。
但視頻的播放進度等狀態無法回傳給js層。
參考http://ask.dcloud.net.cn/question/614