[flutter] FloatingActionButton을 사용하여 위치 기반 서비스 구현하기

이번에는 flutter 앱에서 FloatingActionButton을 사용하여 사용자의 현재 위치를 가져오고 위치 기반 서비스를 구현하는 방법에 대해 알아보겠습니다.

1. Packages 설치

먼저, 위치 서비스를 위해 geolocator 패키지를 설치해야 합니다. pubspec.yaml 파일에 다음과 같이 패키지를 추가합니다.

dependencies:
  geolocator: ^7.6.2

pubspec.yaml 파일에 패키지를 추가한 후에는 터미널에서 flutter pub get 명령어를 실행하여 패키지를 설치합니다.

2. 퍼미션 설정

Android 앱을 개발하고 있는 경우 AndroidManifest.xml 파일에 위치 서비스에 대한 권한을 추가해야 합니다.

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

iOS 앱을 개발하고 있는 경우 Info.plist 파일에 위치 서비스에 대한 권한을 추가해야 합니다.

<key>NSLocationWhenInUseUsageDescription</key>
<string>Your message goes here</string>
<key>NSLocationAlwaysUsageDescription</key>
<string>Your message goes here</string>

3. 현재 위치 가져오기

이제 geolocator 패키지를 사용하여 현재 위치를 가져오는 코드를 작성합니다.

import 'package:geolocator/geolocator.dart';

Position _currentPosition;

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

위 코드는 geolocator 패키지를 사용하여 현재 위치를 가져오는 메서드를 정의한 것입니다.

4. FloatingActionButton 추가하기

마지막으로, 현재 위치를 가져오는 기능을 갖는 FloatingActionButton을 화면에 추가합니다.

FloatingActionButton(
  onPressed: _getCurrentLocation,
  tooltip: 'Get Current Location',
  child: Icon(Icons.my_location),
)

위 코드에서 onPressed 콜백에는 위에서 정의한 _getCurrentLocation 메서드를 설정하고, child에는 위치 아이콘을 표시합니다.

이제 사용자가 앱에서 위의 FloatingActionButton을 누르면, 앱은 사용자의 현재 위치를 가져올 것입니다.

위치 기반 서비스를 구현하는 방법에 대해 간략히 알아보았습니다. 이러한 기능을 사용하여 다양한 위치 기반 기능을 구현할 수 있을 것입니다.

참고 자료