Map basic instrument

android/app/src/main/AndroidManifest.xml

@@ -1,5 +1,9 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
     package="com.example.mera_aadhar">
+
+    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
+    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
+
    <application
         android:label="mera_aadhar"
         android:name="${applicationName}"

android/mera_aadhar_android.iml

@@ -26,4 +26,4 @@
     <orderEntry type="library" name="Flutter for Android" level="project" />
     <orderEntry type="library" name="KotlinJavaRuntime" level="project" />
   </component>
-</module>
+</module>

ios/Runner/Info.plist

@@ -2,6 +2,8 @@
 <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
 <plist version="1.0">
 <dict>
+	<key>NSLocationWhenInUseUsageDescription</key>
+	<string>This app needs access to location when open.</string>
 	<key>CFBundleDevelopmentRegion</key>
 	<string>$(DEVELOPMENT_LANGUAGE)</string>
 	<key>CFBundleDisplayName</key>

lib/screens/home_page.dart

@@ -2,6 +2,7 @@ import 'package:flutter/src/foundation/key.dart';
 import 'package:flutter/src/widgets/framework.dart';
 import 'package:flutter/material.dart';
 import 'package:mera_aadhar/screens/verification.dart';
+import 'package:mera_aadhar/screens/map_basic.dart';
 
 class HomePage extends StatelessWidget {
   const HomePage({Key? key}) : super(key: key);
@@ -19,6 +20,13 @@ class HomePage extends StatelessWidget {
                   MaterialPageRoute(builder: (context) => Verification()));
             },
           ),
+          TextButton(
+            child: Text("CLICK MAP"),
+            onPressed: () {
+              Navigator.push(context,
+                  MaterialPageRoute(builder: (context) => LiveLocationPage()));
+            },
+          ),
         ],
       ),
     ));

lib/screens/map_basic.dart

@@ -0,0 +1,201 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_map/flutter_map.dart';
+import 'package:latlong2/latlong.dart';
+import 'package:location/location.dart';
+import 'package:flutter_map_marker_popup/flutter_map_marker_popup.dart';
+
+import '../widgets/example_popup.dart';
+
+class LiveLocationPage extends StatefulWidget {
+  static const String route = '/live_location';
+
+  const LiveLocationPage({Key? key}) : super(key: key);
+
+  @override
+  _LiveLocationPageState createState() => _LiveLocationPageState();
+}
+
+class _LiveLocationPageState extends State<LiveLocationPage> {
+  LocationData? _currentLocation;
+  late final MapController _mapController;
+
+  bool _liveUpdate = false;
+  bool _permission = false;
+
+  String? _serviceError = '';
+
+  int interActiveFlags = InteractiveFlag.all;
+
+  final Location _locationService = Location();
+  late final List<Marker> _markers;
+  final PopupController _popupLayerController = PopupController();
+
+  @override
+  void initState() {
+    super.initState();
+    _mapController = MapController();
+    initLocationService();
+  }
+
+  void initLocationService() async {
+    LocationData? location;
+    bool serviceEnabled;
+    bool serviceRequestResult;
+
+    try {
+      serviceEnabled = await _locationService.serviceEnabled();
+
+      if (serviceEnabled) {
+        final permission = await _locationService.requestPermission();
+        _permission = permission == PermissionStatus.granted;
+
+        await _locationService.changeSettings(
+            accuracy: LocationAccuracy.high,
+            interval: 1000,
+        );
+
+        if (_permission) {
+          location = await _locationService.getLocation();
+          _currentLocation = location;
+          _locationService.onLocationChanged
+              .listen((LocationData result) async {
+            if (mounted) {
+              setState(() {
+                _currentLocation = result;
+                _markers = <Marker>[
+                Marker(
+                    width: 35,
+                    height: 35,
+                    point: LatLng(_currentLocation!.latitude!,
+                          _currentLocation!.longitude!),
+                    builder: (ctx) => Image.asset(
+                            'assets/pin.png',
+                    ),
+                    anchorPos: AnchorPos.align(AnchorAlign.top),
+                ),
+                ];
+
+                // If Live Update is enabled, move map center
+                if (_liveUpdate) {
+                  _mapController.move(
+                      LatLng(_currentLocation!.latitude!,
+                          _currentLocation!.longitude!),
+                      _mapController.zoom);
+                }
+              });
+            }
+          });
+        }
+      } else {
+        serviceRequestResult = await _locationService.requestService();
+        if (serviceRequestResult) {
+          initLocationService();
+          return;
+        }
+      }
+    } on PlatformException catch (e) {
+      debugPrint(e.toString());
+      if (e.code == 'PERMISSION_DENIED') {
+        _serviceError = e.message;
+      } else if (e.code == 'SERVICE_STATUS_ERROR') {
+        _serviceError = e.message;
+      }
+      location = null;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    LatLng currentLatLng;
+
+    // Until currentLocation is initially updated, Widget can locate to 0, 0
+    // by default or store previous location value to show.
+    if (_currentLocation != null) {
+      currentLatLng =
+          LatLng(_currentLocation!.latitude!, _currentLocation!.longitude!);
+    } else {
+        return Text("Aww snaps, loading data");
+      currentLatLng = LatLng(0, 0);
+    }
+
+    final markers = _markers;
+
+    return Scaffold(
+      appBar: AppBar(title: const Text('Home')),
+      body: Padding(
+        padding: const EdgeInsets.all(8),
+        child: Column(
+          children: [
+            Padding(
+              padding: const EdgeInsets.only(top: 8, bottom: 8),
+              child: _serviceError!.isEmpty
+                  ? Text('This is a map that is showing '
+                      '(${currentLatLng.latitude}, ${currentLatLng.longitude}).')
+                  : Text(
+                      'Error occured while acquiring location. Error Message : '
+                      '$_serviceError'),
+            ),
+            Flexible(
+              child: FlutterMap(
+                mapController: _mapController,
+                options: MapOptions(
+                  center:
+                      LatLng(currentLatLng.latitude, currentLatLng.longitude),
+                  zoom: 15,
+                  interactiveFlags: interActiveFlags,
+                onTap: (_, __) => _popupLayerController
+                        .hideAllPopups(), // Hide popup when the map is tapped.
+                ),
+                children: [
+                    TileLayerWidget(
+                        options: TileLayerOptions(
+                        urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
+                        subdomains: ['a', 'b', 'c'],
+                        ),
+                    ),
+                    PopupMarkerLayerWidget(
+                        options: PopupMarkerLayerOptions(
+                        popupController: _popupLayerController,
+                        markers: _markers,
+                        markerRotateAlignment:
+                            PopupMarkerLayerOptions.rotationAlignmentFor(AnchorAlign.top),
+                        popupBuilder: (BuildContext context, Marker marker) =>
+                            ExamplePopup(marker),
+                        ),
+                    ),
+                ],
+              ),
+            ),
+
+          ],
+        ),
+      ),
+      floatingActionButton: Builder(builder: (BuildContext context) {
+        return FloatingActionButton(
+          onPressed: () {
+            setState(() {
+              _liveUpdate = !_liveUpdate;
+
+              if (_liveUpdate) {
+                interActiveFlags = InteractiveFlag.rotate |
+                    InteractiveFlag.pinchZoom |
+                    InteractiveFlag.doubleTapZoom;
+
+                ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
+                  content: Text(
+                      'In live update mode only zoom and rotation are enable'),
+                ));
+              } else {
+                interActiveFlags = InteractiveFlag.all;
+              }
+            });
+          },
+          child: _liveUpdate
+              ? const Icon(Icons.location_on)
+              : const Icon(Icons.location_off),
+        );
+      }),
+    );
+  }
+}

lib/widgets/example_popup.dart

@@ -0,0 +1,75 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_map/flutter_map.dart';
+
+class ExamplePopup extends StatefulWidget {
+  final Marker marker;
+
+  const ExamplePopup(this.marker, {Key? key}) : super(key: key);
+
+  @override
+  State<StatefulWidget> createState() => _ExamplePopupState();
+}
+
+class _ExamplePopupState extends State<ExamplePopup> {
+  final List<IconData> _icons = [
+    Icons.star_border,
+    Icons.star_half,
+    Icons.star
+  ];
+  int _currentIcon = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      child: InkWell(
+        onTap: () => setState(() {
+          _currentIcon = (_currentIcon + 1) % _icons.length;
+        }),
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            Padding(
+              padding: const EdgeInsets.only(left: 20, right: 10),
+              child: Icon(_icons[_currentIcon]),
+            ),
+            _cardDescription(context),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _cardDescription(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(10),
+      child: Container(
+        constraints: const BoxConstraints(minWidth: 100, maxWidth: 200),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          mainAxisAlignment: MainAxisAlignment.start,
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            const Text(
+              'Popup for a marker!',
+              overflow: TextOverflow.fade,
+              softWrap: false,
+              style: TextStyle(
+                fontWeight: FontWeight.w500,
+                fontSize: 14.0,
+              ),
+            ),
+            const Padding(padding: EdgeInsets.symmetric(vertical: 4.0)),
+            Text(
+              'Position: ${widget.marker.point.latitude}, ${widget.marker.point.longitude}',
+              style: const TextStyle(fontSize: 12.0),
+            ),
+            Text(
+              'Marker size: ${widget.marker.width}, ${widget.marker.height}',
+              style: const TextStyle(fontSize: 12.0),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}