Flutterで州と都市のセレクターを実装する方法

序文

ユーザーに住所を入力してもらう必要がある場合、安全なアプローチは、ユーザーが「ホイール」を使ってスライドして州、市、地区を選択できるようにすることです。この記事では、Flutter のサードパーティ ライブラリを使用してこの機能を実装しています。これは、呼び出しよりも簡単です。 Amap API。

プロセス

ライブラリの選択

ここでは中国をサポートする最近更新されたライブラリを選択しました

構成情報の追加

pubspec.yaml の依存関係が追加されました city_pickers: ^1.3.0

それならパブで手に入れましょう

コード

ここでは、セレクターを呼び出すコードを直接準備し、この関数を onpressed または Tapped に直接渡します。

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

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

なお、CityPickers.showCityPickerで渡せるのはコンテキストだけではありませんので、詳しくは公式ドキュメントをご覧ください。

シティピッカー | Flutter パッケージ (pub.dev)

すべてのプラットフォームをサポート