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)

支持所有平台

相关推荐
jiejiejiejie_43 分钟前
Flutter 三方库 pull_to_refresh 的鸿蒙化适配指南
flutter·华为·harmonyos
SoaringHeart2 小时前
Flutter进阶:用OverlayEntry 实现所有弹窗效果
前端·flutter
MonkeyKing8 小时前
Flutter约束模型(BoxConstraints)与布局体系完全解析
flutter
IntMainJhy10 小时前
Flutter 三方库 ImageCropper 图片裁剪鸿蒙化适配与实战指南(正方形+自定义比例全覆盖)
flutter·华为·harmonyos
IntMainJhy10 小时前
Flutter for OpenHarmony 第三方库六大核心模块整合实战全解|从图片处理、消息通知到加密存储、设备推送 一站式鸿蒙适配开发总结
flutter·华为·harmonyos
张风捷特烈10 小时前
状态管理大乱斗#02 | Bloc 源码全面评析
android·前端·flutter
IntMainJhy10 小时前
【fluttter for open harmony】Flutter 三方库适配实战:在 OpenHarmony 上实现图片压缩功能(附超详细踩坑记录)
flutter·华为·harmonyos
jiejiejiejie_10 小时前
Flutter for OpenHarmony 多语言国际化超简单实现指南
flutter·华为·harmonyos
里欧跑得慢12 小时前
12. CSS滤镜效果详解:为页面注入艺术灵魂
前端·css·flutter·web
里欧跑得慢12 小时前
CSS 级联层:控制样式优先级的新方式
前端·css·flutter·web