UILinkageSelector

论坛示例

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

概述

UILinkageSelector是一个三级联动选择器。开发者可自定义其位置大小,及其数据源。适用于各种需要选择器的app。

注意:该插件无遮罩层

open

打开选择器

open({params})

params

rect:

  • 类型:JSON 类型
  • 描述:(可选项)插件的位置及尺寸)
  • 内部字段:
{
    x: 30,                                //(可选项)数字类型;插件左上角的 x 坐标(相对于所属的 Window 或 Frame);默认值:30
    y: 100,                              //(可选项)数字类型;插件左上角的 y 坐标(相对于所属的 Window 或 Frame);默认值:0
    w: api.frameWidth - 60,              //(可选项)数字类型;插件宽度(相对于所属的 Window 或 Frame);默认api.frameWidth - 60
    h: 245                               //(可选项)数字类型;插件高度(相对于所属的 Window 或 Frame);默认245
}

resource:

  • 类型:字符串
  • 描述:城市列表的数据源文件路径(支持widget、fs 路径协议),数据源文件必须为.json文件。城市的JSON数据会在callback时按原格式返回。若为 json 文件则必须是标准的 json格式,否则会报错。
  • .json文件内部字段:
{
"list":{
  "first": [
      {
        "name": "山东省",
        "id": "1",
        "second": [{
            "name": "济南市",
            "id": "1",
                    "third": [
                      {
                        "name": "历下区",
                        "id": "1"
                      },
                      {
                        "name": "章丘市",
                        "id": "10"
                      },
                       {
                        "name": "高新区",
                        "id": "145"
                       },
                       {
                        "name": "市中区",
                        "id": "2"
                       },
                       {
                        "name": "槐荫区",
                        "id": "3"
                       },
                       {
                        "name": "天桥区",
                        "id": "4"
                       },
                       {
                        "name": "历城区",
                        "id": "5"
                       },
                       {
                        "name": "长清区",
                         "id": "6"
                       },
                       {
                        "name": "平阴县",
                        "id": "7"
                       },
                       {
                        "name": "济阳县",
                        "id": "8"
                       },
                       {
                        "name": "商河县",
                        "id": "9"
                       }
                      ]

                  }]
         },		 		 
        {
            "name":"黑龙江省",
            "id":"11",
            "second": [{
                "name": "哈尔滨市",
                "id": "145",
                        "third": [
                          {
                            "name": "道里区",
                            "id": "464"
                          },
                          {
                            "name": "道外区",
                            "id": "465"
                          },
                          {
                            "name": "南岗区",
                            "id": "466"
                              },
                              {
                                "name": "平房区",
                                "id": "467"
                              },
                              {
                                "name": "香坊区",
                                "id": "468"
                              },
                              {
                                "name": "松北区",
                                "id": "469"
                              },
                              {
                                "name": "动力区",
                                "id": "470"
                              },
                              {
                                "name": "开发区",
                                "id": "471"
                              },
                              {
                                "name": "依兰县",
                                "id": "472"
                              },
                              {
                                "name": "呼兰区",
                                "id": "473"
                              },
                              {
                                "name": "方正县",
                                "id": "474"
                              },
                              {
                                "name": "宾县",
                                "id": "475"
                              },
                              {
                                "name": "延寿县",
                                "id": "476"
                              },
                              {
                                "name": "巴彦县",
                                "id": "477"
                              },
                              {
                                "name": "阿城区",
                                "id": "478"
                              },
                              {
                                "name": "木兰县",
                                "id": "479"
                              },
                              {
                                "name": "双城市",
                                "id": "480"
                              },
                              {
                                "name": "通河县",
                                "id": "481"
                              },
                              {
                                "name": "尚志市",
                                "id": "482"
                              },
                              {
                                "name": "五常市",
                                "id": "483"
                              }

                  ]}
             ]}
          ]}
}

styles:

  • 类型:JSON 类型
  • 描述:(可选项)插件各部分的样式
  • 内部字段:
{     
  bg:'#fff',                              //(可选项)插件背景颜色;支持 rgb,rgba,#;默认:#fff                           
 fontColor: '#000000',                    //(可选项)字符串类型;未选中字体颜色;支持 rgb,rgba,#;默认:'#000000'
 selectedColor:'#8B0000',                 //(可选项)字符串类型;选中字体颜色;支持 rgb,rgba,#;默认:'#8B0000'

}

indexs:

  • 类型:数组
  • 描述:打开插件时默认选项下标组成的数组,如:[0,0,0]
  • 默认:各级选项的首项的索引组成的数组

fixedOn:

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

fixed:

  • 类型:布尔
  • 描述:(可选项)是否将插件视图固定到窗口上(不跟随窗口上下滚动)
  • 默认:true

示例代码

var UILinkageSelector = api.require('UILinkageSelector');
UILinkageSelector.open({
    rect:{
    x: 30,                                   
    y: 100,                                  
    w: api.frameWidth - 60,                 
    h: 245                            
   },
   styles:{
   bg:'#fff', 
   fontColor: '#000000', 
   selectedColor:'#8B0000',                 
},
   resource:widget://res/city.json,
   indexs:[0,0,0],
    fixedOn: api.frameName,
    fixed:true,
}, function(ret, err) {
    if (ret) {
        api.alert({msg: JSON.stringify(ret)});
    } else {
        api.alert({msg: JSON.stringify(err)});
    }
});

可用性

iOS系统,安卓系统

可提供的1.0.0及更高版本

confirm

确定事件

confirm({callback})

callback(ret)

ret:

  • 类型:JSON 对象

  • 内部字段:

{
    province:{	//选中的第一级(省)
        name:'',
        id:''
    }, 
    city:{		//选中的第二级(市)
        name:'',
        id:''
    },                    
    county:{	//选中的第三级(县)
        name:'',
        id:''
    }          
}

示例代码

var UILinkageSelector = api.require('UILinkageSelector');
UILinkageSelector.confirm(function(ret, err) {
    if (ret) {
        api.alert({msg: JSON.stringify(ret)});
    } else {
        api.alert({msg: JSON.stringify(err)});
    }
});

可用性

iOS系统,安卓系统

可提供的1.0.0及更高版本

hide

隐藏选择器

hide()

示例代码

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

可用性

iOS系统,安卓系统

可提供的1.0.0及更高版本

show

显示选择器

show()

示例代码

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

可用性

iOS系统,安卓系统

可提供的1.0.0及更高版本

close

关闭选择器

close()

示例代码

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

可用性

iOS系统,安卓系统

可提供的1.0.0及更高版本

是否仍需要帮助? 请保持联络!
最后更新于 2024/04/24