패키지, 저장소 및 앱 카테고리 검색

패키지 상세v0.0.10

location_map_picker

지도에서 위치를 선택하고 Google 지도에서 어떤 장소나 검색하여 출력 및 장소 이름과 LatLng를 가져옵니다. Google 지도와 Geolocator를 사용합니다.

30일 다운로드
17
좋아요
10
Pub 점수
75

패키지 설치

flutter pub add location_map_picker

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

Flutter 패키지로 앱 내에서 직접 Google 지도에서 위치를 선택할 수 있도록 해줍니다. Geolocator 플러그인을 사용하여 개발되었으며, Google 지도와 위치 정보 서비스를 통합하여 사용자가 장소를 검색하고 장소 이름 및 LatLng 좌표와 같은 정확한 정보를 얻을 수 있도록 합니다. 원활한 지도 상호작용과 주소 해결 기능을 지원하며 직관적인 지도 인터페이스를 통해 정확한 위치 입력이 필요한 앱에 적합합니다.

사용 사례

  • 지도 기반 위치 선택
  • 자동 완성 기능이 있는 주소 검색
  • Google Maps를 통한 지오코딩
  • 양식 내 위치 공유
  • 실시간 위치 추적
  • 위치 입력을 포함한 사용자 온보딩

주요 기능

  • 인터랙티브한 Google 지도 통합
  • 장소 이름 및 LatLng 출력
  • 검색 가능한 위치 입력
  • 지오로케이터 기반 지오코딩
  • 지도 상호작용을 위한 간단한 API
  • 모바일용 반응형 UI

적합한 대상

  • 여행 및 배달 앱
  • 이벤트 등록 플랫폼
  • 배송 및 물류 시스템
  • 위치 태그가 있는 소셜 미디어
  • 위치로 사용자 프로필 설정
  • 정확한 위치 정보 데이터가 필요한 앱

고려 사항

  • Google 지도 사용을 위해 인터넷 연결이 필요합니다
  • Google Maps용 API 키가 필요합니다
  • Android 및 iOS에만 제한됨(웹 지원 없음)
  • Geolocator 플러그인에 의존
  • 저사양 기기에서의 성능에 미치는 잠재적 영향
  • 위치 데이터와 관련된 개인정보 고려 사항

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

location_map_picker:

widget to pick a location on a map with google map.

# 👨‍💻 Developed by:

profile

Nasr Al-Rahbi @abom_me

👨🏻‍💻 Find me in :

Twitter Instagram LinkedIn Stack Overflow



  • Compatibility with Geolocator
  • Use of Google map APIs
Android iOS Flutter Web
Support SDK 20+ iOS 9+ Not yet

Location picker using the official google_maps_flutter.

Setup

Pubspec changes:

      dependencies:
        map_location_picker: ^0.0.7

Sample example:

import 'package:location_map_picker/location_map_picker.dart';
MapPicker(
apiKey: "YOUR_API_KEY",
onPin: (PinData? result) {
...
},
);

Getting Started

For more details, see Getting started with Google Maps Platform.

Android
  1. Set the minSdkVersion in android/app/build.gradle:
android {
    defaultConfig {
        minSdkVersion 20
    }
}

This means that app will only be available for users that run Android SDK 20 or higher.

  1. Specify your API key in the application manifest android/app/src/main/AndroidManifest.xml:
<manifest ...
  <application ...
    <meta-data android:name="com.google.android.geo.API_KEY"
               android:value="YOUR KEY HERE"/>
Hybrid Composition

To use Hybrid Composition to render the GoogleMap widget on Android, set AndroidGoogleMapsFlutter.useAndroidViewSurface to true.

if (defaultTargetPlatform == TargetPlatform.android) {
  AndroidGoogleMapsFlutter.useAndroidViewSurface = true;
}
iOS

To set up, specify your API key in the application delegate ios/Runner/AppDelegate.m:

#include "AppDelegate.h"
#include "GeneratedPluginRegistrant.h"
#import "GoogleMaps/GoogleMaps.h"
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [GMSServices provideAPIKey:@"YOUR KEY HERE"];
  [GeneratedPluginRegistrant registerWithRegistry:self];
  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}
@end

Or in your swift code, specify your API key in the application delegate ios/Runner/AppDelegate.swift:

import UIKit
import Flutter
import GoogleMaps
@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    GMSServices.provideAPIKey("YOUR KEY HERE")
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}
Note

The following permissions are not required to use Google Maps Android API v2, but are recommended.

android.permission.ACCESS_COARSE_LOCATION Allows the API to use WiFi or mobile cell data (or both) to determine the device's location. The API returns the location with an accuracy approximately equivalent to a city block.

android.permission.ACCESS_FINE_LOCATION Allows the API to determine as precise a location as possible from the available location providers, including the Global Positioning System (GPS) as well as WiFi and mobile cell data.


You must also explicitly declare that your app uses the android.hardware.location.network or android.hardware.location.gps hardware features if your app targets Android 5.0 (API level 21) or higher and uses the ACCESS_COARSE_LOCATION or ACCESS_FINE_LOCATION permission in order to receive location updates from the network or a GPS, respectively.

<uses-feature android:name="android.hardware.location.network" android:required="false" />
<uses-feature android:name="android.hardware.location.gps" android:required="false"  />

The following permissions are defined in the package manifest, and are automatically merged into your app's manifest at build time. You don't need to add them explicitly to your manifest:

android.permission.INTERNET Used by the API to download map tiles from Google Maps servers.

android.permission.ACCESS_NETWORK_STATE Allows the API to check the connection status in order to determine whether data can be downloaded.

See the example directory for a complete sample app.

Parameters of the MapPicker
/// Here add the starting location, this location will appear directly when entering the widget
  /// You can leave it blank and it will use a default location

   LatLng? startLocation;


  /// Here, type the text that appears below before choosing a location, you can leave it blank

String? inputText;


  /// Here is the widget that will appear in the submit button
  /// You can leave it blank and it will use the default send icon

  Widget? sendBtnIcon = const Icon(Icons.send);


  ///Here is the text color of the text box, it is black by default
  Color? textInputColor;



  /// Here is the icon that appears next to the text box for the position name, at the bottom
  Widget? inputIcon;



  /// This String is required and mandatory, here  type your API key from Google Cloud
 
  final String apiKey;


  /// Here is the text that will appear in the search box at the top
  /// default phrase (Search For A Place)

   String? searchBoxHintText;


  /// Here is the language of the map and the name of the places, just type the language code
  /// For example: for Arabic (ar) for English (en)
  /// You can leave it blank and it will be in English by default
  String? mapLanguage;


  ///Here is type of the map, if it is normal, satellite, etc
  MapType? mapType;


  /// Here comes the data after selecting the location, including the name of the place and its LatLng
  final void Function(PinData pinData) onPin;

Real Example:

Video Example

👨🏻‍💻 Follow me :

Twitter

Instagram

LinkedIn

Stack Overflow

카테고리

의존성

의존성 목록 5 개

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.