Flutter附近城市搜索插件nearby_city的使用

发布于 1周前 作者 zlyuanteng 来自 Flutter

Flutter附近城市搜索插件nearby_city的使用

本插件通过提供镇（읍면동）和城市（시군구）名称来获取附近的韩国城市。你可以通过提供过滤参数（如限制和距离，单位为公里）来调整结果。

特性

当您结合当前定位功能使用此特性时，该插件非常适合获取附近的城市。通过获取当前定位，您可以假设已拥有以（城市、镇）名称或（纬度、经度）形式的数据。

  • getNearbyCityByTown: 通过镇（必需）和城市（可选）名称获取附近城市。
  • getNearbyCityByLatLng: 通过纬度（必需）和经度（必需）获取附近城市。

以下是每个参数在韩国行政区划中的含义：

  • state: 市、道
  • city: 市、郡、区
  • town: 镇、面、洞

开始使用

请参阅“安装”部分了解如何将此插件添加到您的现有项目中。安装完成后，请参阅“示例”部分了解如何使用此插件。

其他信息

我们使用的行政区域数据发布于2023年7月，来自韩国行政安全部（행정안전부）。随着新的数据发布，我们将更新插件以包含最新数据。

完整示例代码

以下是一个完整的示例代码，演示了如何使用nearby_city插件获取附近的韩国城市。

import 'package:nearby_city/nearby_city.dart';

void main() async {
  // 初始化实例
  var nearbyCityService = NearbyCityService();

  try {
    // 仅通过镇（읍면동）获取附近城市
    List<dynamic> data1 = await nearbyCityService.getNearbyCityByTown(
      town: '강남동', // 镇名称
    );
    print(data1);

    // 通过镇（읍면동）和城市（시군구）获取附近城市
    List<dynamic> data2 = await nearbyCityService.getNearbyCityByTown(
      town: '강남동', // 镇名称
      city: '강릉시', // 城市名称
    );
    print(data2);

    // 通过镇（읍면동）和城市（시군구），城市名称包含空格
    List<dynamic> data3 = await nearbyCityService.getNearbyCityByTown(
      town: '성복동', // 镇名称
      city: '용인시 수지구', // 城市名称
    );
    print(data3);

    // 使用 "limit" 参数限制返回的数据数量
    List<dynamic> data4 = await nearbyCityService.getNearbyCityByTown(
      town: '성복동', // 镇名称
      limit: 3, // 返回前3个结果
    );
    print(data4);

    // 使用 "distance" 参数获取指定范围内的城市（单位：公里）
    List<dynamic> data5 = await nearbyCityService.getNearbyCityByTown(
      town: '성복동', // 镇名称
      distance: 5, // 距离为5公里
    );
    print(data5);

    // 通过纬度和经度获取附近城市
    List<dynamic> data6 = await nearbyCityService.getNearbyCityByLatLng(
      lat: 37.316416, // 纬度
      lng: 127.069013, // 经度
    );
    print(data6);

    // 通过纬度和经度获取附近城市，并使用 "distance" 参数
    List<dynamic> data7 = await nearbyCityService.getNearbyCityByLatLng(
      lat: 37.316416, // 纬度
      lng: 127.069013, // 经度
      distance: 1.5, // 距离为1.5公里
    );
    print(data7);

    // 通过纬度和经度获取附近城市，并使用 "limit" 参数
    List<dynamic> data8 = await nearbyCityService.getNearbyCityByLatLng(
      lat: 37.316416, // 纬度
      lng: 127.069013, // 经度
      limit: 3, // 返回前3个结果
    );
    print(data8);
  } catch (e) {
    print(e); // 捕获并打印错误
  }
}

更多关于Flutter附近城市搜索插件nearby_city的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter附近城市搜索插件nearby_city的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，关于如何在Flutter应用中使用nearby_city插件来实现附近城市搜索功能，以下是一个简单的代码示例。假设你已经在pubspec.yaml文件中添加了nearby_city依赖并运行了flutter pub get命令。

1. 添加依赖

首先，确保你的pubspec.yaml文件中包含以下依赖项：

dependencies:
  flutter:
    sdk: flutter
  nearby_city: ^最新版本号  # 请替换为实际最新版本号

2. 导入插件

在你的Dart文件中导入nearby_city插件：

import 'package:nearby_city/nearby_city.dart';

3. 使用插件获取附近城市

下面是一个完整的示例，展示如何使用nearby_city插件来获取并显示附近的城市：

import 'package:flutter/material.dart';
import 'package:nearby_city/nearby_city.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List<City> nearbyCities = [];
  String searchTerm = "";

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('附近城市搜索'),
        ),
        body: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            children: <Widget>[
              TextField(
                decoration: InputDecoration(
                  labelText: '输入城市名或关键词',
                ),
                onChanged: (value) {
                  searchTerm = value;
                  _searchNearbyCities();
                },
              ),
              SizedBox(height: 16.0),
              Expanded(
                child: nearbyCities.isEmpty
                    ? Center(child: CircularProgressIndicator())
                    : ListView.builder(
                        itemCount: nearbyCities.length,
                        itemBuilder: (context, index) {
                          return ListTile(
                            title: Text(nearbyCities[index].name),
                            subtitle: Text(nearbyCities[index].country),
                          );
                        },
                      ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Future<void> _searchNearbyCities() async {
    setState(() {
      nearbyCities = []; // 清空之前的结果
    });

    if (searchTerm.isEmpty) {
      return;
    }

    try {
      NearbyCityResult result = await NearbyCity.searchCities(searchTerm);
      if (result.status == "success") {
        setState(() {
          nearbyCities = result.data;
        });
      } else {
        // 处理错误情况，例如显示SnackBar或Toast
        print("搜索失败: ${result.message}");
      }
    } catch (e) {
      // 处理异常，例如网络错误
      print("发生错误: $e");
    }
  }
}

class City {
  String name;
  String country;

  City({required this.name, required this.country});

  factory City.fromJson(Map<String, dynamic> json) {
    return City(
      name: json['name'] as String,
      country: json['country'] as String,
    );
  }
}

注意事项

  1. 错误处理：在实际应用中，应该添加更多的错误处理和用户反馈机制，比如使用SnackBar或Dialog来显示错误信息。
  2. UI优化：可以根据需要优化UI，比如添加加载动画、搜索历史记录等。
  3. 数据解析：NearbyCityResult和City类的结构可能需要根据实际插件返回的JSON数据进行调整。

这个示例代码提供了一个基本的框架，展示了如何使用nearby_city插件在Flutter应用中实现附近城市的搜索功能。你可以根据具体需求进一步扩展和优化这个示例。

回到顶部