flutter如何实现省市区选择器

前言

当我们需要用户填写地址时,稳妥的做法是让用户通过"滚轮"来滑动选择省份,市,区,此文采用flutter的第三方库来实现这一功能,比调用高德地图api简单一些。

流程

选择库

这里我选择了一个最近更新且支持中国的库

添加配置信息

pubspec.yaml的依赖增加city_pickers: ^1.3.0

然后pub get一下

代码

这里我直接准备好了一个调用选择器的代码,直接在onpressed,或者是tapped传入这个函数

复制代码
  Future<void> _showCityPicker() async {
    Result? result = await CityPickers.showCityPicker(
      context: context,
    );

    if (result != null) {
      // 使用选择的result
      // city 就是 result.city
    }
  }

另外,在CityPickers.showCityPicker里面不止可以传入context,详情见官方文档

city_pickers | Flutter package (pub.dev)

支持所有平台

相关推荐
行者961 小时前
用Flutter打造适配OpenHarmony的打卡组件:实践与优化
flutter·harmonyos·鸿蒙
cn_mengbei1 小时前
Flutter for OpenHarmony 实战:DropdownButton 下拉选择按钮详解
flutter
cn_mengbei1 小时前
Flutter for OpenHarmony 实战:Checkbox 复选框详解
flutter
小雨下雨的雨1 小时前
Flutter跨平台开发实战: 鸿蒙与循环交互艺术:虚拟列表与百万级数据性能巅峰
flutter·华为·交互·harmonyos·鸿蒙系统
不爱吃糖的程序媛1 小时前
Flutter-OH三方库适配:从实践到社区共建的样板间打造
flutter
kirk_wang1 小时前
Flutter艺术探索-Flutter图片加载与缓存优化
flutter·移动开发·flutter教程·移动开发教程
前端不太难1 小时前
Flutter 状态复杂度,如何在架构层提前“刹车”
flutter·架构·状态模式
小雨下雨的雨1 小时前
Flutter跨平台开发实战: 鸿蒙与循环交互艺术:Sliver 视差滚动与沉浸式布局
flutter·华为·交互·harmonyos·鸿蒙系统
kirk_wang2 小时前
Flutter audioplayers 库鸿蒙平台适配实战:从原理到优化
flutter·移动开发·跨平台·arkts·鸿蒙
小雨下雨的雨2 小时前
Flutter跨平台开发实战: 鸿蒙与循环交互艺术:卡片堆叠与叠放切换动效
flutter·华为·交互·harmonyos·鸿蒙系统