gridSlide

来自于：开发者立即使用

openMenu hideMenu showMenu closeMenu

论坛示例

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

概述

gridSlide 用原生代码实现了九宫格按钮布局，并可以自定义设置行和列，分页显示等。

模块效果图

固件要求

Android：2.3.1及以上 iOS：7.0及以上

openMenu

打开九宫格菜单

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

params

rect：

• 类型：JSON 对象
• 描述：（必填项）模块的位置及尺寸
• 备注：iOS,Android 必须传此参数。
• 内部字段：

{
    y: 0,   //（必填项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
    h: 250  //（必填项）数字类型；模块的高度；默认值：所属的 Window 或 Frame 的高度
}

background：

• 类型：字符串
• 描述：页面背景色(如：#ff00ff)
• 默认值：透明色

rows：

• 类型：数字型
• 描述：（可选项）九宫格需要展示的行数。
• 默认值：3

cols：

• 类型：数字型
• 描述：（可选项）九宫格需要展示的列数。
• 默认值：3

isShowDot：

• 类型：布尔型
• 描述：（可选项）是否显示底部dot圆点按钮
• 默认值：true（显示）

fixedOn：

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

fixed：

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

data：

• 类型： 数组对象
• 描述：（必填项）模块九宫格按钮图标和名称
• 内部字段：

[{
    id: '',   //（可选项）字符串；按钮ID
    name: '',   //（可选项）字符串；按钮名称
    icon: '',   //（可选项）字符串；按钮图标，支持fs:// widget://默认: defaultIcon图标
},
{
    id: '',   //（可选项）字符串；按钮ID
    name: '',   //（可选项）字符串；按钮名称
    icon: '',   //（可选项）字符串；按钮图标，支持fs:// widget://默认: defaultIcon图标
}]

defaultIcon：

• 类型：字符串
• 描述：（可选项）设置icon图标不存在是的默认图片(支持fs:// widget://)。
• 默认值：App图标

callback(ret, err)

ret：

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

{
    status: true,      //布尔型；true||false
    evenType: 'open',   //打开类型；open|click|pageIndex
    id : ''    ,            //按钮ID
    name : '',           //按钮名称
    currentPage : 0    //当前显示页面序号
}

err：

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

{
    msg : '' //错误信息内容
}

示例代码

var demo = api.require('gridSlide');
demo.openMenu({
    rect : {
        y : 200,
        h : 200
     },
     rows : 2, //行
     cols : 4, //列
     data : [
        {
            name : 'name0',
            icon : 'widget://res/ic_category0.png'
        },{
            name : 'name1',
            icon : 'widget://res/ic_category_1.png'
        },{
            name : 'name2',
            icon : 'widget://res/ic_category_2.png'
        },{
            name : 'name3',
            icon : 'widget://res/ic_category_3.png'
        },{
            name : 'name4',
            icon : 'widget://res/ic_category_4.png'
        },{
            name : 'name5',
            icon : 'widget://res/ic_category_5.png'
        },{
            name : 'name6',
            icon : 'widget://res/ic_category_6.png'
        },{
            name : 'name7',
            icon : 'widget://res/ic_category_7.png'
        },{
            name : 'name8',
            icon : 'widget://res/ic_category_8.png'
        },{
            name : 'name9',
            icon : 'widget://res/ic_category_9.png'
        },{
            name : 'name10',
            icon : 'widget://res/ic_category_10.png'
        },{
            name : 'name11',
            icon : 'widget://res/ic_category_11.png'
        },{
            name : 'name12',
            icon : 'widget://res/ic_category_12.png'
        },{
            name : 'name13',
            icon : 'widget://res/ic_category_13.png'
        },{
            name : 'name14',
            icon : 'widget://res/ic_category_0.png'
        },{
            name : 'name15',
            icon : 'widget://res/ic_category_1.png'
        },{
            name : 'name16',
            icon : 'widget://res/ic_category_2.png'
        },{
            name : 'name17',
            icon : 'widget://res/ic_category_3.png'
        },{
            name : 'name18',
            icon : 'widget://res/ic_category_4.png'
        },{
            name : 'name19',
            icon : 'widget://res/ic_category_5.png'
        },{
            name : 'name20',
            icon : 'widget://res/ic_category_6.png'
        },{
            name : 'name21',
            icon : 'widget://res/ic_category_7.png'
        },{
            name : 'name22',
            icon : 'widget://res/ic_category_8.png'
        },{
            name : 'name23',
            icon : 'widget://res/ic_category_9.png'
        },{
            name : 'name24',
            icon : 'widget://res/ic_category_10.png'
        },{
            name : 'name25',
            icon : 'widget://res/ic_category_11.png'
        },{
            name : 'name26',
            icon : 'widget://res/ic_category_12.png'
        },{
            name : 'name27',
            icon : 'widget://res/ic_category_13.png'
        }
    ],
    fixedOn : api.frameName,
    fixed : true,
    isShowDot : true
},function(ret, err) {
    alert(JSON.stringify(ret));
});

可用性

Android、iOS系统

可提供的1.0.0及更高版本

hideMenu

隐藏菜单

hideMenu(callback(ret, err))

callback(ret, err)

ret：

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

{
    status: true      //布尔型；true||false
}

err：

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

{
    msg : '' //错误信息内容
}

示例代码

var demo = api.require('gridSlide');
demo.hideMenu(function(ret, err) {
    alert(JSON.stringify(ret));
});

可用性

Android、iOS系统

可提供的1.0.0及更高版本

showMenu

显示菜单

hideMenu(callback(ret, err))

callback(ret, err)

ret：

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

{
    status: true      //布尔型；true||false
}

err：

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

{
    msg : '' //错误信息内容
}

示例代码

var demo = api.require('gridSlide');
demo.showMenu(function(ret, err) {
    alert(JSON.stringify(ret));
});

可用性

Android、iOS系统

可提供的1.0.0及更高版本

closeMenu

关闭菜单

closeMenu(callback(ret, err))

callback(ret, err)

ret：

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

{
    status: true      //布尔型；true||false
}

err：

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

{
    msg : '' //错误信息内容
}

示例代码

var demo = api.require('gridSlide');
demo.closeMenu(function(ret, err) {
    alert(JSON.stringify(ret));
});

可用性

Android、iOS系统

可提供的1.0.0及更高版本