videoPlayer模块play接口实现的播放器

uoaccw

//videoPlayer模块play接口实现的播放器，确实简单，方便。附件有图标素材。跟大家分享一下。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
<title>title</title>
<link rel="stylesheet" type="text/css" href="../css/api.css" />
<style>
body {
padding: 60px 10px;
}
</style>
</head>
<body>
<button type="button" tapmode onclick="fnvideoPlayerPlay()" name="button">打开自带界面播放器</button>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
apiready = function() {
};
function fnvideoPlayerPlay() {
var videoPlayer = api.require('videoPlayer');
videoPlayer.play({
texts: {
head: {
title: ''
}
},
styles: {
head: {
bg: 'rgba(0.5,0.5,0.5,0.7)',
height: 44,
titleSize: 20,
titleColor: '#fff',
backSize: 30,
backImg: 'widget://image/videoPlayer/back.png',
setSize: 30,
setImg: 'widget://image/videoPlayer/more.png'
},
foot: {
bg: 'rgba(0.5,0.5,0.5,0.7)',
height: 44,
playSize: 30,
playImg: 'widget://image/videoPlayer/play.png',
pauseImg: 'widget://image/videoPlayer/pause.png',
nextSize: 0,
nextImg: '',
timeSize: 14,
timeColor: '#fff',
sliderImg: '',
progressColor: '#696969',
progressSelected: '#1296db',
verticalImg: "widget://image/videoPlayer/unfullscreen.png",
horizontalImg: "widget://image/videoPlayer/fullscreen.png"
}
},
path: 'http://**.**2.z0.glb**.**/c1.1.mp4',
autoPlay: true
}, function(ret, err) {
if (ret) {
} else {
}
});
}
</script>
</html>

复制代码

竖屏

横屏：

右上角菜单点开后的界面

2018.7.13 更新自定义界面播放器demo
https://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=107612&page=1&extra=#pid542654

videoPlayer其他分享贴：
https://community.apicloud.com/bbs/forum.php?mod=viewthread&tid=66035

玩具.

可以发到分享区。

footerbook

我想问他界面上自带的返回按钮怎么点击的时候怎么监听到

哈哈_哈

学习学习

违规昵称_612404

正好需要

footerbook

我想问一下这个模块播放视频的时候动态传入标题怎么在ios上显示不全安卓上显示正常

1229230

支持m3u8吗

章鱼哥揍蜡笔小新

视频地址怎能弄的呀？我是初学者。明天就要交作业了

土豆tudou

求问视频开始播放之前，已经加载完毕的图怎么设置啊，类似于视频第一帧图在哪里设置？

久爱卡

支持rtmp直播流吗?