我正在使用 Flutter 制作一个简单的位置跟踪应用程序。我的目标是学习定位系统。
首先,
main.dart
:
import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart';
import 'package:get/get.dart';
import 'package:phone_charge_map/firebase_options.dart';
import 'package:phone_charge_map/src/screens/main_screen.dart';
import 'package:provider/provider.dart';
import 'package:phone_charge_map/src/providers/main_provider.dart';
import 'package:firebase_core/firebase_core.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
initFirebase();
runApp(
ChangeNotifierProvider(
create: (context) => MainProvider(),
child: const MyApp(),
),
);
}
initFirebase() async {
await Firebase.initializeApp(
options: DefaultFirebaseOptions.currentPlatform,
);
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
late MainProvider mainProvider;
@override
void initState() {
super.initState();
_getUserLocation();
}
Future<void> _getUserLocation() async {
Position position = await Geolocator.getCurrentPosition(
desiredAccuracy: LocationAccuracy.medium,
);
mainProvider = Provider.of<MainProvider>(context, listen: false);
mainProvider.updateUserLocation(position);
}
@override
Widget build(BuildContext context) {
return const GetMaterialApp(
debugShowCheckedModeBanner: false,
title: "PChargerMap",
home: MainScreen(),
);
}
}
main_screen.dart
:
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:latlong2/latlong.dart';
import 'package:phone_charge_map/src/providers/main_provider.dart';
import 'package:provider/provider.dart';
import 'package:geolocator/geolocator.dart';
class MainScreen extends StatefulWidget {
const MainScreen({Key? key}) : super(key: key);
@override
State<MainScreen> createState() => _MainScreenState();
}
class _MainScreenState extends State<MainScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Consumer<MainProvider>(
builder: (context, provider, child) {
return FlutterMap(
options: MapOptions(
center: LatLng(
provider.userLocation.latitude,
provider.userLocation.longitude,
),
zoom: 3.2,
maxZoom: 18.0,
),
children: [
TileLayer(
urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
userAgentPackageName: 'speedev.phone_charge_map',
),
],
);
},
),
);
}
}
main_provider.dart
:
import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart';
class MainProvider extends ChangeNotifier {
late Position _userLocation;
Position get userLocation => _userLocation;
void updateUserLocation(Position newPosition) {
_userLocation = newPosition;
print(_userLocation);
notifyListeners();
}
}
我的目标是在用户打开应用程序后立即获取位置信息。然后重定向到
MainScreen
并显示其位置。这正是我的目标。但是,我在 LateError (LateInitializationError: Field '_userLocation@227004938' has not been initialized.)
中收到 main_provider.dart
错误。
据我了解,我收到这样的错误是因为我在没有获取位置信息的情况下进行了重定向。我无法解决这个问题。你能帮助我吗?我已经很感激了。
您可以在未来的提供程序中实现负责确定位置的代码。 Future Provider 返回正在加载、错误或数据状态。这可能看起来像这样:
final userLocationProvider = FutureProvider<Position>((ref) async {
Position position = await Geolocator.getCurrentPosition(
desiredAccuracy: LocationAccuracy.medium,
);
return position;
});
如果还没有可用数据,则在小部件中执行加载状态。在这里您可以显示加载动画。当状态加载时,数据部分会自动显示。如果有错误,会显示错误部分。
//read the Provider
Consumer(
final userLocationAsyncValue = watch(userLocationProvider);
return userLocationAsyncValue.when(
data: (position) {
// Here you can visualize your Data (stored in position)
return Text('Current position: ${position.latitude}, ${position.longitude}');
},
loading: () => CircularProgressIndicator(), //here you can show your Loadingscreen
error: (error, stackTrace) => Text('$error'), //here you can show your error message
);
},
)