スポンサーリンク

【Flutter】geolocatorで現在地を取得する方法。

Flutter
スポンサーリンク

今回の記事はFlutter(Android Studio)で「geolocator」というプラグインを用いて現在地を取得する方法について記載していきます。

現在地の取得のみの場合はかなり簡単にできますので初心者の方でもすぐにわかると思います。また今回の記事はAndroidStudioを使用して実機でのデバックにより検証を行なっております。

では早速メインの記事に進んでいきます。

スポンサーリンク

「geolocator」を使用できるように設定

このプラグインを使用するホゥほうに関しては「pubspec.yaml」ファイルに下記を記述して「pub get」をするのみです。

dependencies:
  geolocator: ^5.1.3
  flutter:
    sdk: flutter

特にAndroidManifestとかはいじらなくとも位置情報取得の許可は下りるようでデバックした実機で許可のダイアログに従うのみです。

以上で設定は完了です。実際にFlutterのコードをご紹介していきます。

「geolocator」を使って現在地取得を行うFlutterコード

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(
title: 'Learning Flutter',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Home(),
);
}
}


class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return TabUI();
}
}

class TabUI extends StatelessWidget {

final List<Widget> _tabs = [
Tab(icon: Icon(Icons.location_on)),
];

@override
Widget build(BuildContext context) {
int _length = _tabs.length;
return MaterialApp(
home: DefaultTabController(
length: _length,
child: Scaffold(
appBar: AppBar(
bottom: TabBar(
tabs: _tabs,
),
title: Text('Learn Flutter'),
backgroundColor: Colors.green[200],
),
body: TabBarView(
children: [
LocationSample(),
],
),
),
),
);
}
}



class LocationSample extends StatefulWidget{
@override
_LocationSampleState createState() => _LocationSampleState();
}

class _LocationSampleState extends State<LocationSample> {
// Location
Position position; // Geolocator

@override
void initState() {
super.initState();
_getLocation(context);
}

Future<void> _getLocation(context) async {
Position _currentPosition = await Geolocator()
.getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
print(_currentPosition);
setState(() {
position = _currentPosition;
});
}

@override
Widget build(BuildContext context) {
return FutureBuilder<GeolocationStatus>(
future: Geolocator().checkGeolocationPermissionStatus(),
builder:
(BuildContext context, AsyncSnapshot<GeolocationStatus> snapshot) {
if (!snapshot.hasData) {
return const Center(child: CircularProgressIndicator());
}

if (snapshot.data == GeolocationStatus.denied) {
return Text(
'Access to location denied',
textAlign: TextAlign.center,
);
}

return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Text(
"Location Infomation",
style: TextStyle(
fontSize: 20.0
),
),
Text("Your Current Location is :"),
Text("${position}")
],
),
);
}
);
}
}


「_getLocation」が現在地取得のメインの関数になっております。
そこで取得したものをページ内に表示する簡単なサンプルになっています。

取得できた現在地をどう使うかはお任せです。

今回の記事は以上です。他にもFlutter関連の記事を多数アップしているので気になる方はご参照ください。

本記事を読んでいただき感謝です。サイトを訪れていただいた方はプログラミング勉強中かと思いますのでプログラミング勉強のコツを合わせてご紹介。

スポンサーリンク
スポンサーリンク
スポンサーリンク

ブログに関しては500円程度かかりますが、それ以外は無料です。知識の吸収と並行してアウトプットは非常に効率が良いです。テックアカデミーに関しては講座レベルが高いにも関わらず、無料体験や人気口座も大幅値下げがあるので、重点的に学びたいものを無料体験してみてください。

転職時にも、エンジニアからテックアカデミー・Paizaは認知度が高いので、未経験入社採用を行う際履歴書で目に留まります。特にPaizaのスキルレベルA・SなどはIT業界でも評価されます。

テックアカデミー・Paizaの無料登録ができる期間中にぜひご利用してみてください。私も活用経験ありです。

Flutter
スポンサーリンク
スポンサーリンク
ともぶろぐ

コメント

タイトルとURLをコピーしました