UIBPlayer (视频播放)demo分享

本文出自APICloud官方论坛

UIBPlayer 封装了百度云播放器 SDK。本模块带有UI方案,打开后为一个具有完整功能的播放器界面。百度云播放器突破 Android、iOS 平台对视频格式的限制,支持目前所有主流的媒体格式(mp4、avi、wmv、flv、mkv、mov、 rmvb 等)。


模块亮点介绍:
1. 自带UI,用户只需自己设计图标,调整参数。
2.  具有双击播放、暂停,手势滑动改变播放进度、屏幕亮度和音量的功能
3. iOS 支持横竖屏自动切换(设置中打开竖屏锁定)

4. 顶部、底部按钮播放时自动隐藏,点击唤起。

1.  使用前先去百度开放平台获取AccessKey,配置到config.xml文件中,否则会出现闪退等异常。参考模块文档说明。
2.  直接调用open接口即可打开播放器。代码如下:

var UIBPlayer = api.require('UIBPlayer');

        UIBPlayer.open({

            rect: {

                x: 0,

                y: 0,

                w: api.winWidth,

                h: 300

            },

            videoScalingMode:"FIT_WITH_CROPPING",

            path: 'http://wvideo.spriteapp.cn/video/2016/0328/56f8ec01d9bfe_wpd.mp4',

            autoPlay: false,

            enableLooping: true,

            pauseInBackground: true,

            coverImg: 'widget://image/uibplayer/cover.png',

            styles: {

                head: {

                    bg: 'rgba(161,161,161,0.5)',

                    height: 44,

                    marginTop: api.safeArea.top,

                    hide: false,

                    backBtn: {

                        size: 30,

                        backImg: 'widget://image/uibplayer/back.png',

                        marginLeft: 5

                    },

                    titleLabel: {

                        title: '蝙蝠侠',

                        size: 20,

                        color: '#fff',

                        200,

                        numberLines: 1,

                        leftMargin: 5,

                        backgroundColor: 'rgba(0,0,0,0)'

                    },

                    customButtons: [{

                        w: 30,

                        h: 30,

                        rightMagin: 5,

                        img: 'widget://image/uibplayer/setting.png',

                        imgSelected: 'widget://image/uibplayer/settinged.png',

                    }, {

                        w: 30,

                        h: 30,

                        rightMagin: 5,

                        img: 'widget://image/uibplayer/mess.png',

                        imgSelected: 'widget://image/uibplayer/messed.png',

                    }]

                },

                foot: {

                    bg: 'rgba(161,161,161,0.5)',

                    height: 44,

                    marginBottom: 0,

                    hide: false,

                    playBtn: {

                        size: 44,

                        playImg: 'widget://image/uibplayer/play.png',

                        pauseImg: 'widget://image/uibplayer/pause.png',

                        marginLeft: 0

                    },

                    currentTimeLabel: {

                        textSize: 14,

                        textColor: "#FFF",

                        marginLeft: 5

                    },

                    seekBar: {

                        sliderImg: 'widget://image/uibplayer/slide.png',

                        progressColor: '#696969',

                        progressSelectedColor: '#333333',

                        marginLeft: 5,

                        marginRight: 5

                    },

                    totalTimeLabel: {

                        textSize: 14,

                        textColor: "#FFF",

                        marginRight: 5

                    },

                    fullScreenBtn: {

                        size: 30,

                        img: 'widget://image/uibplayer/unfullscreen.png',

                        fullScreenImg: 'widget://image/uibplayer/fullscreen.png',

                        marginRight: 10

                    }

                }

            },

            fixedOn: api.frameName,

            fixed: false

        });

复制代码

不同用户需要到百度开放平台申请key, 配置到自己项目的config.xml中,提交代码然后编译自定义loader。

原文地址:https://www.cnblogs.com/APICloud/p/10998938.html