How to Get User Current Location in Flutter

Mobile app market is growing exponentially. Location based services are everywhere. From delivery apps like UberEats to booking platforms like Expedia, Lyft, Facebook, Tinder, Airbnb – all these popular apps are using geolocation features.

According to the Markets and Markets report, the location-based services market will reach $40 billion by 2025.

You might need to know how you can make location-based apps using Flutter. Also, what are the steps to build an awesome geolocation based app in Flutter.

You already know that Flutter is the most popular open source Mobile UI Framework.

Flutter is improving day by day along with its big community. It has bunch of package to make almost anything for IOS and Android app using same code base.

Today, we are going to learn how we can easily implement a location service in our mobile app, which will gives us the user  longitude and latitude using flutter.

Use Geolocation Services in Flutter

In this guide, we will use the most popular location service Flutter package called geolocator. So, after creating a new Flutter project, add Geolocator package in your dependency. Its very easy to do, just open your pubspec.yaml and inside dependencies add bellow line:

geolocator: ^5.1.5

After adding the dependency, Run pub get.

Before going into main task, make sure your compile SDK version is minimum 28 for android. Also in your AndroidManifest.xml, you must add the uses permission to allow the app to access the device location service.

If you dont know how to set permission for Android and IOS, then follow follow bellow steps:

Modify AndroidManifest.xml

Add the following two lines, just above the <application> tag in your AndroidManifest.xml

AndroidManifest.xml can be found inside <flutter-project-root-directory>/android/app/src/main/ folder.

Modify Info.plist

Add the following lines at the bottom of your info.plist to add the permissions.

info.plist can be found inside <flutter-project-root-directory>/ios/Runner/ folder

That’s all for the permission configuration. Now we can go to our Flutter project and write the code to implement geo location in our app.

Add Geolocator in Flutter

Open main.dart file in the editor and let’s create a simple layout that will contain a button and a text.

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

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: LocationApp(),
    );
  }
}

class LocationApp extends StatefulWidget {
  @override
  _LocationAppState createState() => _LocationAppState();
}

class _LocationAppState extends State {
  var _locationMessage = "";
  void _getCurrentLocation() async {
    
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Location service"),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Text("${_locationMessage}"),
          Center(
            child: RaisedButton(
              onPressed: () {
                _getCurrentLocation();
              },
              child: Text("get location"),
            ),
          ),
        ],
      ),
    );
  }
}

In above code, we imported geolocator package, also we created a variable where we will store our location data and a Void function where we will get the data.

Now let’s add the getCurrentLocation function in our project as like as bellow:

void _getCurrentLocation() async {
    final postion = await Geolocator()
        .getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
    final lastPosition = await Geolocator().getLastKnownPosition();
    print("last Position = ${lastPosition}");
    setState(() {
      _locationMessage = "${postion.latitude} , ${postion.longitude}";
    });
  }

And yes, know what? You successfully implemented geo location in your flutter project.

GeoLocator package is very simple to use. Because it has all the function built-in and we don’t need any extra coding.

I hope now you are clear about how to add location service in Flutter using Geolocator. If you want to know more about the geolocator package you may check the official Documentation.

If you still find it a bit confusing about Flutter Geolocator, do reach out to me on Twitter or add your comment in the comment box below.

Happy Fluttering. 😎😎