效果图
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-1f7263215407b5fb.gif?imageMogr2/auto-orient/strip%7CimageView2/2/w/288)
下面开始手摸手分析:
18s的动画分成了三部分
引导页也是三页,而且每一页都在循环对应的6s
播放mp4可以用VideoView
播放至指定位置可以用VideoView暴露的seekTo(int msec)
一、视频文件放入src/raw文件夹内
插句嘴,这里可以温习下常见面试题,src/raw与assets的区别?
放入后读取相关文件:
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-9f203fbfbc83543c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
二、VideoView准备播放
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-8b36ee9b01a9e6c4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
三、轮询每一页的6s
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-bba7e38afe9baebd.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
四、确保VideoView全屏且尽量不拉伸
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-9d8b2bffdca830c4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/698)
宽度保持全屏,高度用宽度/0.56,很多人会问,0.56哪来的?请看图:
![VideoView实现英语流利说炫酷引导页-漫夜 VideoView实现英语流利说炫酷引导页](http://upload-images.jianshu.io/upload_images/4037105-38ef0c5835648e2b.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/376)
mp4文件是1080*1920的,宽/长约等于0.56,很简单吧。
作者:马伟奇
链接:https://www.jianshu.com/p/4d02700b26fa
來源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。