x5webview 自定义全屏界面
集成X5WEBVIEW可以选择全屏模式为标准全屏还是x5全屏,而不设置默认为false。
首先看看标准全屏的基本设置,
if (webView.getX5WebViewExtension() != null) {
Bundle data = new Bundle();
data.putBoolean("standardFullScreen", false);// true表示标准全屏,false表示X5全屏;不设置默认false,
data.putBoolean("supportLiteWnd", false);// false:关闭小窗;true:开启小窗;不设置默认true,
data.putInt("DefaultVideoScreen", 1);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1
webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
}
如果使用的是标准全屏那么,显示页面如下:

可以看到典型的 可以横竖屏切换的按钮,锁屏的按钮,缓存和分享的按钮以及视频名标题。 这些内容在一些场景下是可能不希望看到显示的,比如缓存按钮,比如使用模板打开的页面分享出来是模板地址。
因此需要一种标准的全屏模式,而非x5全屏模式。
使用标准全屏模式代码如下:
if (webView.getX5WebViewExtension() != null) {
Bundle data = new Bundle();
data.putBoolean("standardFullScreen", true);// true表示标准全屏,false表示X5全屏;不设置默认false,
data.putBoolean("supportLiteWnd", false);// false:关闭小窗;true:开启小窗;不设置默认true,
data.putInt("DefaultVideoScreen", 1);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1
webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
}
需要在内部处理全屏的交互,在布局中增加代码如下:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webViewLayout"
android:orientation="vertical">
<!-- 视频全屏-->
<FrameLayout
android:id="@+id/video_fullView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/black"
android:visibility="gone"> <TextView
android:id="@+id/tv_touch"
android:layout_width="150dp"
android:layout_height="45dp"
android:layout_gravity="right"
android:layout_marginTop="20dp"
android:background="@color/transparent" />
</FrameLayout>
</FrameLayout>
首先添加 一个webviewChromeClient,处理onShowCustomView、onHideCustomView两个方法的回调。在类中添加如下代码
private IX5WebChromeClient.CustomViewCallback xCustomViewCallback;
private FrameLayout video_fullView;// 全屏时视频加载view
private View xCustomView;
private com.tencent.smtt.sdk.WebChromeClient xwebchromeclient = new com.tencent.smtt.sdk.WebChromeClient() {
@Override
public void onProgressChanged(com.tencent.smtt.sdk.WebView webView, int percent) {
super.onProgressChanged(webView, percent);
if (percent > 40) {
webView.setVisibility(View.VISIBLE);
}
} // 拦截全屏调用的方法
@Override
public void onShowCustomView(View view, IX5WebChromeClient.CustomViewCallback callback) {
super.onShowCustomView(view, callback);
getActivity().setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
Log.e("my","onShowCustomView----xCustomView:" + xCustomView);
webView.setVisibility(View.INVISIBLE);
// 如果一个视图已经存在,那么立刻终止并新建一个
if (xCustomView != null) {
callback.onCustomViewHidden();
return;
}
view.setVisibility(View.VISIBLE);
video_fullView.addView(view);
xCustomView = view;
xCustomView.setVisibility(View.VISIBLE);
xCustomViewCallback = callback;
video_fullView.setVisibility(View.VISIBLE);
} @Override
public void onHideCustomView() {
super.onHideCustomView();
Log.e("my","onHideCustomView----xCustomView:" + xCustomView);
if (xCustomView == null){
// 不是全屏播放状态
return;
}
getActivity().setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
xCustomView.setVisibility(View.GONE);
video_fullView.removeView(xCustomView);
xCustomView = null;
video_fullView.setVisibility(View.GONE);
xCustomViewCallback.onCustomViewHidden();
webView.setVisibility(View.VISIBLE);
}
};
/**
* 判断是否是全屏
*
* @return
*/
public boolean inCustomView() {
return (xCustomView != null);
} /**
* 全屏时按返加键执行退出全屏方法
*/
public void hideCustomView() {
xwebchromeclient.onHideCustomView();
getActivity().setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
}
设置x5webview的webchrome,代码如下:
webView.setWebChromeClient(xwebchromeclient);
为了处理返回事件,还需要加上如下代码:
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (inCustomView() && keyCode == KeyEvent.KEYCODE_BACK) {
hideCustomView();
return ;
}
return super.onKeyDown(keyCode, event);
}
这样就大功告成。
X5webview完美去掉分享功能和缓存功能(2)
x5webview 自定义全屏界面的更多相关文章
- iOS Swift WisdomScanKit二维码扫码SDK,自定义全屏拍照SDK,系统相册图片浏览,编辑SDK
iOS Swift WisdomScanKit 是一款强大的集二维码扫码,自定义全屏拍照,系统相册图片编辑多选和系统相册图片浏览功能于一身的 Framework SDK [1]前言: 今天给大家 ...
- android4.4上全屏界面实现禁止状态栏下拉
附上我改动的方法:PhoneWindowManager.java里面的改动 --- a/frameworks/base/policy/src/com/android/internal/policy/i ...
- iOS自定义全屏返回与tableView左划删除手势冲突解决
当自定义一个navigationController实现全屏右划返回时, 使用起来是不是很爽, 代码如下: - (void)viewDidLoad { [super viewDidLoad]; UIG ...
- JQuery+Bootstrap 自定义全屏Loading插件
/** * 自定义Loading插件 * @param {Object} config * { * content[加载显示文本], * time[自动关闭等待时间(ms)] * } * @param ...
- 自定义一个全屏的AlertDialog。
........... final MyDialog dialog = new MyDialog(this); LayoutInflater inflater = getLayoutInflater( ...
- iOS端一次视频全屏需求的实现(转)
对于一个带有视频播放功能的app产品来说,视频全屏是一个基本且重要的需求.虽然这个需求看起来很简单,但是在实现上,我们前后迭代了三套技术方案.这篇文章将介绍这三种实现方案中的利弊和坑点,以及实现过程中 ...
- javascript full screen 全屏显示 页面元素
javascript full screen 全屏显示 页面元素 要想让页面的某个元素全屏显示,就像在网页上看视频的时候,可以全屏观看一样,该怎么实现呢? 一种最简单的方式,就是动态改变你想要全屏显示 ...
- 给echarts加个“全屏展示”
echarts的工具箱并没有提供放大/全屏的功能, 查找文档发现可自定义工具https://www.echartsjs.com/option.html#toolbox.feature show代码 t ...
- VM虚拟机全屏显示
在虚拟机中使用全屏界面会有更强的用户体验.在编辑该文章的时候就是在使用虚拟机windows2008 R2系统.我的笔记本是苹果双系统.虚拟机安装在win7 64位系统下 1.首先查看主机的屏幕分辨率 ...
随机推荐
- Mycat问题总结
Mycat问题总结 一丶自增主键设置 Mycat提供了几种设置自增主键的方式 本地文件方式 数据库方式 服务器时间戳方式 分布式ZK-ID生成器 第一种和第二种只适合单点设置,对于集群不适用.第四种方 ...
- November 28th 2016 Week 49th Monday
You only live once, but if you do it right, once is enough. 年华不虚度,一生也足矣. One today can win two tomor ...
- debian 7 终端上无法调出输出法
debian 7 终端konsole上无法调出输出法,无法输入汉字的问题解决方案, export GTK_IM_MODULE=fcitxexport QT_IM_MODULE=fcitxexport ...
- JavaScript的DOM操作获取元素的大小
通过 style 内联获取元素的大小 需要注意的是style 获取只能获取到行内 style 属性的 CSS 样式中的宽和高,如果有获取:如果没有则返回空. <!DOCTYPE html> ...
- 编译Console程序时,可以指定Main入口函数
有如下简单的console程序 using System; namespace HelloWorld { class Program { static void Main(string[] args) ...
- 3631. [JLOI2014]松鼠的新家【树形DP】
Description 松鼠的新家是一棵树,前几天刚刚装修了新家,新家有n个房间,并且有n-1根树枝连接,每个房间都可以相互到达,且俩个房间之间的路线都是唯一的.天哪,他居然真的住在“树”上.松鼠想邀 ...
- 10分钟安装OpenStack
1 OpenStack初学者的苦恼 2 OpenStack最低配置要求 3 配置UOS环境 3.1 设置网络 3.1.1 创建路由器 3.1.2 创建网络 3.1.3 创建两个子网 3.2 创建UOS ...
- js之点击值发生变化
点击值发生变化,应用场景,比如像阿里云那样我通常密码是以******的形式存在,我必须要点击查看,它才会以明文显示. 在实际开发中,比如以智能门锁为例,安装门锁时,有个叫密码输入框的表单,这个是选填项 ...
- cocoapods导入三方库头文件找不到问题
问题描述:使用cocoapods时,import 找不到头文件. 问题原因: 1.缓存导致 2.没设置头文件的目录. 1.解决办法: command + k 清理工程 ,找到DerivedData文件 ...
- weex中UISegmentControl实现及遇到的问题
在最近主导的一个项目中,App端的实现使用了weex.通过近一个月的实践,我们发现如果对于人机交互较少的App,即使较少前端经验的人也能迅速进入开发(当然需要一定时间 才能上手weex).在开发的时候 ...