Android 省份城市搜索,android - 非常不错的 城市省份的选择组件: citypicker

android - 非常不错的 城市省份的选择组件: citypicker

2017-11-03 11:59

访问量: 2184

分类:

技术

用法:

1.  修改根目录下的build.gradle, 增加:

dependencies: {

classpath 'com.jfrog.bintray.gradle:gradle-bintray-plugin:1.0'

classpath 'com.github.dcendents:android-maven-gradle-plugin:1.4.1'

}

2. 修改  app/build.gradle, 增加:

dependencies: {

compile project(':citypickerview')

}

3. 把 上面github 源代码中的 citypickerview 目录整个 copy到根目录下

4. settings.gradle文件:

include ':app', ':citypickerview'

5. 找到某个Activity (例如MainActivity.java)  ,  在对应的xml中,增加:

6. 点击该按钮之后,会弹出这个View:

provinceAndCity = (TextView)findViewById(R.id.province_and_city);

//城市滚轮选择器

provinceAndCity.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

CityPickerView cityPicker = new CityPickerView.Builder(UserEditActivity.this).textSize(20)

.titleTextColor("#000000")

.backgroundPop(0xa0000000)

.province("江苏省")

.city("南京市")

.district("秦淮区")

.textColor(Color.parseColor("#000000"))

.provinceCyclic(true)

.cityCyclic(false)

.districtCyclic(false)

.visibleItemsCount(7)

.itemPadding(10)

.build();

cityPicker.show();

cityPicker.setOnCityItemClickListener(new CityPickerView.OnCityItemClickListener() {

@Override

public void onSelected(ProvinceBean province, CityBean city, DistrictBean district) {

//返回结果

Log.d(TAG, "== 所选城市:" + province.getName() + " " + city.getName() + " " + district.getName());

}

@Override

public void onCancel() {

}

});

}

});

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
引用的内容描述了在uniapp中实现城市三级联动组件的方法。根据引用和引用[2]中的代码,可以通过加载省、市和区(县)的数据来实现三级联动。首先,使用loadCity方法加载省份数据。接着,在省份选择完成后,使用loadArea方法加载该省份下的城市数据。最后,在城市选择完成后,使用loadArea方法加载该城市下的区(县)数据。 以下是一个实现城市三级联动组件的示例代码: ```javascript <template> <div> <!-- 省份选择 --> <select v-model="selectedProvince" @change="handleProvinceChange"> <option v-for="province in provinces" :value="province.id">{{ province.name }}</option> </select> <!-- 城市选择 --> <select v-model="selectedCity" @change="handleCityChange"> <option v-for="city in cities" :value="city.id">{{ city.name }}</option> </select> <!-- 区(县)选择 --> <select v-model="selectedArea"> <option v-for="area in areas" :value="area.id">{{ area.name }}</option> </select> </div> </template> <script> export default { data() { return { provinces: [], // 省份数据 cities: [], // 城市数据 areas: [], // 区(县)数据 selectedProvince: '', // 已选中的省份 selectedCity: '', // 已选中的城市 selectedArea: '' // 已选中的区(县) }; }, created() { // 加载省份数据 this.loadProvinces(); }, methods: { // 加载省份数据 loadProvinces() { // 请求省份数据的接口 // 将接口返回的数据赋值给this.provinces }, // 加载城市数据 loadCities(provinceId) { // 请求城市数据的接口,参数传入当前选中的省份id // 将接口返回的数据赋值给this.cities }, // 加载区(县)数据 loadAreas(cityId) { // 请求区(县)数据的接口,参数传入当前选中的城市id // 将接口返回的数据赋值给this.areas }, // 处理省份选择变化 handleProvinceChange() { this.selectedCity = ''; // 清空已选中的城市 this.selectedArea = ''; // 清空已选中的区(县) this.loadCities(this.selectedProvince); // 加载对应的城市数据 }, // 处理城市选择变化 handleCityChange() { this.selectedArea = ''; // 清空已选中的区(县) this.loadAreas(this.selectedCity); // 加载对应的区(县)数据 } } }; </script> ``` 以上代码是一个简单的示例,你可以根据自己的项目需求进行适当的修改。通过这个示例,你可以实现一个基本的uniapp城市三级联动组件

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值