sideMenu

来自于:官方立即使用

open hidden show close

论坛示例

为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码、知识点讲解、注意事项等,供您参考。

概述

sideMenu 是一个从边框弹出的菜单,允许开发者自定义子按钮的样式和个数。打开时会有从边框弹出的动画

图片说明

open

打开菜单

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

params

type:

  • 类型:数字
  • 默认值:0
  • 描述:菜单类型,0代表从左往右弹出,非0代表从右往左弹出,可为空

startPosition:

  • 类型:数字
  • 默认值:紧贴导航条下边缘
  • 描述:菜单最上边的第一个按钮的起始位置,可为空

btnHeight:

  • 类型:数字
  • 默认值:60
  • 描述:菜单里单个按钮的高度,可为空

interval:

  • 类型:数字
  • 默认值:10
  • 描述:菜单里两个相邻按钮间的距离,可为空

trajectoryColor:

  • 类型:字符串
  • 默认值:无
  • 描述:弹出的按钮的弹道的颜色,可为空,若为空则不显示弹道

btnArray:

  • 类型:数组
  • 默认值:无
  • 描述:弹出的按钮的信息,不可为空

内部字段:

  1. [{
  2. icon: //字符串,按钮的图标,支持本地协议,不可为空
  3. bgImg: //字符串,按钮背景图标,支持本地协议,不可为空
  4. }]

fixedOn:

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

clickHide:

  • 类型:布尔值
  • 默认值:true
  • 描述:点击子按钮后是否隐藏菜单,可为空

callback(ret, err)

ret:

  • 类型:JSON 对象

内部字段:

  1. {
  2. id: //菜单的id
  3. index //用户点击按钮的下标
  4. }

示例代码

  1. var sideMenu = api.require('sideMenu');
  2. sideMenu.open({
  3. trajectoryColor: '#3F9FEA',
  4. btnArray: [{
  5. title: '图标1',
  6. 'icon': 'widget://res/center/0.png',
  7. 'bgImg': 'widget://res/sideMenu/bg.png'
  8. }, {
  9. title: '图标2',
  10. 'icon': 'widget://res/center/1.png',
  11. 'bgImg': 'widget://res/sideMenu/bg.png'
  12. }, {
  13. title: '图标3',
  14. 'icon': 'widget://res/center/2.png',
  15. 'bgImg': 'widget://res/sideMenu/bg.png'
  16. }, {
  17. title: '图标4',
  18. 'icon': 'widget://res/center/3.png',
  19. 'bgImg': 'widget://res/sideMenu/bg.png'
  20. }, {
  21. title: '图标5',
  22. 'icon': 'widget://res/center/4.png',
  23. 'bgImg': 'widget://res/sideMenu/bg.png'
  24. }],
  25. fixedOn: api.frameName
  26. }, function(ret, err) {
  27. if (ret) {
  28. alert(JSON.stringify(ret));
  29. } else {
  30. alert(JSON.stringify(err));
  31. }
  32. });

补充说明

打开菜单

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

hidden

隐藏菜单

hidden({params})

params

id:

  • 类型:数字
  • 默认值:无
  • 描述:要操作的菜单的id,不可为空

示例代码

  1. var sideMenu = api.require('sideMenu');
  2. sideMenu.hidden({
  3. id: 1
  4. });

补充说明

隐藏菜单,只是移除到屏幕之外,还在内存里没有清除

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

show

显示菜单

show({parmas})

params

id:

  • 类型:数字
  • 默认值:无
  • 描述:要操作的菜单的id,不可为空

示例代码

  1. var sideMenu = api.require('sideMenu');
  2. sideMenu.show({
  3. id: 1
  4. });

补充说明

显示菜单,从屏幕外移动到屏幕内

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

close

关闭菜单

close({parmas})

params

id:

  • 类型:数字
  • 默认值:无
  • 描述:要操作的菜单的id,不可为空

示例代码

  1. var sideMenu = api.require('sideMenu');
  2. sideMenu.close({
  3. id: 1
  4. });

补充说明

关闭菜单,意味着从内存里清除

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本