Initial commit
This commit is contained in:
88
lib/widget/osm_map/map_controller.dart
Normal file
88
lib/widget/osm_map/map_controller.dart
Normal file
@@ -0,0 +1,88 @@
|
||||
import 'dart:convert';
|
||||
import 'package:driver/widget/osm_map/place_model.dart';
|
||||
import 'package:flutter_map/flutter_map.dart';
|
||||
import 'package:geolocator/geolocator.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:http/http.dart' as http;
|
||||
import '../../utils/utils.dart';
|
||||
import 'package:latlong2/latlong.dart';
|
||||
|
||||
class OSMMapController extends GetxController {
|
||||
final mapController = MapController();
|
||||
// Store only one picked place instead of multiple
|
||||
var pickedPlace = Rxn<PlaceModel>(); // Use Rxn to hold a nullable value
|
||||
var searchResults = [].obs;
|
||||
|
||||
Future<void> searchPlace(String query) async {
|
||||
if (query.length < 3) {
|
||||
searchResults.clear();
|
||||
return;
|
||||
}
|
||||
|
||||
final url = Uri.parse(
|
||||
'https://nominatim.openstreetmap.org/search?q=$query&format=json&addressdetails=1&limit=10');
|
||||
|
||||
final response = await http.get(url, headers: {
|
||||
'User-Agent': 'FlutterMapApp/1.0 (menil.siddhiinfosoft@gmail.com)',
|
||||
});
|
||||
|
||||
if (response.statusCode == 200) {
|
||||
final data = json.decode(response.body);
|
||||
searchResults.value = data;
|
||||
}
|
||||
}
|
||||
|
||||
void selectSearchResult(Map<String, dynamic> place) {
|
||||
final lat = double.parse(place['lat']);
|
||||
final lon = double.parse(place['lon']);
|
||||
final address = place['display_name'];
|
||||
|
||||
// Store only the selected place
|
||||
pickedPlace.value = PlaceModel(
|
||||
coordinates: LatLng(lat, lon),
|
||||
address: address,
|
||||
);
|
||||
searchResults.clear();
|
||||
}
|
||||
|
||||
void addLatLngOnly(LatLng coords) async {
|
||||
final address = await _getAddressFromLatLng(coords);
|
||||
pickedPlace.value = PlaceModel(coordinates: coords, address: address);
|
||||
}
|
||||
|
||||
Future<String> _getAddressFromLatLng(LatLng coords) async {
|
||||
final url = Uri.parse(
|
||||
'https://nominatim.openstreetmap.org/reverse?lat=${coords.latitude}&lon=${coords.longitude}&format=json');
|
||||
|
||||
final response = await http.get(url, headers: {
|
||||
'User-Agent': 'FlutterMapApp/1.0 (menil.siddhiinfosoft@gmail.com)',
|
||||
});
|
||||
|
||||
if (response.statusCode == 200) {
|
||||
final data = json.decode(response.body);
|
||||
return data['display_name'] ?? 'Unknown location';
|
||||
} else {
|
||||
return 'Unknown location';
|
||||
}
|
||||
}
|
||||
|
||||
void clearAll() {
|
||||
pickedPlace.value = null; // Clear the selected place
|
||||
}
|
||||
|
||||
@override
|
||||
void onInit() {
|
||||
// TODO: implement onInit
|
||||
super.onInit();
|
||||
getCurrentLocation();
|
||||
}
|
||||
|
||||
Future<void> getCurrentLocation() async {
|
||||
Position? location = await Utils.getCurrentLocation();
|
||||
LatLng latlng =
|
||||
LatLng(location?.latitude ?? 0.0, location?.longitude ?? 0.0);
|
||||
addLatLngOnly(
|
||||
LatLng(location?.latitude ?? 0.0, location?.longitude ?? 0.0));
|
||||
mapController.move(latlng, mapController.camera.zoom);
|
||||
}
|
||||
}
|
||||
159
lib/widget/osm_map/map_picker_page.dart
Normal file
159
lib/widget/osm_map/map_picker_page.dart
Normal file
@@ -0,0 +1,159 @@
|
||||
|
||||
import 'package:driver/themes/app_them_data.dart';
|
||||
import 'package:driver/themes/round_button_fill.dart';
|
||||
import 'package:driver/themes/theme_controller.dart';
|
||||
import 'package:driver/widget/osm_map/map_controller.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_map/flutter_map.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:latlong2/latlong.dart';
|
||||
|
||||
class MapPickerPage extends StatelessWidget {
|
||||
final OSMMapController controller = Get.put(OSMMapController());
|
||||
final TextEditingController searchController = TextEditingController();
|
||||
|
||||
MapPickerPage({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final themeController = Get.find<ThemeController>();
|
||||
final isDark = themeController.isDark.value;
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
backgroundColor: isDark ? AppThemeData.surfaceDark : AppThemeData.surface,
|
||||
centerTitle: false,
|
||||
titleSpacing: 0,
|
||||
title: Text(
|
||||
"PickUp Location".tr,
|
||||
textAlign: TextAlign.start,
|
||||
style: TextStyle(fontFamily: AppThemeData.medium, fontSize: 16, color: isDark ? AppThemeData.grey50 : AppThemeData.grey900),
|
||||
),
|
||||
),
|
||||
body: Stack(
|
||||
children: [
|
||||
Obx(
|
||||
() => FlutterMap(
|
||||
mapController: controller.mapController,
|
||||
options: MapOptions(
|
||||
initialCenter: controller.pickedPlace.value?.coordinates ?? LatLng(20.5937, 78.9629), // Default India center
|
||||
initialZoom: 13,
|
||||
onTap: (tapPos, latlng) {
|
||||
controller.addLatLngOnly(latlng);
|
||||
controller.mapController.move(latlng, controller.mapController.camera.zoom);
|
||||
},
|
||||
),
|
||||
children: [
|
||||
TileLayer(urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', subdomains: const ['a', 'b', 'c'], userAgentPackageName: 'com.emart.app'),
|
||||
MarkerLayer(
|
||||
markers:
|
||||
controller.pickedPlace.value != null
|
||||
? [Marker(point: controller.pickedPlace.value!.coordinates, width: 40, height: 40, child: const Icon(Icons.location_pin, size: 36, color: Colors.red))]
|
||||
: [],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
top: 16,
|
||||
left: 16,
|
||||
right: 16,
|
||||
child: Column(
|
||||
children: [
|
||||
Material(
|
||||
elevation: 4,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
child: TextField(
|
||||
controller: searchController,
|
||||
style: TextStyle(color: isDark ? AppThemeData.grey900 : AppThemeData.grey900),
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search location...'.tr,
|
||||
hintStyle: TextStyle(color: isDark ? AppThemeData.grey900 : AppThemeData.grey900),
|
||||
contentPadding: EdgeInsets.all(12),
|
||||
border: InputBorder.none,
|
||||
prefixIcon: Icon(Icons.search),
|
||||
),
|
||||
onChanged: controller.searchPlace,
|
||||
),
|
||||
),
|
||||
Obx(() {
|
||||
if (controller.searchResults.isEmpty) {
|
||||
return const SizedBox.shrink();
|
||||
}
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(top: 4),
|
||||
decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(8)),
|
||||
child: ListView.builder(
|
||||
shrinkWrap: true,
|
||||
itemCount: controller.searchResults.length,
|
||||
itemBuilder: (context, index) {
|
||||
final place = controller.searchResults[index];
|
||||
return ListTile(
|
||||
title: Text(place['display_name']),
|
||||
onTap: () {
|
||||
controller.selectSearchResult(place);
|
||||
final lat = double.parse(place['lat']);
|
||||
final lon = double.parse(place['lon']);
|
||||
final pos = LatLng(lat, lon);
|
||||
controller.mapController.move(pos, 15);
|
||||
searchController.text = place['display_name'];
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
bottomNavigationBar: Obx(() {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
color: Colors.white,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(
|
||||
controller.pickedPlace.value != null ? "Picked Location:".tr : "No Location Picked".tr,
|
||||
style: TextStyle(color: isDark ? AppThemeData.primary300 : AppThemeData.primary300, fontFamily: AppThemeData.semiBold, fontWeight: FontWeight.w600),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
if (controller.pickedPlace.value != null)
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 2.0),
|
||||
child: Text(
|
||||
"${controller.pickedPlace.value!.address}\n(${controller.pickedPlace.value!.coordinates.latitude.toStringAsFixed(5)}, ${controller.pickedPlace.value!.coordinates.longitude.toStringAsFixed(5)})",
|
||||
style: const TextStyle(fontSize: 13),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: RoundedButtonFill(
|
||||
title: "Confirm Location".tr,
|
||||
color: AppThemeData.primary300,
|
||||
textColor: AppThemeData.grey50,
|
||||
height: 5,
|
||||
onPress: () async {
|
||||
final selected = controller.pickedPlace.value;
|
||||
if (selected != null) {
|
||||
Get.back(result: selected); // ✅ Return the selected place
|
||||
print("Selected location: $selected");
|
||||
}
|
||||
},
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
IconButton(icon: const Icon(Icons.delete_forever, color: Colors.red), onPressed: controller.clearAll),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}),
|
||||
);
|
||||
}
|
||||
}
|
||||
31
lib/widget/osm_map/place_model.dart
Normal file
31
lib/widget/osm_map/place_model.dart
Normal file
@@ -0,0 +1,31 @@
|
||||
import 'package:latlong2/latlong.dart';
|
||||
|
||||
class PlaceModel {
|
||||
final LatLng coordinates;
|
||||
final String address;
|
||||
|
||||
PlaceModel({
|
||||
required this.coordinates,
|
||||
required this.address,
|
||||
});
|
||||
|
||||
factory PlaceModel.fromJson(Map<String, dynamic> json) {
|
||||
return PlaceModel(
|
||||
coordinates: LatLng(json['lat'], json['lng']),
|
||||
address: json['address'],
|
||||
);
|
||||
}
|
||||
|
||||
Map<String, dynamic> toJson() {
|
||||
return {
|
||||
'lat': coordinates.latitude,
|
||||
'lng': coordinates.longitude,
|
||||
'address': address,
|
||||
};
|
||||
}
|
||||
|
||||
@override
|
||||
String toString() {
|
||||
return 'Place(lat: ${coordinates.latitude}, lng: ${coordinates.longitude}, address: $address)';
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user