Android原生的VideoView的样式真心弱爆了,但是拥有巨大用户量的网易新闻客户端居然使用的就是这个,真心服了网易的产品经理。目前主流的视频网站,国内的如优酷、土豆、爱奇艺、搜狐,国外的如最具代表性的youtobe,它们一同在移动互联网的浪潮下竞逐,也都推出了对应的移动视频客户端。不知从何时起,他们推出的客户端基本都统一了视频播放界面的交互风格。当然这种交互的风格如此风靡,肯定有其内在的原因,那就是它让客户端更加迎合用户的操作习惯,更加的智能。现在只要一看到视频播放界面,总会不由自主的会用手指左右滑动屏幕,期待有特定的交互响应。
下面我们就简单介绍下这种交互风格的几大特征。
1、播放界面不会固定横屏或者竖屏,而是随传感器自动旋转屏幕,并且无缝的衔接播放的视频
2、手指左滑屏幕,快退;手指右滑屏幕,快进
3、在左半屏,手指下滑,调低亮度;手指上滑,调高亮度;退出当前页面,恢复亮度
4、同样的有个Seekbar也可以调整进度,样式一般自定义
5、视频上面会有两个遮罩浮层,一个在顶部,一个在底部;点击屏幕,遮罩层会自动显示,再点击会自动隐藏
6、调整音量的Toast一般也是自定义的
7、视频横屏,全屏显示
交代完几点酷炫的共同特征,我也正是朝着这几个目标前进的。欣慰的是,所有的这些功能也都给实现了,代码也都放在Github上了,可以先把玩下看看效果,相信会给你眼前一亮的感觉。尤其是那些正在饱受实现痛苦的同学,这时候看到你就爽了。先看下效果。
有朋友给建议说,多讲点基础和要点,要贴点代码。我觉得建议很好,所以呢,代码以后会少贴,想看源码的话,直接去Github clone下来。如果你有好的想法,或者代码哪里写的不尽如意,也欢迎大家提交pull request。
下面说几点大家可能需要注意的地方。
一、为什么需要重写VideoView,原生的不好嘛?
VideoView,和WebView一样,是Android中重量级的控件,都需要时间去缓冲,大量的操作需要用在渲染上。所以可以想象他们对内存的压力还是蛮大的,不过有Google大神们的Framework层的强力支持,开销的事情基本不用上层程序员操心。VideoView作为如此重要的一个控件,导致很多手机厂商都在对它进行自己的定制化修改,这也造就了VideoView的碎片化。可能同一套的视频代码,在不同手机上的显示的效果可能相去甚远。而且原生的VideoView是不支持全屏播放的,而是视频的大小为多少,展现在手机上的就有多大,超屏的话按照全屏等比例缩放。所以完全有必要写出一套VideoView去做兼容。
二、手指的交互是如何实现的?
Android中判定手指位置和滑动距离可以通过两种方式,一种是设置OnTouchListener的回调监听,另一种是使用手势监听类GestureDetector,然后在OnGestureListener里面做回调监听。我采用的是第一种,通过判断手指落下的位置和手势的位移的不同,进而去实现不同的逻辑。
三、遮罩层自动隐藏如何实现的?
默认进入视频播放页面,遮罩层是显示的。当视频播放开始,5秒钟后,遮罩层会自动隐藏。当遮罩层不显示的时候,点击屏幕,遮罩层弹出,再点击,就隐藏。显示和隐藏都伴随这动画的执行,效果不错。有人会说,简单的定时器Timer不就搞定了嘛。我建议大家尽量在Android中编码尽量少用Timer,可以选择使用Handler的延迟执行方法postDelayed(Runnable r, long delayMillis)方法。
四、横竖屏切换的无缝对接的实现方式
出门右转,查看历史消息《由Android屏幕旋转说起》,看完你就了解了。
好了,今天的干货都到此为止。
源码地址:https://github.com/JackCho/AndroidVideoView
如果觉得对你有所帮助,欢迎大家订阅我的微信公众账号——Android干货分享(ID:android_share)。下面是微信的二维码,为你提供及时高质的Android干货。