UIListUpload

来自于：APICloud 官方立即使用

open updateHeaderText close show hide setAttr getIndex getDataByIndex setSwipeBtns reloadData deleteItem updateItem insertItem appendData getCount setRefreshHeader setRefreshFooter stopRefresh

论坛示例

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

概述

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

open

打开 UIListUpLoad 模块

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

params

rect：

  • 类型：JSON 对象
  • 描述：（可选项）模块的位置及尺寸
  • 备注：Android 必须传此参数。
  • 内部字段：
  1. {
  2.     x: 0,   //（可选项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
  3.     y: 0,   //（可选项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
  4.     w: 320, //（可选项）数字类型；模块的宽度，支持设置'auto'；默认值：所属的 Window 或 Frame 的宽度
  5.     h: 480  //（可选项）数字类型；模块的高度，支持设置'auto'；默认值：所属的 Window 或 Frame 的高度
  6. }

data：

  • 类型：数组
  • 描述：列表的数据源，开发者可以自定义唯一的键值对信息（如：uid: ‘1001’），供 getIndex 使用
  • 内部字段：
  1. [{
  2.     name:'LSG14HDUE485675',  //（可选项）字符串类型；名称，若不传则不显示
  3.     condition:'等待上传',     //（可选项）字符串类型；状态，若不传则不显示
  4.     conditionColor: '#000', //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
  5.     status:'跟踪'            //（可选项）字符串类型；跟踪状态
  6.     statusBgColor:"#ff0",   //（可选项）字符串类型；跟踪标签的背景颜色
  7.     title: '',              //（可选项）字符串类型；标题，若不传或为空则不显示，最多显示两行
  8.     subTitle: '',           //（可选项）字符串类型；子标题，若不传或为空则不显示
  9.     imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，若不传则不显示
  10.     forbidden: false,       //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 styles->forbidden参数配置
  11.     rightBtns: []           //（可选项）数组类型；列表项向左滑动露出的按钮组，配置某一项的特定按钮组，若不传则显示通用按钮，内部字段同下方 rightBtns 参数
  13. }]

rightBtns：

  • 类型：数组
  • 描述：（可选项）列表项向左滑动露出的按钮组，建议：配置列表每项的通用按钮，用此参数；配置某一项的特定按钮，可在 data 数组的指定项传入 rightBtns 参数
  • 内部字段：
  1. [{
  2.     bgColor: '#388e8e', //（可选项）字符串类型；按钮背景色，支持 rgb、rgba、#；默认：'#388e8e'
  3.     activeBgColor: '',  //（可选项）字符串类型；按钮按下时的背景色，支持 rgb、rgba、#
  4.     width: 70,          //（可选项）数字类型；按钮的宽度；默认：w / 4       
  5.     title: '',          //（可选项）字符串类型；按钮标题，水平、垂直居中
  6.     titleSize: 12,      //（可选项）数字类型；按钮标题文字大小；默认：12
  7.     titleColor: '#fff', //（可选项）字符串类型；按钮标题文字颜色，支持 rgb、rgba、#；默认：'#ffffff'
  8.     icon: '',           //（可选项）字符串类型；按钮标题前的图标路径（本地路径，支持fs://、widget://），水平、垂直居中，图标为正方形
  9.     iconWidth: 20       //（可选项）数字类型；按钮标题前的图标宽度，图标为正方形；默认：20
  10. }]

bounces:

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

styles:

  • 类型：JSON 对象
  • 描述：（可选项）模块各部分的样式
  • 内部字段：
  1. {         header:{                          //(可选项)json类型；不传则不显示
  2.             bg:'#fff' ,                   //（可选项）字符串类型；头部视图的颜色(可支持添加图片,比如有搜索框需要显示)，支持 rgb、rgba、#、img；默认：'#696969'
  3.             height:44,                    //（可选项）数字类型；头部视图的高度；默认：0
  4.                 icon:{                        //（可选项）JSON对象；header中的图标，上下居中显示
  5.                    size:15,                   //（可选项）数字类型；icon 的大小， 默认：15(ios不支持)
  6.                    path:'widget://image/header_icon.png' //（可选项）字符串类型；图片的路径；不传不显示
  7.         },
  8.                 text:{                         //（可选项）JSON对象；header中的标题，上下居中显示
  9.                    textSize:10,                //（可选项）数字类型；title的字体大小，默认：10
  10.                    textColor:'#eee',           //（可选项）字符串类型；title的颜色，默认：#eee
  11.                    defaultText:''              //（可选项）字符串类型；默认显示文本，不传不显示
  12.                 }    
  13.         }
  14.     spaceHeight: 20,                    //（可选项）数字类型；列表间隔的高度，默认：20
  15.     spaceColor:'rgba(0,0,0,0.3)',       //（可选项）字符串类型；列表间隔的颜色，支持 rgb、rgba、#；默认：'#696969'
  16.     borderColor: '#696969',             //（可选项）字符串类型；列表分割线的颜色，支持 rgb、rgba、#；默认：'#696969'
  17.     item: {                             //（可选项）JSON对象；列表项的样式
  18.         bgColor: '#AFEEEE',             //（可选项）字符串类型；列表项的背景色，支持 rgb、rgba、#；默认：'#AFEEEE'
  19.         activeBgColor: '#F5F5F5',       //（可选项）字符串类型；列表项按下时的背景色，支持 rgb、rgba、#；默认：'#F5F5F5'
  20.         topHeight: 40,                  //（可选项）数字类型；列表项分割线上半部分的高度；默认：40    
  21.         bottomHeight:80,                //（可选项）数字类型；列表项分割线下半部分的高度；默认：80
  22.         marginLeft:10,                  //（可选项）数字类型；列表项的(名称、标题、子标题)左边距；默认：12
  23.         nameSize: 12,                   //（可选项）数字类型；列表项名称文字大小；默认：12
  24.         nameColor: '#000',              //（可选项）字符串类型；列表项名称文字颜色，支持 rgb，rgba，#；默认：'#000000
  25.         titleMarginTop:5,               //（可选项）数字类型；列表项标题文字和配图距离分割线的上边距；默认：5
  26.         titleLineSpacing:5              //（可选项）数字类型；列表项标题文字的行间距；默认：0
  27.         titleSize: 12,                  //（可选项）数字类型；列表项标题文字大小；默认：12
  28.         titleWidth:100,                 //（可选项）数字类型；列表项标题文字的宽度；默认：100
  29.         titleColor: '#000',             //（可选项）字符串类型；列表项标题文字颜色，支持 rgb，rgba，#；默认：'#000000'
  30.         subTitleMarginBottom:5,                 //（可选项）数字类型；列表项子标题文字距离分割线的下边距；默认：5
  31.         subTitleSize: 12,               //（可选项）数字类型；列表项子标题文字大小；默认：12
  32.         subTitleWidth:100,              //（可选项）数字类型；列表项子标题文字的宽度；默认：100
  33.         subTitleColor: '#000',          //（可选项）字符串类型：列表项子标题文字颜色，支持 rgb、rgba、#；默认：'#000000'
  34.         conditionSize: 12,              //（可选项）数字类型；列表项状态文字大小；默认：12
  35.         marginRight:10                  //（可选项）数字类型；列表项的(状态、图片)的左边距；默认：12
  36.         imgWidth: 40,                   //（可选项）数字类型；列表项配图的宽度；默认：列表项的高度减去10px
  37.         imgHeight: 40,                  //（可选项）数字类型；列表项配图的高度；默认：列表项的高度减去10px
  38.         imgCorner: 4,                   //（可选项）数字类型；列表项配图的圆角大小；默认：0
  39.     imgMarginLeft: 20,
  40.     imgMarginTop: 10,
  41.     statusLabel:{                   //（可选项）JSON对象；状态标签
  42.         corner:3,               //（可选项）数字类型；标签背景圆角
  43.                 width: 40,              //（可选项）数字类型；标签的宽度
  44.                 height:20               //（可选项）数字类型；标签的高度
  45.         textColor:'#fff'        //（可选项）字符串类型；标签文本的颜色
  46.         textSize:12             //（可选项）数字类型；标签文本字体的大小
  47.     } 
  48.     }，
  49.     forbidden: {                        //（可选项）JSON对象；屏蔽点击事件的列表项的样式配置
  50.         bgColor: '#B0C4DE',             //（可选项）字符串类型；列表项背景色，支持rgb、#、rgba；默认：#C0C0C0
  51.         titleColor: '800000',           //（可选项）字符串类型；列表项标题色，支持rgb、#、rgba；默认：#808080
  52.         subTitleColor: '#696969',       //（可选项）字符串类型；列表项子标题色，支持rgb、#、rgba；默认：#808080
  53.         remarkColor: '#FFDEAD'          //（可选项）字符串类型；列表项备注色，支持rgb、#、rgba；默认：#808080
  54.     }
  55. }

fixedOn：

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

showScrollBar：

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

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     eventType: 'show',  //字符串类型；交互事件类型
  3.                         //取值范围如下：
  4.                          //show（模块加载成功）
  5.                         //clickRightBtn（点击侧滑出现的右侧按钮）
  6.                         //clickHead(点击头部视图)
  7.                         //clickContent（点击列表项的内容，除了配图和备注以外的区域）
  8.             //scrollToBottom(列表滑动至底部触发)
  9.     index: 0,           //数字类型；列表项的索引
  10.     btnIndex: 0         //数字类型；列表项侧滑出现的按钮的索引
  11. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.open({
  3.     rect: {
  4.         x: 0,
  5.         y: 0,
  6.         w: api.winWidth,
  7.         h: api.frameHeight
  8.     },
  9.     data: [{
  10.         uid: '1001',
  11.         imgPath: 'widget://res/img/apicloud.png',
  12.         title: '标题',
  13.         subTitle: '子标题，说明文字',
  14.         name:'LSG14HDUE485675',
  15.         condition:'等待上传',
  16.     }, {
  17.         uid: '1001',
  18.         imgPath: 'widget://res/img/apicloud.png',
  19.         name:'LSG14HDUE485675',
  20.         condition:'等待上传',
  21.         title: '标题',
  22.         subTitle: '子标题，说明文字',
  23.     }, {
  24.         uid: '1001',
  25.         imgPath: 'widget://res/img/apicloud.png',
  26.         name:'LSG14HDUE485675',
  27.         condition:'等待上传',
  28.         title: '标题',
  29.         subTitle: '子标题，说明文字',
  30.     }, {
  31.         uid: '1001',
  32.         imgPath: 'widget://res/img/apicloud.png',
  33.         name:'LSG14HDUE485675',
  34.         condition:'等待上传',
  35.         title: '标题',
  36.         subTitle: '子标题，说明文字',
  38.     }, {
  39.         uid: '1001',
  40.         imgPath: 'widget://res/img/apicloud.png',
  41.         name:'LSG14HDUE485675',
  42.         condition:'等待上传',
  43.         title: '标题',
  44.         subTitle: '子标题，说明文字',
  46.     }, {
  47.         uid: '1001',
  48.         imgPath: 'widget://res/img/apicloud.png',
  49.         name:'LSG14HDUE485675',
  50.         condition:'等待上传',
  51.         title: '标题',
  52.         subTitle: '子标题，说明文字',
  54.     }, {
  55.         uid: '1001',
  56.         imgPath: 'widget://res/img/apicloud.png',
  57.         name:'LSG14HDUE485675',
  58.         condition:'等待上传',
  59.         title: '标题',
  60.         subTitle: '子标题，说明文字',
  62.     }, {
  63.         uid: '1001',
  64.         imgPath: 'widget://res/img/apicloud.png',
  65.         name:'LSG14HDUE485675',
  66.         condition:'等待上传',
  67.         title: '标题',
  68.         subTitle: '子标题，说明文字',
  70.     }, {
  71.         uid: '1001',
  72.         imgPath: 'widget://res/img/apicloud.png',
  73.         name:'LSG14HDUE485675',
  74.         condition:'等待上传',
  75.         title: '标题',
  76.         subTitle: '子标题，说明文字',
  78.     }, {
  79.         uid: '1001',
  80.         imgPath: 'widget://res/img/apicloud.png',
  81.         name:'LSG14HDUE485675',
  82.         condition:'等待上传',
  83.         title: '标题',
  84.         subTitle: '子标题，说明文字',
  86.     }, {
  87.         imgPath: 'widget://res/img/apicloud.png',
  88.         name:'LSG14HDUE485675',
  89.         condition:'等待上传',
  90.         title: '标题',
  91.         subTitle: '子标题，说明文字',
  93.     }],
  94.     rightBtns: [{
  95.         bgColor: '#388e8e',
  96.         activeBgColor: '',
  97.         width: 70,
  98.         title: '按钮',
  99.         titleSize: 12,
  100.         titleColor: '#fff',
  101.         icon: '',
  102.         iconWidth: 20
  103.     }],
  104.     styles: {
  105.         borderColor: '#696969',
  106.         item: {
  107.             bgColor: '#AFEEEE',
  108.             activeBgColor: '#F5F5F5',
  109.             height: 55.0,
  110.             imgWidth: 40,
  111.             imgHeight: 40,
  112.             imgCorner: 4,
  113.             nameSize:'14',
  114.             nameColor:'#000',
  115.            conditionSize:'14',
  116.             titleSize: 12.0,
  117.             titleColor: '#000',
  118.             subTitleSize: 12.0,
  119.             subTitleColor: '#000',
  120.             remarkColor: '#000',
  121.             remarkSize: 16,
  122.             remarkIconWidth: 30
  123.         }
  124.     },
  125.     fixedOn: api.frameName
  126. }, function(ret, err) {
  127.     if (ret) {
  128.         alert(JSON.stringify(ret));
  129.     } else {
  130.         alert(JSON.stringify(err));
  131.     }
  132. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

updateHeaderText

更新header文本

updateHeaderText({params})

params

text:

  • 类型：字符串类型
  • 描述：需要更新的文本

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.updateHeaderText({
  3.       text:'some text'
  4. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

close

关闭数据列表模块

close()

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.close();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

show

显示 UIListView 模块

show()

示例代码

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

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

hide

隐藏 UIListView 模块

hide()

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.hide();

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

setAttr

设置列表的纵坐标和高度

setAttr({params}, callback(ret))

params

y：

  • 类型：数字
  • 描述：（可选项）模块的纵坐标
  • 默认值：原 y 值

h：

  • 类型：数字
  • 描述：（可选项）模块的高度
  • 默认值：原 h 值

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true       //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.setAttr({
  3.     y: 40,
  4.     h: 200
  5. }, function(ret, err) {
  6.     if (ret) {
  7.         alert(JSON.stringify(ret));
  8.     } else {
  9.         alert(JSON.stringify(err));
  10.     }
  11. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

getIndex

根据开发者自定义的唯一标识（open 接口的 data 参数中自定义的唯一标识）查找列表项对应的数据

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

params

key：

  • 类型：字符串
  • 描述：调用 open 接口时，data 参数传入的开发者自定义的唯一标识的 key

value：

  • 类型：字符串
  • 描述：调用 open 接口时，data 参数传入的开发者自定义的唯一标识的 value

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     index: 0,   //数字类型；当前列表项的索引
  3.     data: []    //数组类型；当前列表项的数据，内部字段与 open 时的 data 参数一致
  4. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.getIndex({
  3.     key: 'uid',
  4.     value: '1001'
  5. }, function(ret, err) {
  6.     if (ret) {
  7.         alert(JSON.stringify(ret));
  8.     } else {
  9.         alert(JSON.stringify(err));
  10.     }
  11. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

getDataByIndex

根据列表项的索引获取对应的数据

getDataByIndex({params}, callback(ret))

params

index：

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

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     data: []    //数组类型；当前列表项的数据，内部字段与 open 时的 data 参数一致
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.getDataByIndex({
  3.     index: 0
  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及更高版本

setSwipeBtns

设置侧滑显示出来的按钮

setSwipeBtns({params}, callback(ret))

params

index：

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

btns：

  • 类型：数组
  • 描述：（可选项）列表项侧滑露出的按钮组
  • 内部字段：
  1. [{
  2.     bgColor: '#388e8e', //（可选项）字符串类型；按钮背景色，支持 rgb、rgba、#；默认：'#388e8e'
  3.     activeBgColor: '',  //（可选项）字符串类型；按钮按下时的背景色，支持 rgb、rgba、#
  4.     width: 70,          //（可选项）数字类型；按钮的宽度；默认：w / 4       
  5.     title: '',          //（可选项）字符串类型；按钮标题，水平、垂直居中
  6.     titleSize: 12,      //（可选项）数字类型；按钮标题文字大小；默认：12
  7.     titleColor: '#fff', //（可选项）字符串类型；按钮标题文字颜色，支持 rgb、rgba、#；默认：'#ffffff'
  8.     icon: '',           //（可选项）字符串类型；按钮标题前的图标路径（本地路径，支持fs://、widget://），水平、垂直居中，图标为正方形
  9.     iconWidth: 20       //（可选项）数字类型；按钮标题前的图标宽度，图标为正方形；默认：20
  10. }]

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true       //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.setSwipeBtns({
  3.     index: 0,
  4.     btns: [{
  5.         bgColor: '#388e8e',
  6.         activeBgColor: '',
  7.         width: 70,
  8.         title: '',
  9.         titleSize: 12,
  10.         titleColor: '#fff',
  11.         icon: '',
  12.         iconWidth: 20
  13.     }]
  14. }, function(ret, err) {
  15.     if (ret) {
  16.         alert(JSON.stringify(ret));
  17.     } else {
  18.         alert(JSON.stringify(err));
  19.     }
  20. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

reloadData

刷新列表数据

reloadData({params}, callback(ret))

params

data：

  • 类型：数组
  • 描述：（可选项）列表的数据源，若不传或传空，仅收起下拉刷新组件
  • 内部字段：
  1. [{
  2.     name:'LSG14HDUE485675',  //（可选项）字符串类型；名称，若不传则不显示
  3.     condition:'等待上传',     //（可选项）字符串类型；状态，若不传则不显示
  4.     conditionColor: '#000', //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
  6.     title: '',              //（可选项）字符串类型；标题，若不传或为空则不显示
  7.     subTitle: '',           //（可选项）字符串类型；子标题，若不传或为空则不显示
  8.     imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地
  9.     forbidden: false,       //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 styles->forbidden参数配置
  10.     rightBtns: []           //（可选项）数组类型；列表项向左滑动露出的按钮组，配置某一项的特定按钮组，若不传则显示通用按钮，内部字段同下方 rightBtns 参数
  11. }]

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true        //布尔型；true||false     
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.reloadData({
  3.     data: [{
  4.         imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
  5.         title: '新标题',
  6.         subTitle: '新子标题',
  7.         remark: '新备注',
  8.         icon: ''
  9.     }]
  10. }, function(ret) {
  11.     if (ret) {
  12.         alert(JSON.stringify(ret));
  13.     } else {
  14.         alert(JSON.stringify(err));
  15.     }
  16. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

deleteItem

根据索引删除某一条列表的数据

deleteItem({params}, callback(ret))

params

index：

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

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true       //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.deleteItem({
  3.     index: 2
  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及更高版本

updateItem

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

updateItem({params}, callback(ret))

params

index：

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

data：

  • 类型：JSON 对象
  • 描述：列表的数据源
  • 内部字段：
  1. [{
  2.     name:'LSG14HDUE485675',  //（可选项）字符串类型；名称，若不传则不显示
  3.     condition:'等待上传',     //（可选项）字符串类型；状态，若不传则不显示
  4.     conditionColor: '#000', //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
  6.     title: '',              //（可选项）字符串类型；标题，若不传或为空则不显示
  7.     subTitle: '',           //（可选项）字符串类型；子标题，若不传或为空则不显示
  8.     imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地
  9.     forbidden: false,       //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 styles->forbidden参数配置
  10.     rightBtns: []           //（可选项）数组类型；列表项向左滑动露出的按钮组，配置某一项的特定按钮组，若不传则显示通用按钮，内部字段同下方 rightBtns 参数
  11. }]

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true     //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.updateItem({
  3.     index: 2,
  4.     data: {
  5.         imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
  6.         title: '刷新标题',
  7.         subTitle: '刷新子标题',
  8.     }
  9. }, function(ret, err) {
  10.     if (ret) {
  11.         alert(JSON.stringify(ret));
  12.     } else {
  13.         alert(JSON.stringify(err));
  14.     }
  15. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

insertItem

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

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

params

index：

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

data：

  • 类型：JSON 对象
  • 描述：列表的数据源
  • 内部字段：
  1. [{
  2.     name:'LSG14HDUE485675',  //（可选项）字符串类型；名称，若不传则不显示
  3.     condition:'等待上传',     //（可选项）字符串类型；状态，若不传则不显示
  4.     conditionColor: '#000', //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
  6.     title: '',              //（可选项）字符串类型；标题，若不传或为空则不显示
  7.     subTitle: '',           //（可选项）字符串类型；子标题，若不传或为空则不显示
  8.     imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地
  9.     forbidden: false,       //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 styles->forbidden参数配置
  10.     rightBtns: []           //（可选项）数组类型；列表项向左滑动露出的按钮组，配置某一项的特定按钮组，若不传则显示通用按钮，内部字段同下方 rightBtns 参数
  11. }]

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true          //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.insertItem({
  3.     index: 2,
  4.     data: [{
  5.         imgPath: 'http://d.hiphotos.baidu.com/image/pic/item/4d086e061d950a7b29a788c209d162d9f2d3c922.jpg',
  6.         title: '12:00',
  7.         subTitle: 'APICloud粉丝互动会',
  8.     }]
  9. }, function(ret, err) {
  10.     if (ret) {
  11.         alert(JSON.stringify(ret));
  12.     } else {
  13.         alert(JSON.stringify(err));
  14.     }
  15. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

appendData

向列表末端追加数据

appendData({params}, callback(ret))

params

data：

  • 类型：数组对象
  • 描述：列表的数据源，若不传或传空，仅收起上拉加载组件
  • 内部字段：
  1. [{
  2.     name:'LSG14HDUE485675',  //（可选项）字符串类型；名称，若不传则不显示
  3.     condition:'等待上传',     //（可选项）字符串类型；状态，若不传则不显示
  4.     conditionColor: '#000', //（可选项）字符串类型；列表项状态文字颜色，支持 rgb，rgba，#；默认：'#000000'
  6.     title: '',              //（可选项）字符串类型；标题，若不传或为空则不显示
  7.     subTitle: '',           //（可选项）字符串类型；子标题，若不传或为空则不显示
  8.     imgPath: '',            //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地
  9.     forbidden: false,       //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 styles->forbidden参数配置
  10.     rightBtns: []           //（可选项）数组类型；列表项向左滑动露出的按钮组，配置某一项的特定按钮组，若不传则显示通用按钮，内部字段同下方 rightBtns 参数
  11. }]

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true        //布尔型；true||false
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.appendData({
  3.     data: [{
  4.         imgPath: 'http://d.hiphotos.baidu.com/image/pic/item/4d086e061d950a7b29a788c209d162d9f2d3c922.jpg',
  5.         title: '新增标题',
  6.         subTitle: '新增子标题',
  7.     }]
  8. }, function(ret, err) {
  9.     if (ret) {
  10.         alert(JSON.stringify(ret));
  11.     } else {
  12.         alert(JSON.stringify(err));
  13.     }
  14. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

getCount

获取当前列表的总数据量

getCount(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     count: 21        //数字类型；当前列表包含的数据总数
  3. }

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.getCount(function(ret) {
  3.     alert(JSON.stringify(ret));
  4. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

setRefreshHeader

设置下拉刷新，通过 reloadData 收起下拉刷新组件

setRefreshHeader({params}, callback(ret))

params

style：

  • 类型：JSON对象
  • 描述：下拉刷新的样式配置
  • 内部字段：
  1. {
  2.     bgColor: '#C0C0C0',                         //（可选项）字符串类型；下拉刷新的背景设置，支持 rgb、rgba、#，该背景大小同当前模块的宽高；默认：#C0C0C0
  3.     refreshHeaderHeight : 60 ,                  //（可选项）数字类型；下拉高度达到一定阈值，本参数暂仅支持 ios 平台；默认：60
  4.     loadAnimInterval : 200 ,                    //（可选项）数字类型；图片播放时间间隔，单位为毫秒；默认：200
  5.     image: {                                    //（可选项）JSON 对象类型；下拉刷新相关图片设置；若不传则使用默认图标
  6.       pull:['fs://t1.png','fs://t2.png',...],  //（可选项）数组类型；组成下拉过程的动画关键帧图片数组，这组图片随下拉高度同步放大缩小，同时自动播放关键帧图片：每下拉一定距离（阈值/图片数量），播放一帧关键帧图片；图片规格为正方形，如：50*50、100*100；若不传则使用默认图标
  7.       load: ['fs://t1.png','fs://t2.png',...]  //（可选项）数组类型；组成下拉刷新加载状态动画的关键帧图片数组，图片为正方形的，如：50*50、100*100，建议开发者传大小合适的图片以适配高分辨率手机屏幕；若不传则使用默认图标
  8.     },
  9.     isScale: true                              //（可选项）布尔类型；播放下拉过程中的关键帧动画时，是否同时添加等比同步缩放效果；默认值：true
  10. }

callback()

下拉刷新的事件回调

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.setRefreshHeader({
  3.    style: {
  4.         bgColor: '#C0C0C0',
  5.         isScale: true,
  6.         image: {
  7.             pull: [
  8.                 'widget://image/refresh/dropdown0.png',
  9.                 'widget://image/refresh/dropdown1.png',
  10.                 'widget://image/refresh/dropdown2.png',
  11.                 'widget://image/refresh/dropdown3.png',
  12.                 'widget://image/refresh/dropdown4.png',
  13.                 'widget://image/refresh/dropdown5.png',
  14.                 'widget://image/refresh/dropdown6.png'
  15.             ],
  16.             load: [
  17.                 'widget://image/refresh/loading0.png',
  18.                 'widget://image/refresh/loading1.png',
  19.                 'widget://image/refresh/loading2.png',
  20.                 'widget://image/refresh/loading3.png',
  21.                 'widget://image/refresh/loading4.png'
  22.             ]
  23.         }
  24.     }
  25. }, function(ret) {
  26.    //下拉刷新被触发，自动进入加载状态，使用 reloadData() 手动结束加载中状态
  27.     alert('开始加载刷新数据，摇一摇停止加载状态');
  28.     api.addEventListener({
  29.         name: 'shake'
  30.     }, function(ret, err) {
  31.         UIListBadge.reloadData();
  32.     });
  33. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

setRefreshFooter

设置上拉加载，通过 appendData 收起上拉加载组件

setRefreshFooter({params}, callback())

params

loadingImg：

  • 类型：字符串
  • 描述：上拉加载时显示的小箭头图标的本地路径，要求本地路径（fs://、widget://）

bgColor：

  • 类型：字符串
  • 描述：（可选项）上拉加载区域的背景色，支持 rgb、rgba、#
  • 默认值：’#f5f5f5’

textColor：

  • 类型：字符串
  • 描述：（可选项）提示文字颜色，支持 rgb、rgba、#
  • 默认值：’#8e8e8e’

textUp：

  • 类型：字符串
  • 描述：（可选项）上拉提示文字
  • 默认值：’上拉加载更多…’

textDown：

  • 类型：字符串
  • 描述：（可选项）松开提示文字
  • 默认值：’松开开始加载…’

loadingText:

  • 类型：字符串
  • 描述：（可选项）提示文字
  • 默认值：正在加载…

lastUpdateText:

  • 类型：字符串
  • 描述：（可选项）提示文字
  • 默认值：上次更新时间:

showTime：

  • 类型：布尔值
  • 描述：（可选项）是否显示刷新时间
  • 默认值：true

callback(ret)

上拉加载的事件回调

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.setRefreshFooter({
  3.     loadingImg: 'widget://res/UIListView_arrow.png',
  4.     bgColor: '#F5F5F5',
  5.     textColor: '#8E8E8E',
  6.     textUp: '上拉加载更多...',
  7.     textDown: '松开开始加载...',
  8.     showTime: true
  9. }, function(ret, err) {
  10.     if (ret) {
  11.         alert(JSON.stringify(ret));
  12.     } else {
  13.         alert(JSON.stringify(err));
  14.     }
  15. });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

stopRefresh

停止刷新(仅Android有效)

stopRefresh()

示例代码

  1. var UIListUpload = api.require('UIListUpload');
  2. UIListUpload.stopRefresh();

可用性

Android系统

可提供的1.0.0及更高版本