mirror of
https://github.com/Iconica-Development/flutter_google_track_and_trace.git
synced 2025-05-18 20:53:46 +02:00
add instructions
This commit is contained in:
parent
7e789a2789
commit
b630b54519
2 changed files with 142 additions and 26 deletions
152
README.md
152
README.md
|
@ -11,29 +11,153 @@ and the Flutter guide for
|
|||
[developing packages and plugins](https://flutter.dev/developing-packages).
|
||||
-->
|
||||
|
||||
TODO: Put a short description of the package here that helps potential users
|
||||
know whether this package might be useful for them.
|
||||
# Track and Trace with Google Maps For Flutter
|
||||
|
||||
A Flutter packages that provides a wrapper around a [Google Maps](https://developers.google.com/maps/) widget.
|
||||
|
||||
|
||||
## Features
|
||||
|
||||
TODO: List what your package can do. Maybe include images, gifs, or videos.
|
||||
* Show a Google Map with 2 markers on it
|
||||
* Calculate a Route between the two markers
|
||||
* Update the route and route information with a set time interval
|
||||
* Retrieve the travel distance and time
|
||||
* Use custom styling for the map, markers and line
|
||||
* Automatically center the view between the two markers
|
||||
* Make all Google Maps settings available through the GoogleTrackTraceMap
|
||||
|
||||
|
||||
## Getting started
|
||||
|
||||
TODO: List prerequisites and provide or point to information on how to
|
||||
start using the package.
|
||||
Because this package uses Google Maps for the Map and the route calculation you need to follow the Flutter Google Maps guide:
|
||||
|
||||
## Usage
|
||||
* Get an API key at <https://cloud.google.com/maps-platform/>.
|
||||
|
||||
TODO: Include short and useful examples for package users. Add longer examples
|
||||
to `/example` folder.
|
||||
* Enable Google Map SDK for each platform.
|
||||
* Go to [Google Developers Console](https://console.cloud.google.com/).
|
||||
* Choose the project that you want to enable Google Maps on.
|
||||
* Select the navigation menu and then select "Google Maps".
|
||||
* Select "APIs" under the Google Maps menu.
|
||||
* To enable Google Maps for Android, select "Maps SDK for Android" in the "Additional APIs" section, then select "ENABLE".
|
||||
* To enable Google Maps for iOS, select "Maps SDK for iOS" in the "Additional APIs" section, then select "ENABLE".
|
||||
* Make sure the APIs you enabled are under the "Enabled APIs" section.
|
||||
|
||||
```dart
|
||||
const like = 'sample';
|
||||
For more details, see [Getting started with Google Maps Platform](https://developers.google.com/maps/gmp-get-started).
|
||||
|
||||
### Android
|
||||
|
||||
1. Set the `minSdkVersion` in `android/app/build.gradle`:
|
||||
|
||||
```groovy
|
||||
android {
|
||||
defaultConfig {
|
||||
minSdkVersion 20
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## Additional information
|
||||
This means that app will only be available for users that run Android SDK 20 or higher.
|
||||
|
||||
TODO: Tell users more about the package: where to find more information, how to
|
||||
contribute to the package, how to file issues, what response they can expect
|
||||
from the package authors, and more.
|
||||
2. Specify your API key in the application manifest `android/app/src/main/AndroidManifest.xml`:
|
||||
|
||||
```xml
|
||||
<manifest ...
|
||||
<application ...
|
||||
<meta-data android:name="com.google.android.geo.API_KEY"
|
||||
android:value="YOUR KEY HERE"/>
|
||||
```
|
||||
|
||||
### iOS
|
||||
|
||||
This plugin requires iOS 9.0 or higher. To set up, specify your API key in the application delegate `ios/Runner/AppDelegate.m`:
|
||||
|
||||
```objectivec
|
||||
#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`:
|
||||
|
||||
```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)
|
||||
}
|
||||
}
|
||||
```
|
||||
## Usage
|
||||
|
||||
|
||||
```dart
|
||||
class TrackTraceDemo extends StatefulWidget {
|
||||
const TrackTraceDemo({Key? key}) : super(key: key);
|
||||
|
||||
@override
|
||||
State<TrackTraceDemo> createState() => _TrackTraceDemoState();
|
||||
}
|
||||
|
||||
class _TrackTraceDemoState extends State<TrackTraceDemo> {
|
||||
TrackTraceController? controller;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: (controller == null || controller!.route == null)
|
||||
? const Text('TrackTrace example')
|
||||
: Text(controller!.route!.duration.toString() +
|
||||
' seconds, distance: ' +
|
||||
(controller!.route!.distance / 1000).toString() +
|
||||
' km')),
|
||||
body: GoogleTrackTraceMap(
|
||||
startPosition: const Marker(
|
||||
markerId: MarkerId('Start location'),
|
||||
position: LatLng(52.356057, 4.897540),
|
||||
),
|
||||
destinationPosition: const Marker(
|
||||
markerId: MarkerId('Destination location'),
|
||||
position: LatLng(52.364709, 4.877157)),
|
||||
googleAPIKey: '', // put your own API key here
|
||||
travelMode: TravelMode.bicycling,
|
||||
routeUpdateInterval: 60,
|
||||
timerPrecision: TimePrecision.everySecond,
|
||||
zoomGesturesEnabled: true,
|
||||
line: const Polyline(
|
||||
polylineId: PolylineId('test route'),
|
||||
color: Colors.purple,
|
||||
width: 7,
|
||||
),
|
||||
onMapCreated: (ctr) => {
|
||||
controller = ctr,
|
||||
ctr.addListener(() {
|
||||
setState(() {});
|
||||
}),
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
See the `example` directory for a complete sample app.
|
|
@ -1,16 +1,8 @@
|
|||
# tracktrace_example
|
||||
# google_track_trace
|
||||
|
||||
A new Flutter project.
|
||||
Demonstrates how to use the google_track_trace package with an Amsterdam example.
|
||||
|
||||
## Getting Started
|
||||
|
||||
This project is a starting point for a Flutter application.
|
||||
|
||||
A few resources to get you started if this is your first Flutter project:
|
||||
|
||||
- [Lab: Write your first Flutter app](https://flutter.dev/docs/get-started/codelab)
|
||||
- [Cookbook: Useful Flutter samples](https://flutter.dev/docs/cookbook)
|
||||
|
||||
For help getting started with Flutter, view our
|
||||
[online documentation](https://flutter.dev/docs), which offers tutorials,
|
||||
samples, guidance on mobile development, and a full API reference.
|
||||
For help getting started with Flutter, view our online
|
||||
[documentation](https://flutter.dev/).
|
||||
|
|
Loading…
Reference in a new issue