sidebar: vrvideo

title: vrvideo 动态库-Beta header: develop nav: framework

sidebar: vrvideo

vrvideo 动态库提供了在小程序中播放全景视频的方法。

使用方法

1. 在项目中引用动态库

使用动态库的方法参见小程序文档：使用动态库，在 app.json 中增添一项 dynamicLib，与 pages 同级。

"dynamicLib": {
    "myDynamicLib": {
        "provider": "vrvideo"
    }
},

2. 在使用到组件的页面配置动态库

在每个使用到图表组件的页面，配置 *.json 文件如：

{
    "usingSwanComponents": {
        "vrvideo": "dynamicLib://myDynamicLib/vrvideo"
    }
}

3. 编写 *.swan 文件

<vrvideo src="{{ src }}" style="width: 100%; height: 100%; display: block"></vrvideo>

这是一种最基本的配置方式。style 也可以在 *.css 中声明，需要保证 <vrvideo> 是有宽度和高度的。options 在 *.js 中绑定到页面的 data 中：

动态库属性列表

<vrvideo> 上支持的属性包括：

除vrVideoMode参数外，其他参数与普通视频类似，可参考vide组件。

vrVideoMode参数说明

vrVideoMode包含以下字段：

如果不填写，则为默认值，即

{
    interactiveMode: 'VRModeInteractiveMotionWithTouch',
    displayMode: 'VRModeDisplayNormal',
    projectionMode: 'VRModeProjectionSphere',
    fov: 90,
    pinchEnable: true
}

interactiveMode 有效值:

displayMode 有效值:

projectionMode 有效值: