videoPicture

openCarousel

hideCarousel

showCarousel

closeCarousel

论坛示例

为帮助用户更好更快的使用插件，论坛维护了一个示例，示例中包含示例代码供您参考。

概述

videoPicture插件用ijkplayer封装在iOS、Android下带视频播放的轮播功能(本底层是基于ijkplayer，播放类型支持比较多，如果需要轻便的播放器底层(如:仅播放MP4)可以单独联系封装)。

插件使用说明 轮播图片全屏预览有保存按钮，iOS需要申请保存到相册权限，Android需要申请存储权限。

固件要求

Android：4.4及以上 iOS：11.0及以上

插件接口

openCarousel

打开轮播播放器

openCarousel({params}, callback(ret,err))

params

rect：

  • 类型：JSON 对象
  • 描述：（必填项）插件的位置及尺寸
  • 内部字段：
{
    x: 0,   //（必填项）数字类型；插件左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
    y: 0,   //（必填项）数字类型；插件左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
    w: 320, //（必填项）数字类型；插件的宽度；默认值：所属的 Window 或 Frame 的宽度
    h: 250  //（必填项）数字类型；插件的高度；默认值：所属的 Window 或 Frame 的高度
}

fixedOn：

  • 类型：字符串
  • 描述：（可选项）插件所属 Frame 的名字，若不传则插件归属于当前 Window

fixed：

  • 类型：布尔
  • 描述：（（可选项）插件是否随所属 Window 或 Frame 滚动
  • 默认值：true（不随之滚动）

data：

  • 类型：JSON 对象
  • 描述：（必填项）带视频轮播显示列表。
{
    imageUrl: '',   //（必填项）如果是视频则是播放前的预览图片,图片则是显示图片
    type : 2,//1:视频 2:图片 (如果是带视频的轮播。第一个必须是视频)
    videoUrl: '',   //（可选项）视频类型必填
    scalingMode : 1,//(可选选)视频播放显示铺满模式（1:无缩放, 2:适应大小模式, 3:充满可视范围，可能会被裁剪, 4:缩放到充满视图）
    isLocalCache : true, //(可选项)是否本地缓存视频,音频
}

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    status: true,      //布尔型；true|false
}

err：

  • 类型：JSON 对象
  • 内部字段：
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.openCarousel({
    rect : {
        x:30,
        y:400,
        w:300,
        h:200,
        fixedOn:'index_frm', //固定在名为'index_frm'的frame上
        //fixed:false //跟随网页滚动
    },
    data : [{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 1,//1:视频 2:图片 如果是带视频的轮播。第一个必须是视频
        videoUrl : 'https://v-cdn.zjol.com.cn/123468.mp4'
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974126-29',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974125-28',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974125-27',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 1,
    }]
}, function(ret, err){
    api.alert({msg: JSON.stringify(ret)});
});

可用性

iOS、Android系统

可提供的1.0.0及更高版本

hideCarousel

隐藏轮播播放器

hideCarousel(callback(ret, err))

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    status: true,      //布尔型；true||false
}

err：

  • 类型：JSON 对象
  • 内部字段：
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.hideCarousel();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

showCarousel

显示轮播播放器

showCarousel(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    status: true,      //布尔型；true
}

示例代码

var demo = api.require('videoPicture');
demo.showCarousel();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

closeCarousel

关闭轮播播放器

closeCarousel(callback(ret, err))

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    status: true,      //布尔型；true||false
}

err：

  • 类型：JSON 对象
  • 内部字段：
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.closeCarousel(function(ret, err){
    alert(JSON.stringify(ret) + "  " +JSON.stringify(err));
});

可用性

iOS、Android系统

可提供的1.0.0及更高版本

是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18