فلاتر

آموزش کار با GPS و دریافت لوکیشن موقعیت کاربر در فلاتر

یکی از مواردی که در طراحی اپلیکیشن ممکن است به آن نیاز داشته باشیم دریافت موقعیت مکانی کاربر به وسیله GPS می باشد.

GPS مخفف عبارت Global Positioning System به معنای سامانه موقعیت یاب جهانی است. این سامانه متشکل از 24 ماهواره است که به دور زمین می‌چرخند و سیگنال‌هایی را به زمین ارسال می‌کنند.

دستگاه‌های GPS با دریافت این سیگنال‌ها می‌توانند موقعیت مکانی خود را با دقت بالا تعیین کنند.

GPS در برنامه نویسی موبایل کاربردهای بسیار متنوعی دارد. برخی از این کاربردها عبارتند از:

  • ردیابی موقعیت مکانی: با استفاده از GPS می‌توان موقعیت مکانی کاربر را به صورت زنده ردیابی کرد. این قابلیت در برنامه‌های مختلفی مانند مسیریاب‌ها، نرم افزارهای ورزشی و برنامه‌های امنیتی کاربرد دارد.
  • نمایش نقشه: با استفاده از GPS می‌توان نقشه‌های دقیق و به روز را در برنامه‌های مختلف نمایش داد.
  • محاسبه مسافت و زمان: با استفاده از GPS می‌توان مسافت و زمان تقریبی سفر بین دو نقطه را محاسبه کرد.
  • ایجاد هشدارهای مبتنی بر مکان: با استفاده از GPS می‌توان هشدارهایی را برای کاربر ایجاد کرد که در زمان ورود یا خروج از یک منطقه خاص به صدا در می‌آیند.
  • واقعیت افزوده: با استفاده از GPS می‌توان عناصر مجازی را در دنیای واقعی به نمایش درآورد.

برای استفاده از GPS در برنامه نویسی موبایل، باید از APIهای مربوطه در هر پلتفرم استفاده کنید.

  • Android: در اندروید، API موقعیت یاب (Location API) برای دسترسی به اطلاعات GPS استفاده می‌شود.
  • iOS: در iOS، چارچوب Core Location برای دسترسی به اطلاعات GPS استفاده می‌شود.

در این مطلب نحوه دریافت موقعیت با استفاده از پلاگین Geolocator را در فلاتر بررسی میکنیم.

به همین منظور وارد فایل pubspec.yaml شوید و پکیج مورد نظر را به برنامه اضافه کنید.

dependencies: 
flutter: sdk:
 flutter geolocator: ^5.1.3

برای استفاده از GPS نیاز داریم تا سطح دسترسی آن را به هردو پلتفرم اندروید و iOS اضافه کنیم

iOS Permissions

ابتدا وارد مسیر ios/Runner/Info.plist شوید و جفت مقدار های key/value را به آن اضافه کنید.

<key>NSLocationWhenInUseUsageDescription</key>
<string>This app needs access to location when open.</string>

<key>NSLocationAlwaysUsageDescription</key>
<string>This app needs access to location when in the background.</string>

<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
<string>This app needs access to location when open and in the background.</string>

اگر نمیخواهید برنامه خود را روی iOS نسخه 10 و کمتر اجرا کنید و یا زمانی که اپلیکیشن در حال استفاده نیست لوکیشن را دریافت کنید میتونید از دو عبارت زیر صرف نظر کنید.

NSLocationAlwaysUsageDescription 
NSLocationAlwaysAndWhenInUseUsageDescription

Android Permissions

برای اضافه کردن سطح دسترسی ها به اندروید وارد فایل AndroidManifest.xml شوید و دسترسی های زیر را در آن قبل از تگ application اضافه کنید.

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

در ادامه فایل main.dart را به شکل زیر ویرایش میکنیم تا صفحه home ایی که ساختیم نمایش داده شود.

import 'package:flutter/material.dart';

import 'home_page.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomePage(),
    );
  }
}

ویجت HomePage ما به شکل زیر هست.

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Location"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            FlatButton(
              child: Text("Get location"),
              onPressed: () {
                // Get location here
              },
            ),
          ],
        ),
      ),
    );
  }
}

دریافت موقعیت کنونی کاربر

تا به اینجا موارد پایه ای را در اپلیکیشن خودمون طراحی کردیم حالا قصد داریم ویجت HomePage را ویرایش کنیم تا موقعیت کاربر را بتوانیم دریافت کنیم.

میتونیم این کار با ساختن یک نمونه از Geolocator و صدا زدن متد getCurrentPosition انجام دهیم.

این متد به کاربر درخواستی ارسال میکند مبتنی بر این که آیا مایل است که اپلیکیشن به موقعیت مکانی آن دسترسی پیدا کند یا خیر.

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

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  Position _currentPosition;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Location"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            if (_currentPosition != null)
              Text(
                  "LAT: ${_currentPosition.latitude}, LNG: ${_currentPosition.longitude}"),
            FlatButton(
              child: Text("Get location"),
              onPressed: () {
                _getCurrentLocation();
              },
            ),
          ],
        ),
      ),
    );
  }

  _getCurrentLocation() {
    final Geolocator geolocator = Geolocator()..forceAndroidLocationManager;

    geolocator
        .getCurrentPosition(desiredAccuracy: LocationAccuracy.best)
        .then((Position position) {
      setState(() {
        _currentPosition = position;
      });
    }).catchError((e) {
      print(e);
    });
  }
}

آموزش تست نوشتن TDD

اگر همه چیز مرتب باشد باید بتونید این مقادیر latitude و longitude را بروی صفحه اپلیکیشن ببینید.

تبدیل موقعیت به آدرس

با استفاده موقعیت مکانی و طول و عرض جغرافیایی که بدست آوردیم میتونیم بصورت تقریبی آدرس کاربر را نیز بدست آوریم.

برای این کار از متد _getAddressFromLatLng() استفاده میکنیم.

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

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final Geolocator geolocator = Geolocator()..forceAndroidLocationManager;

  Position _currentPosition;
  String _currentAddress;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Location"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            if (_currentPosition != null) Text(_currentAddress),
            FlatButton(
              child: Text("Get location"),
              onPressed: () {
                _getCurrentLocation();
              },
            ),
          ],
        ),
      ),
    );
  }

  _getCurrentLocation() {
    geolocator
        .getCurrentPosition(desiredAccuracy: LocationAccuracy.best)
        .then((Position position) {
      setState(() {
        _currentPosition = position;
      });

      _getAddressFromLatLng();
    }).catchError((e) {
      print(e);
    });
  }

  _getAddressFromLatLng() async {
    try {
      List<Placemark> p = await geolocator.placemarkFromCoordinates(
          _currentPosition.latitude, _currentPosition.longitude);

      Placemark place = p[0];

      setState(() {
        _currentAddress =
            "${place.locality}, ${place.postalCode}, ${place.country}";
      });
    } catch (e) {
      print(e);
    }
  }
}

نتیجه کار شما باید بصورت زیر باشد.

Hesam

Recent Posts

آموزش افزایش سرعت اجرای وب اپلیکیشن های فلاتر

اگر یک برنامه نویس فلاتر هستید و با از نسخه وب اپلیکیشن پروژتون استفاده میکنید…

3 هفته ago

آموزش جامع انتشار اپلیکیشن اندروید و فلاتر در فروشگاه گوگل پلی Google play

به عنوان یک برنامه نویس فلاتر یا اندروید بعد از اتمام پروسه طراحی اپلیکیشن نیاز…

2 ماه ago

دانلود سورس کد رابط کاربری اپلیکیشن فلاتر پروژه پادکست

طراحی رابط کاربری اپلیکیشن پادکست خود را با استفاده از این کیت توسعه UI/UX فلاتر…

2 ماه ago

فایربیس چیست؟ معرفی سرویس ابری Firebase و کاربردهای آن

فایربیس، پلتفرمی قدرتمند از شرکت گوگل برای توسعه و مدیریت برنامه‌های موبایل و وب است.…

2 ماه ago

آموزش پیاده سازی Method Channel در فلاتر + فیلم

فلاتر یک فریم ورک برنامه نویسی چندسکویی است که این امکان را برای برنامه نویس…

3 ماه ago

بهترین منابع برای آموزش رایگان برنامه نویسی فلاتر در سال 2024

فلاتر یک فریم ورک برنامه نویسی چندسکویی است که به وسیله آن میتوانید برای سیستم…

3 ماه ago