【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决
为了解决 HTML5Video视频标签自动播放与全屏问题,在网上找了很多相关资料,网上也很多关于此问题解决方法,但几乎都不能解决问题,特别对各大视频网站传回来的html5网页视频自动播放与全屏问题,我是这样解决的:
- webview.setWebChromeClient(new WebChromeClient() {
- public void onShowCustomView(View view, CustomViewCallback callback) {
- Log.e("Media", "onShowCustomView ............ ");
- if (myCallback != null) {
- myCallback.onCustomViewHidden();
- myCallback = null ;
- Log.e("Media", "myCallback.onCustomViewHidden()...");
- return;
- }
- long id = Thread.currentThread().getId();
- ViewGroup parent = (ViewGroup) webview.getParent();
- String s = parent.getClass().getName();
- Log.v("WidgetChromeClient", "rong debug Ex: " + s);
- parent.removeView( webview);
- parent.addView(view);
- myView = view;
- myCallback = callback;
- }
- private View myView = null;
- private CustomViewCallback myCallback = null;
- public void onHideCustomView() {
- long id = Thread.currentThread().getId();
- Log.v("Media", "onrong debug in hideCustom Ex: " + id);
- if (myView != null) {
- if (myCallback != null) {
- myCallback.onCustomViewHidden();
- myCallback = null ;
- }
- ViewGroup parent = (ViewGroup) myView.getParent();
- parent.removeView( myView);
- parent.addView(webview);
- myView = null;
- }
- }
- });
这段代码网上很多地方能找到的,但这是实现全屏播放的前提,一旦触发全屏事件,系统就会调用onShowCustomView方法
实现自动播放功能,就是在网络加载完成后,再延时一些时间如1s后,执行这JAVA脚本
- String js="javascript: var v=document.getElementsByTagName('video')[0]; "
- +"v.play(); ";
- webview.loadUrl(js);
这样就可以自动开始播放了
要实现让它自动全屏播放,可以执行这JAVA脚本:
- String js="javascript: var v=document.getElementsByTagName('video')[0]; "+"v.webkitEnterFullscreen(); ";
- webview.loadUrl(js);
注意实现全屏播放要在视频开始播放后,才能调用,否则可能会现异常
如果你想知道视频什么时候开始播放,就是得到视频开始播放事件,方法如下:
先在代码上定义这样接口
- private final class DemoJavaScriptInterface
- {
- DemoJavaScriptInterface(){}
- public void clickonAndroid(){
- Toast.makeText(getApplicationContext(), "视频开始播放...",Toast.LENGTH_SHORT).show();
- }
- public void endonAndroid(){
- Toast.makeText(getApplicationContext(), "视频结束",Toast.LENGTH_SHORT).show();
- }
- }
- webview.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");
然后在在视频开始播放之前,执行这JAVA脚本
- String js="javascript: var v=document.getElementsByTagName('video')[0]; "
- +"v.addEventListener('playing', function() { window.demo.clickonAndroid(); }, true); ";
- webview.loadUrl(js);
当然了你也可以得到视频播放结束事件执行这JAVA脚本
- String js="javascript: var v=document.getElementsByTagName('video')[0]; "
- +"v.addEventListener('ended', function() { window.demo.endonAndroid(); }, true); ";
- webview.loadUrl(js);
一般在android平台上,网络视频网站可能不会给你传回Html5 Video网页,这时候就可以设置UserAgent,如可能设置成IPhone或IPad环境,让它返回tml5 Video网页
- webview.getSettings().setUserAgentString("Mozilla/5.0 (iPad; CPU OS 5_1 " +
- "like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko ) Version/5.1 " +
- "Mobile/9B176 Safari/7534.48.3");
以上方法就是我在Android 网页视频一些心得,也许能给在你这方面开发提供帮助
【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决的更多相关文章
- HTML5 video 视频标签 常用属性
最近在做手机端的 h5 页面的视频直播功能,用到了 Video 标签.其常用的属性有以下几个: src.poster.preload.autoplay.loop.controls.width.heig ...
- HTML5 video 视频标签全属性详解
现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...
- iphone H5视频行内播放(禁止全屏播放)
一般用户都知道,ios在网页点击视频播放时,视频会弹出全屏播放框. video标签的playsinline.webkit-playsinline标记根本就不会起作用. 还有传闻说对于没有声音的视频不会 ...
- 让所有浏览器支持HTML5 video视频标签
HTML5究竟需要多少种视频编码格式 当前,video 元素支持三种视频格式:Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件MPEG4 = 带有 H.264 视频编 ...
- video视频标签一些设置,包括封面、播放结束后的封面、视频占满屏幕的方式、视频播放暂停、展示控制栏、触发全屏播放事件
video视频标签一些设置,包括封面.播放结束后的封面.视频占满屏幕的方式.视频链接.视频播放暂停.展示控制栏.触发全屏播放事件 <video id="video" auto ...
- HTML video 视频标签全属性详解
HTML 5 video 视频标签全属性详解 现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.C ...
- HTML5 Video(视频)
HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 HTML5 视频: 检测 Web站点上的视频 直到现在,仍然不存在一项旨在网页上显 ...
- HTML5: HTML5 Video(视频)
ylbtech-HTML5: HTML5 Video(视频) 1.返回顶部 1. HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 ...
- HTML5中音频视频标签使用
HTML5中音频视频标签使用的最好方式 Html5中提供了<audio> <vedio>元素实现音频视频的引入播放 然而更好的方式
随机推荐
- mysql数据转sql server
创建一个mysql的ODBC数据源,在sql server中“任务”-“导入数据” -“选择创建的ODBC数据源” 然后填写服务器 登录名.密码,需要导入的数据库表什么的
- vue启动
首先在终端terminal连上npm 镜像库 npm config set registry https://registry.npm.taobao.orgnpm installnpm run loc ...
- 移动端响应式rem
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? ...
- Ubuntu下安装oh-my-zsh
本文参考 https://www.jianshu.com/p/9a5c4cb0452d 此文已在ubuntu下确实安装成功,只不过懒得截图了,可以参照上述地址,我在他原基础上进行了一些更改. 安装Oh ...
- python list排序(正倒)以及获取重复数据
mylist = [2,2,2,2,5,5,7,2,2,3,3,3,3] #<class 'list'>: [2, 2, 2, 2, 5, 5, 7, 2, 2, 3, 3, 3, 3] ...
- DemoKit编译过程错误
1.编译出错: 2.原因(将代码注释):
- Git--删除远程仓库文件但不删除本地仓库资源
我们在使用idea开发的过程中经常会出现新建项目的时候直接把xxx.iml文件也添加到了git trace 当然这并不会出现什么问题,问题是当我们把xxx.iml文件push到我们github上之后, ...
- noip模拟赛 enc
[问题背景]zhx 和他的妹子聊天.[问题描述]考虑一种简单的加密算法.假定所有句子都由小写英文字母构成, 对于每一个字母, 我们将它唯一地映射到另一个字母. 例如考虑映射规则:a->b, b- ...
- poj 3164 最小树形图模板!!!
/* tle十几次,最后发现当i从1开始时,给环赋值时要注意啊! 最小树形图 */ #include<stdio.h> #include<string.h> #include& ...
- 公众号开发 jsp中<a>问题
在开发微信公众号时,使用了jQuery mobile这个框架,但是在jsp页面中使用<a>发现点击跳转不成功,这就很奇怪了,网上搜索发现大家基本上用js来代替<a>跳转功能: ...