選擇城市插件 · 從零開始的避坑指南

# 選擇城市插件 [TOC] ## UICityList插件 > 應用**UICityList**第三方模塊注：resource屬性的文件路徑 ~~~ UICityList = api.require('UICityList'); UICityList.open({ rect: { x: 0, y: headerH, w: api.winWidth, h: api.winHeight - headerH }, resource: 'widget://res/cityList.json', styles: { searchBar: { bgColor: '#696969', cancelColor: '#E3E3E3' }, location: { color: '#696969', size: 12 }, sectionTitle: { bgColor: '#eee', color: '#000', size: 12 }, item: { bgColor: '#fff', activeBgColor: '#696969', color: '#000', size: 14, height: 40 }, indicator: { bgColor: '#fff', color: '#696969' } }, currentCity: cName, locationWay: 'GPS', placeholder: '輸入城市名或首字母查詢' }, function(ret, err) { if (ret.eventType == 'selected') { changeCity = ret.cityInfo.city; $api.rmStorage('cityName'); //刪除原來的城市名稱 $api.setStorage('cityName',changeCity); //更新城市名稱存入緩存 api.sendEvent({ name: 'changeCity', }); api.closeWin(); } }); ~~~ ## **UIActionSelector** >UIActionSelector城市選擇模塊注：resource屬性的文件路徑 ~~~ UIActionSelector = api.require('UIActionSelector'); function fnOpenSelect() { UIActionSelector.open({ datas : 'widget://res/city.json', layout : { row : 5, col : 3, height : 30, size : 12, sizeActive : 14, rowSpacing : 5, colSpacing : 10, maskBg : 'rgba(0,0,0,0.2)', bg : '#fff', color : '#888', colorActive : '#f00', colorSelected : '#f00' }, animation : true, cancel : { text : '取消', size : 12, w : 90, h : 35, bg : '#fff', bgActive : '#ccc', color : '#888', colorActive : '#fff' }, ok : { text : '確定', size : 12, w : 90, h : 35, bg : '#fff', bgActive : '#ccc', color : '#888', colorActive : '#fff' }, title : { text : '請選擇', size : 12, h : 44, bg : '#eee', color : '#888' }, fixedOn : api.frameName }, function(ret, err) { if (ret) { if (ret.level3 == null) { var region = ret.level1 + ret.level2; $api.val($api.byId('region'), region); }else{ var region = ret.level1 + ret.level2 + ret.level3; $api.val($api.byId('region'), region); $api.val($api.byId('region1'), region); $api.val($api.byId('region2'), region); $api.val($api.byId('region3'), region); $api.val($api.byId('region4'), region); $api.val($api.byId('region5'), region); } } else { alert(JSON.stringify(err)); } }); } ~~~