sphereCloud

close hide

一个3D球状标签模块。通过本模块的 open 接口，可以打开一个球体，模块所在区域为一个 view， 类似 open 了一个 frame，前端开发者可理解为打开了一个 frame 在指定窗口。开发者可自定义球体上的 item 标签，包括其大小、背景、头像大小和位置、标题（或name）大小和位置及其颜色。模块初始打开时默认在不停的自转（初始自转方向是随机的），当用户通过手势轻扫滑动球体，球体会跟随手势方向自转，点击球体上的标签，该标签会有放大的动画，放大动画结束后模块回调相应单击事件。可通过 hide、shou 接口隐藏、显示模块。注意 close 和 hide 的区别。本模块支持同一个页面打开多个模块，以 ID 区分。

模块接口

open

打开标签控件

open({params}, callback(ret))

params

rect：

  • 类型：JSON 对象
  • 描述：（可选项）模块的位置及尺寸
  • 内部字段：

styles：

  • 类型：JSON 对象
  • 描述：（可选项）样式配置
  • 内部字段：
  2.    bg: '',           //（可选项）字符串类型；模块背景设置，支持rgb、rgba、#、img(本地路径fs://、widget://)；默认：'#00FFFFFF' 
  3.    velocity: 1       //（可选性）数字类型；自转速度，为0表示不自转，取值范围：0-10；默认：1
  4. }

data：

  • 类型：JSON 数组
  • 描述：显示的数据元素及样式组成的数组
  • 内部字段：
  1. [{       
  2.   bg:'',            //（可选项）数字类型；单条数据的背景配置，支持rgb、rgba、#、img(本地路径fs://、widget://)；默认：'#00FFFFFF' 
  3.   w:95,             //（可选项）数字类型；item的宽；默认： 95
  4.   h:35 ,            //（可选项）数字类型；item的高；默认： 35
  5.   avatar: {         //（可选项）JSON对象；头像配置；不传则不显示
  6.     path:'',        //字符串类型；头像图片路径，支持本地和网络路径；默认：不显示 
  7.     placeholder:'', //（可选项）字符串类型；当path为网络图片时，本参数表示占位图路径，要求本地路径（widget、fs）；默认：无
  8.     marginL:,       //（可选项）数字类型；头像距左边框距离；默认：0
  9.     marginT:,       //（可选项）数字类型；头像距上边框距离；默认：0
  10.     w:35,           //（可选项）数字类型；头像图片路大小的宽；默认：35  
  11.     h:35            //（可选项）数字类型；头像图片路大小的高；默认：35
  12.  }, 
  13.  name: {            //（可选项）JSON对象；名字配置，在item上左右剧中显示；不传则不显示
  14.     content:'',     //（可选项）字符串类型；名字内容；默认：不显示
  15.     color:'',       //（可选项）字符串类型；名字字体颜色，支持rgb、rgba、#；默认：#000000
  16.     size: 12 ,      //（可选项）数字类型；名字字体大小；默认：12； 
  17.     marginL:,       //（可选项）数字类型；名字距离左边框距离；默认：35
  18.     marginT:       //（可选项）数字类型；名字距离上边框距离；默认：11 
  19.  }    
  20. },...]

fixedOn：

  • 类型：字符串类型
  • 描述：（可选项）模块视图添加到指定 frame 的名字（只指 frame，传 window 无效）
  • 默认：模块依附于当前 window

fixed：

  • 类型：布尔
  • 描述：（可选项）模块是否随所属 window 或 frame 滚动
  • 默认值：true（不随之滚动）

callback(ret)

ret：

  • 类型：JSON 对象
  1. {
  2.     status:true,   //布尔类型；是否打开成功，为false时错误信息详见err
  3.     id:''          //字符串类型；模块的 ID
  4. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg:''      //字符串类型；错误信息 
  3. }

示例代码

  1. var datas = new Array();
  2. for (var i=0;i<50;i++) {
  3.   var item =  {
  4.         bg:'',
  5.         w:60,
  6.         h:60
  7.         avatar: {
  8.             path:'widget://res/left.jpeg',
  9.             w:35,
  10.             h:35
  11.         },
  12.         name: {
  14.             color:'#000000',
  15.             size: 14
  16.         }
  17.     }
  18.     datas.push(item);
  19. }
  21. var obj = api.require('sphereCloud');
  22. obj.open({
  23.     rect:{
  24.         x:0,
  25.         y:0,
  26.         w:api.frameWidth,
  27.         h:api.frameWidth
  28.     },
  29.     styles: {
  30.         bg: '',
  31.         velocity:1
  32.     },
  33.     data:datas,
  34.     fixedOn: api.frameName,
  35.     fixed: true
  36. }, function(ret) {
  37.     if(ret.status) {
  38.         api.alert({msg:'打开了模块'+ret.id});
  39.     } else {
  40.         api.alert({msg:'模块打开失败'});
  41.     }
  42. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

addEventListener

addEventListener({params}, callback(ret))

params

id：

  • 类型：字符串
  • 描述：控件 ID，open 接口成功打开后返回

target：

  • 类型：字符串
  • 描述：（可选项）监听的事件类型
  • 默认：click

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg:''          //字符串类型；错误信息 
  3. }
  1. var sphereCloud = api.require('sphereCloud');
  2. sphereCloud.addEventListener({
  3.     id:'1',
  4.     target: 'click'
  5.    api.alert({msg:'点击了' +ret.id+ '的第' + ret.index + '个 item'});
  6. });

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

close

关闭模块

close({params}, callback(ret))

params

id：

  • 类型：字符串
  • 描述：控件 ID，open 接口成功打开后返回

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status:true,          //布尔类型；是否成功

err:

  • 类型：JSON对象
  • 内部字段：
  1. {
  2.      msg: ''            //字符串类型；错误信息
  3. }

示例代码

  1. var sphereCloud = api.require('sphereCloud');
  2. sphereCloud.close({
  3.     id: '123'
  4. }, function(ret, err) {
  5.     if (ret) {
  6.         alert(JSON.stringify(ret));
  7.     } else {
  8.         alert(JSON.stringify(err));
  9.     }
  10. });

可用性

iOS 系统，Android 系统

hide

隐藏模块视图

hide({params}, callback(ret))

params

id：

  • 类型：字符串
  • 描述：控件 ID，open 接口成功打开后返回

ret：

  • 类型：JSON 对象
  • 内部字段：

err:

  • 类型：JSON对象
  • 内部字段：
  1. {
  2.      msg: ''            //字符串类型；错误信息
  3. }

示例代码

  1. var sphereCloud = api.require('sphereCloud');
  2. sphereCloud.hide({
  3.     id:'123'
  4. }, function(ret, err) {
  5.     if (ret) {
  6.         alert(JSON.stringify(ret));
  7.     } else {
  8.         alert(JSON.stringify(err));
  9.     }
  10. });

可用性

iOS 系统，Android 系统

可提供的 1.0.0 及更高版本

show

显示模块视图

show({params}, callback(ret))

params

id：

  • 类型：字符串
  • 描述：控件 ID，open 接口成功打开后返回

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status:true,         //布尔类型；是否成功
  4. }

err:

  • 类型：JSON对象
  • 内部字段：
  1. {
  2.      msg: ''            //字符串类型；错误信息
  3. }

示例代码

  1. var sphereCloud = api.require('sphereCloud');
  2. sphereCloud.show({
  3.     id:'123'
  4. }, function(ret, err) {
  5.     if (ret) {
  6.         alert(JSON.stringify(ret));
  7.     } else {
  8.         alert(JSON.stringify(err));
  9.     }

可用性

iOS 系统，Android 系统