UIListGoods

来自于：APICloud 官方立即使用

论坛示例

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

概述

UIListGoods 模块封装了一个数据列表控件，列表项水平侧滑可出现控制按钮；开发者可自定义列表的数据源，及列表的样式，支持列表项的增、删、改、查，支持批量更新、追加数据。

注意 该模块android版本使用Android Studio开发，请在编译时勾选升级环境进行编译

open

打开 模块

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

params

rect：

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

{
    x: 0,   //（可选项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
    y: 0,   //（可选项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
    w: 320, //（可选项）数字类型；模块的宽度，支持设置'auto'；默认值：所属的 Window 或 Frame 的宽度
    h: 480  //（可选项）数字类型；模块的高度，支持设置'auto'；默认值：所属的 Window 或 Frame 的高度
}

data：

• 类型：数组
• 描述：列表的数据源，
• 内部字段：

[{
    imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，
    goodsName:'洗衣机',     //（可选项）字符串类型；名称，若不传则不显示
    goodsMoney:'1999'     //（可选项）数字类型；商品价格
    condition:'无货',      //（可选项）字符串类型；状态

}]

bounces:

• 类型：布尔
• 描述：（可选项）是否开启弹动，android 平台不支持本参数
• 默认：false

styles:

• 类型：JSON 对象
• 描述：（可选项）模块各部分的样式
• 内部字段：

{  

    item: {                             //（可选项）JSON对象；列表项的样式
        height:280                      //（可选项）数字类型；item的高度；默认：280
        bgColor: '#AFEEEE',             //（可选项）字符串类型；列表项的背景色，支持 rgb、rgba、#；默认：'#AFEEEE'

        imgWidth: 100,                   //（可选项）数字类型；列表项配图的宽度；默认：列表项的高度减去10px
        imgHeight: 100,                  //（可选项）数字类型；列表项配图的高度；默认：列表项的高度减去10px
        imgMarginTop:15,               //（可选项）数字类型；列表项商品配图的上边距；默认：15
        marginLeft:10,                  //（可选项）数字类型；列表项的(商品名字,和商品价格)左边距；默认：12
        goodsNameMarginRight:5,                  //（可选项）数字类型；列表项的(商品名字)右边距；默认：5
        goodsNameSize: 12,                   //（可选项）数字类型；列表项商品文字大小；默认：12
        goodsNameColor: '#000',              //（可选项）字符串类型；列表项商品文字颜色，支持 rgb，rgba，#；默认：'#000000
        goodsNameMarginTop:5,               //（可选项）数字类型；列表项商品文字和配图距离分割线的上边距；默认：5
        goodsMoneySize: 12,                  //（可选项）数字类型；列表项商品价格文字大小；默认：12
        goodsMoneyColor: '#000',             //（可选项）字符串类型；列表项商品价格文字颜色，支持 rgb，rgba，#；默认：'#000000'
        goodsMoneyMarginBottom:5             //（可选项）数字类型；列表项的商品价格下边距；默认：5
        conditionSize: 12,                   //（可选项）数字类型；列表项状态文字大小；默认：12
        conditionColor: '#000',             //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
        conditionMarginBottom:5             //（可选项）数字类型；列表项的状态下边距；默认：5
        marginRight:5                  //（可选项）数字类型；列表项的(状态)的左边距；默认：5
    }，

}

backgroundColor：

• 类型：字符串类型
• 描述：（可选项）模块的背景色，支持 rgb，rgba，#
• 默认：rgba(241,241,241,1)

fixedOn：

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

showScrollBar：

• 类型：布尔
• 描述：（可选项）是否显示滚动条
• 默认：true

callback(ret)

ret：

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

{
    eventType: 'show',  //字符串类型；交互事件类型
                        //取值范围如下：
                         //show（模块加载成功）
                        //clickContent（点击列表项的内容，除了配图和备注以外的区域）
}

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.open({
    rect: {
        x: 0,
        y: 0,
        w: api.winWidth,
        h: api.frameHeight
    },
    data: [{
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',
    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',
    }, {
       imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',
    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, {
       imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, {
        imgPath: 'widget://res/img/apicloud.png',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }, ],
    },
    fixedOn: api.frameName
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

close

关闭数据列表模块

close()

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.close();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

show

显示 UIListView 模块

show()

示例代码

var UIListUpload = api.require('UIListUpload');
UIListUpload.show();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

hide

隐藏 UIListView 模块

hide()

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.hide();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

reloadData

刷新列表数据

reloadData({params}, callback(ret))

params

data：

• 类型：数组
• 描述：（可选项）列表的数据源
• 内部字段：

[{
    imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，
    goodsName:'洗衣机',     //（可选项）字符串类型；名称，若不传则不显示
    goodsMoney:'1999'     //（可选项）数字类型；商品价格
    condition:'无货',      =//（可选项）字符串类型；状态
}]

callback(ret)

ret：

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

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

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.reloadData({
    data: [{
        imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }]
}, function(ret) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

updateItem

根据索引更新某一条列表的数据

updateItem({params}, callback(ret))

params

index：

• 类型：数字
• 描述：（可选项）数据列表的索引
• 默认值：0

data：

• 类型：JSON 对象
• 描述：列表的数据源
• 内部字段：

{
    imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，
    goodsName:'洗衣机',     //（可选项）字符串类型；名称，若不传则不显示
    goodsMoney:'1999'     //（可选项）数字类型；商品价格
    condition:'无货',      =//（可选项）字符串类型；状态
}

callback(ret)

ret：

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

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

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.updateItem({
    index: 2,
    data: {
        imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

insertItem

根据索引向某一条列表插入数据

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

params

index：

• 类型：数字
• 描述：（可选项）数据列表的索引
• 默认值：列表最后一条数据的索引

data：

• 类型：JSON 对象
• 描述：列表的数据源
• 内部字段：

{
    imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，
    goodsName:'洗衣机',     //（可选项）字符串类型；名称，若不传则不显示
    goodsMoney:'1999'     //（可选项）数字类型；商品价格
    condition:'无货',      =//（可选项）字符串类型；状态
}

callback(ret)

ret：

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

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

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.insertItem({
    index: 2,
    data: {
        imgPath: 'http://d.hiphotos.baidu.com/image/pic/item/4d086e061d950a7b29a788c209d162d9f2d3c922.jpg',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

appendData

向列表末端追加数据

appendData({params}, callback(ret))

params

data：

• 类型：数组对象
• 描述：列表的数据源
• 内部字段：

[{
    imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，
    goodsName:'洗衣机',     //（可选项）字符串类型；名称，若不传则不显示
    goodsMoney:'1999'     //（可选项）数字类型；商品价格
    condition:'无货',      =//（可选项）字符串类型；状态
}]

callback(ret)

ret：

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

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

示例代码

var UIListGoods = api.require('UIListGoods');
UIListGoods.appendData({
    data: [{
        imgPath: 'http://d.hiphotos.baidu.com/image/pic/item/4d086e061d950a7b29a788c209d162d9f2d3c922.jpg',
        goodsName: '洗衣机',
        goodsMoney: 1999,
        condition:'无货',

    }]
}, function(ret, err) {
    if (ret) {
        alert(JSON.stringify(ret));
    } else {
        alert(JSON.stringify(err));
    }
});

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本