转载请标明转载处:http://bbs.csdn.net/topics/390839259

本人刚学android,菜鸟一个,第一次写帖子,最近因为项目要用webview加载html5的视频,开始不能全屏播,做了很久才做出来!那按我的理解说下怎么实现全屏吧。
首先写布局文件activity_main.xml:

XML/HTML code

 

?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">
    <FrameLayout 
        android:id="@+id/video_view"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:visibility="gone"
        ></FrameLayout>
    <Button 
        android:id="@+id/video_landport"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="全屏不显示该按扭,点击切换横屏"
        android:gravity="center"
        />
    <WebView 
        android:id="@+id/video_webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />
    </LinearLayout>

原理:实现全屏的时候把webview里的视频放到一个View(布局里的video_view控件)里面,然后把webview隐藏掉!这样就实现了全屏播放的!
现在具体来看看怎么实现的:
先放代码MainActivity.java:

Java code

 

?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
public class MainActivity extends Activity {
 
    private FrameLayout videoview;// 全屏时视频加载view
    private Button videolandport;
    private WebView videowebview;
    private Boolean islandport = true;//true表示此时是竖屏,false表示此时横屏。
    private View xCustomView;
    private xWebChromeClient xwebchromeclient;
    private String url = "http://look.appjx.cn/mobile_api.php?mod=news&id=12604";
    private WebChromeClient.CustomViewCallback     xCustomViewCallback;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);//去掉应用标题
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_main);
        initwidget();
        initListener();
        videowebview.loadUrl(url);
    }
 
    private void initListener() {
        // TODO Auto-generated method stub
        videolandport.setOnClickListener(new Listener());
    }
 
    private void initwidget() {
        // TODO Auto-generated method stub
        videoview = (FrameLayout) findViewById(R.id.video_view);
        videolandport = (Button) findViewById(R.id.video_landport);
        videowebview = (WebView) findViewById(R.id.video_webview);
        WebSettings ws = videowebview.getSettings();
        /**
         * setAllowFileAccess 启用或禁止WebView访问文件数据 setBlockNetworkImage 是否显示网络图像
         * setBuiltInZoomControls 设置是否支持缩放 setCacheMode 设置缓冲的模式
         * setDefaultFontSize 设置默认的字体大小 setDefaultTextEncodingName 设置在解码时使用的默认编码
         * setFixedFontFamily 设置固定使用的字体 setJavaSciptEnabled 设置是否支持Javascript
         * setLayoutAlgorithm 设置布局方式 setLightTouchEnabled 设置用鼠标激活被选项
         * setSupportZoom 设置是否支持变焦
         * */
        ws.setBuiltInZoomControls(true);// 隐藏缩放按钮
        ws.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);// 排版适应屏幕
        ws.setUseWideViewPort(true);// 可任意比例缩放
        ws.setLoadWithOverviewMode(true);// setUseWideViewPort方法设置webview推荐使用的窗口。setLoadWithOverviewMode方法是设置webview加载的页面的模式。
        ws.setSavePassword(true);
        ws.setSaveFormData(true);// 保存表单数据
        ws.setJavaScriptEnabled(true);
        ws.setGeolocationEnabled(true);// 启用地理定位
        ws.setGeolocationDatabasePath("/data/data/org.itri.html5webview/databases/");// 设置定位的数据库路径
        ws.setDomStorageEnabled(true);
        xwebchromeclient = new xWebChromeClient();
        videowebview.setWebChromeClient(xwebchromeclient);
        videowebview.setWebViewClient(new xWebViewClientent());
    }
 
    class Listener implements OnClickListener {
        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            switch (v.getId()) {
            case R.id.video_landport:
                if (islandport) {
                    setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
                    videolandport.setText("全屏不显示该按扭,点击切换横屏");
                }else {
                    setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); 
                    videolandport.setText("全屏不显示该按扭,点击切换竖屏");
                }
                break;
            default:
                break;
            }
        }
    }
       @Override
        public boolean onKeyDown(int keyCode, KeyEvent event) {
            if (keyCode == KeyEvent.KEYCODE_BACK) {
                if (inCustomView()) {
                    hideCustomView();
                    return true;
                }else {
                videowebview.loadUrl("about:blank");
//                    mTestWebView.loadData("", "text/html; charset=UTF-8", null);
                MainActivity.this.finish();
                    Log.i("testwebview""===>>>2");
            }
            }
            return true;
        }
       /**
        * 判断是否是全屏
        * @return
        */
        public boolean inCustomView() {
             return (xCustomView != null);
         }
         /**
          * 全屏时按返加键执行退出全屏方法
          */
         public void hideCustomView() {
             xwebchromeclient.onHideCustomView();
         }
    /**
     * 处理Javascript的对话框、网站图标、网站标题以及网页加载进度等
     * @author
     */
    public class xWebChromeClient extends WebChromeClient {
        private Bitmap xdefaltvideo;
        private View xprogressvideo;
        @Override
        //播放网络视频时全屏会被调用的方法
        public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback)
        {
            if (islandport) {
            }
            else{
                 
//                ii = "1";
//                setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); 
            }
            setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); 
            videowebview.setVisibility(View.GONE);
            //如果一个视图已经存在,那么立刻终止并新建一个
            if (xCustomView != null) {
                callback.onCustomViewHidden();
                return;
            }            
            videoview.addView(view);
            xCustomView = view;
            xCustomViewCallback = callback;
            videoview.setVisibility(View.VISIBLE);
        }
         
        @Override
        //视频播放退出全屏会被调用的
        public void onHideCustomView() {
             
            if (xCustomView == null)//不是全屏播放状态
                return;                      
            // Hide the custom view.
            setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); 
            xCustomView.setVisibility(View.GONE);
             
            // Remove the custom view from its container.
            videoview.removeView(xCustomView);
            xCustomView = null;
            videoview.setVisibility(View.GONE);
            xCustomViewCallback.onCustomViewHidden();
             
            videowebview.setVisibility(View.VISIBLE);
             
            //Log.i(LOGTAG, "set it to webVew");
        }
        //视频加载添加默认图标
        @Override
        public Bitmap getDefaultVideoPoster() {
            //Log.i(LOGTAG, "here in on getDefaultVideoPoster");   
            if (xdefaltvideo == null) {
                xdefaltvideo = BitmapFactory.decodeResource(
                        getResources(), R.drawable.videoicon);
            }
            return xdefaltvideo;
        }
        //视频加载时进程loading
        @Override
        public View getVideoLoadingProgressView() {
            //Log.i(LOGTAG, "here in on getVideoLoadingPregressView");
             
            if (xprogressvideo == null) {
                LayoutInflater inflater = LayoutInflater.from(MainActivity.this);
                xprogressvideo = inflater.inflate(R.layout.video_loading_progress, null);
            }
            return xprogressvideo; 
        }
        //网页标题
         @Override
         public void onReceivedTitle(WebView view, String title) {
            (MainActivity.this).setTitle(title);
         }
 
//         @Override
//       //当WebView进度改变时更新窗口进度
//         public void onProgressChanged(WebView view, int newProgress) {
//             (MainActivity.this).getWindow().setFeatureInt(Window.FEATURE_PROGRESS, newProgress*100);
//         }      
    }
    /**
     * 处理各种通知、请求等事件
     * @author
     */
    public class xWebViewClientent extends WebViewClient {
         @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                Log.i("webviewtest""shouldOverrideUrlLoading: "+url);
                return false;
            }
    }
    /**
     * 当横竖屏切换时会调用该方法
     * @author
     */
    @Override
    public void onConfigurationChanged(Configuration newConfig) {
        Log.i("testwebview""=====<<<  onConfigurationChanged  >>>=====");
         super.onConfigurationChanged(newConfig);
          
         if(newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE){
             Log.i("webview""   现在是横屏1");
             islandport = false;
            }else if(newConfig.orientation == Configuration.ORIENTATION_PORTRAIT){
             Log.i("webview""   现在是竖屏1");
             islandport = true;
            }
    }
}

代码里面我写了好多注释,相信大家都能看得懂,当然本人是菜鸟,可能有些地方理解错了!知道的可以跟我说。然后我在里面加了一个功能,就是点击webview上面按钮切换横竖屏!还有就是当点击全屏播放的时候强制横屏全屏播放,点击返回时回到竖屏!我这里没有用手机重力感应切换横竖屏!代码里面还加了个播放进度的布局文件,大家在源码里可以看到!
最后说下AndroidManifest.xml设置;
访问网络权限加上这句
<uses-permission android:name="android.permission.INTERNET"/>
当切换横竖屏时为了不重新调用onCreate等方法,要加个这句:
android:configChanges="orientation|keyboardHidden|screenSize"
差不多这样就可以实现全屏播放了,如果有看不懂的问题可以问我,
源码下载地址:http://download.csdn.net/download/ysjyygywfn/7657933

Android之针对WebView的全屏播放的更多相关文章

  1. Android中使用WebView实现全屏切换播放网页视频

    首先写布局文件activity_main.xml: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/an ...

  2. [转]Android WebView播放视频(包括全屏播放),androidwebview

    Android WebView播放视频(包括全屏播放),androidwebview 最近项目开发中用到了WebView播放视频的功能,总结了开发中犯过的错误,这些错误在开发是及容易遇到的,所以我这里 ...

  3. audio与video控件/标签的隐藏,iso/Android下自动全屏播放,短暂黑屏问题

    (一)audio音频标签 <audio src="xxx.mp3"></audio> (二)video视频标签 <video src="xx ...

  4. Android为TV端助力 集成第三方播放器,实现全屏播放

    下面这Demo链接:Android实现全屏播放,各种格式支持直播,点播,不收费!

  5. 解决video标签在微信中强制全屏、微信全屏播放(Android和IOS)

    在video标签中加上代码: x5-playsinline="true" webkit-playsinline="true" playsinline=" ...

  6. iOS APP 中H5视频默认全屏播放问题解决

    问题描述:在Android中,视频可以正常在H5页面局部播放,iOS中则自动切换至全屏模式. 查看资料得以解决,20190301记录下来. 解决方法:IOS10及以后,在 video标签页中只包含 w ...

  7. 腾讯X5内核使用详解(X5内核播放器使用如何去除控制栏全屏播放)以及一些注意事项

    例子下载地址 https://www.lanzous.com/i2zsv5g      GIT就不用了麻烦的不行 本人安卓刚学 就上X5内核弄了老长时间由于对maven 和idea不熟悉刚开始导包都是 ...

  8. HTML5新标签video在iOS上默认全屏播放

    今天做一个app时发现一个问题,应用html5中的video标签加载视频,在Android手机上默认播放大小,但是换成iPhone手机上出问题了,默认弹出全屏播放,查找了好多论坛,都没有谈论这个的.然 ...

  9. 用原生VideoView进行全屏播放时的问题

    之前参加了一个课程,里面有一节讲到了用视频作为启动界面.讲师用的是自定义VideoView,重写onMeasure方法,因为原生的VideoView在那情况下不能实现全屏播放.当时没有深入研究,现在补 ...

随机推荐

  1. http程序接口、调用(最入门级,文末附Demo)

    HTTP协议简介 既然是基于HTTP协议开发,那么就首先要了解下HTTP协议的相关内容- 在TCP/IP体系结构中,HTTP属于应用层协议,位于TCP/IP协议的顶层.浏览Web时,浏览器通过HTTP ...

  2. Javascript:JSON总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它是基于ECMAScript的一个子集,采用完全独立于语言的文本格式.这些特性使JSON成为理想的数据交换 ...

  3. AngularJS之手动加载模块app和controller

    使用ng的页面中一般都是使用模块自动加载,页面的结构一般是这样的 加载angularjs脚本 加载业务代码脚本(或者写在script标签中) html结构代码(带有ng指令) 就像这样 app.htm ...

  4. ElasticSearch插件安装Head、Kopf与Bigdesk

    ElasticSearch-Head ElasticSearch-Head 是一个与Elastic集群(Cluster)相交互的Web前台. ES-Head的主要作用 它展现ES集群的拓扑结构,并且可 ...

  5. STM32学习笔记(一) 如何新建一个STM32工程模板

    学习stm32,第一步就是选择开发工具了,GCC,MDK,IAR每一种都有自己的优劣势,这里我选择使用MDK软件实现STM32模板.当然如果想更快的接触stm32实例,领略嵌入式开发的魅力,STM也提 ...

  6. 权限管理系统之LayUI实现页面增删改查和弹出层交互

    由于对LayUI框架不太熟悉,昨天抽空看了下LayUI的文档,今天在网上找了使用LayUI进行增删改查相关内容,自己照葫芦画了个瓢,画瓢部分不是很难,主要是下午遇到了一个弹出层的问题耗时比较久. 同一 ...

  7. 《Apache Kafka实战》读书笔记-调优Kafka集群

    <Apache Kafka实战>读书笔记-调优Kafka集群 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.确定调优目标 1>.常见的非功能性要求 一.性能( ...

  8. Restful API学习Day5 - DRF之限制 分页 解析器和渲染器

    参考文档: Django REST framework基础:认证.权限.限制 Django REST framework基础:分页 Django REST framework基础:解析器和渲染器 一. ...

  9. Navicat连接MySQL8.0亲测有效

    今天下了个 MySQL8.0,发现Navicat连接不上,总是报错1251: 原因是MySQL8.0版本的加密方式和MySQL5.0的不一样,连接会报错. 试了很多种方法,终于找到一种可以实现的: 更 ...

  10. [记录] CSS 左边元素定长,右边元素获得剩余长度

    情景:左边元素定长,右边元素获得剩余长度 1. 左边设置浮动,右边元素宽度auto,可以不设置,默认auto,然后设置margin-left:左边元素宽度 <ul class="ent ...