• vrvideo VR 全景 -beta
  • 使用方法
    • 1. 在项目中引用动态库
    • 2. 在使用到组件的页面配置动态库
    • 3. 编写*.swan文件
  • 动态库属性列表
    • vrVideoMode 参数说明

vrvideo VR 全景 -beta

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

使用方法

1. 在项目中引用动态库

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

• JSON

 
 
 

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

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

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

• JSON

 
 
 

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

3. 编写*.swan文件

• SWAN

 
 
 

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

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

动态库属性列表

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

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

vrVideoMode 参数说明

vrVideoMode 包含以下字段：

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

• JS

 
 
 

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

interactiveMode 有效值

displayMode 有效值

projectionMode 有效值