Files
rog_app/lib/widgets/map_widget.dart

296 lines
11 KiB
Dart

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_location_marker/flutter_map_location_marker.dart';
import 'package:flutter_map_marker_cluster/flutter_map_marker_cluster.dart';
import 'package:flutter_polyline_points/flutter_polyline_points.dart';
import 'package:geojson_vi/geojson_vi.dart';
import 'package:get/get.dart';
import 'package:latlong2/latlong.dart';
import 'package:rogapp/model/destination.dart';
import 'package:rogapp/pages/destination/destination_controller.dart';
import 'package:rogapp/pages/index/index_controller.dart';
import 'package:rogapp/utils/database_helper.dart';
import 'package:rogapp/utils/text_util.dart';
import 'package:rogapp/widgets/base_layer_widget.dart';
import 'package:rogapp/widgets/bottom_sheet_new.dart';
import 'package:rogapp/widgets/game_state_view.dart';
class MapWidget extends StatefulWidget {
MapWidget({Key? key}) : super(key: key);
@override
State<MapWidget> createState() => _MapWidgetState();
}
class _MapWidgetState extends State<MapWidget> {
final IndexController indexController = Get.find<IndexController>();
final DestinationController destinationController =
Get.find<DestinationController>();
StreamSubscription? subscription;
Timer? _timer;
Widget getMarkerShape(GeoJSONFeature i, BuildContext context) {
GeoJSONMultiPoint p = i.geometry as GeoJSONMultiPoint;
//print("lat is ${p.geoSerie!.geoPoints[0].latitude} and lon is ${p.geoSerie!.geoPoints[0].longitude}");
//RegExp regex = RegExp(r'([.]*0)(?!.*\d)');
return InkWell(
onTap: () {
GeoJSONFeature? fs = indexController.getFeatureForLatLong(
p.coordinates[0][1], p.coordinates[0][0]);
//print("------- fs $fs------");
if (fs != null) {
indexController.currentFeature.clear();
indexController.currentFeature.add(fs);
//print("----- fs is ${fs.properties!['photos']}");
Destination des = destinationController.festuretoDestination(fs);
DatabaseHelper db = DatabaseHelper.instance;
db.getDestinationByLatLon(des.lat!, des.lon!).then((value) {
showModalBottomSheet(
constraints:
BoxConstraints.loose(Size(Get.width, Get.height * 0.85)),
context: context,
isScrollControlled: true,
isDismissible: true,
builder: ((context) => BottomSheetNew(
destination: des, isAlreadyCheckedIn: value.isNotEmpty))
//builder:((context) => BottomSheetWidget())
).whenComplete(() {
destinationController.skipGps = false;
});
});
}
},
child: Stack(
fit: StackFit.expand,
//mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
height: 32,
width: 32,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.transparent,
border: Border.all(
color: i.properties!['buy_point'] > 0
? Colors.blue
: Colors.red,
width: 3,
style: BorderStyle.solid)),
child: Stack(
alignment: Alignment.center,
children: [
const Icon(
Icons.circle,
size: 6.0,
),
i.properties!['cp'] == -1
? Transform.translate(
offset: Offset(18, 0),
child: Transform.rotate(
alignment: Alignment.centerLeft,
origin: Offset.fromDirection(1, 26),
angle: 270 * pi / 180,
child: const Icon(
Icons.play_arrow_outlined,
color: Colors.red,
size: 70,
)),
)
: Container(
color: Colors.transparent,
),
],
)),
Transform.translate(
offset: Offset(45, 0),
child: Align(
alignment: Alignment.center,
child: Container(
color: Colors.purple.withOpacity(0.2),
// child: Text(TextUtils.getDisplayTextFeture(i),
// style: const TextStyle(
// fontSize: 16,
// fontWeight: FontWeight.bold,
// color: Colors.red,
// ))),
child: Stack(
children: <Widget>[
// Text with white outline
Text(
TextUtils.getDisplayTextFeture(i),
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
foreground: Paint()
..style = PaintingStyle.stroke
..strokeWidth = 1
..color = Colors.white,
),
),
// Text with black fill
Text(
TextUtils.getDisplayTextFeture(i),
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w700,
color: Colors.black,
),
),
],
)),
),
)
],
),
);
}
List<LatLng>? getPoints() {
//print("##### --- route point ${indexController.routePoints.length}");
List<LatLng> pts = [];
for (PointLatLng p in indexController.routePoints) {
LatLng l = LatLng(p.latitude, p.longitude);
pts.add(l);
}
return pts;
}
@override
void initState() {
super.initState();
_startIdleTimer();
}
void _startIdleTimer() {
_timer = Timer(const Duration(milliseconds: (1000 * 10)), _centerMapOnUser);
}
void _resetTimer() {
_timer?.cancel();
_startIdleTimer();
}
void _centerMapOnUser() {
indexController.mapController.move(
LatLng(
destinationController.currentLat, destinationController.currentLon),
17.0);
}
@override
Widget build(BuildContext context) {
// print(
// "---------- rog mode is ${indexController.rog_mode.value.toString()}----------");
final PopupController popupController = PopupController();
return Stack(
children: [
Obx(() => indexController.isLoading.value == true
? const Padding(
padding: EdgeInsets.only(top: 60.0),
child: CircularProgressIndicator(),
)
: FlutterMap(
mapController: indexController.mapController,
options: MapOptions(
maxZoom: 18.4,
onMapReady: () {
subscription = indexController.mapController.mapEventStream
.listen((MapEvent mapEvent) {
if (mapEvent is MapEventMoveStart) {
// print(DateTime.now().toString() +
// ' [MapEventMoveStart] START');
// do something
}
if (mapEvent is MapEventMoveEnd) {}
});
},
//center: LatLng(37.15319600454702, 139.58765950528198),
bounds: indexController.currentBound.isNotEmpty
? indexController.currentBound[0]
: LatLngBounds.fromPoints([
LatLng(35.03999881162295, 136.40587119778962),
LatLng(36.642756778706904, 137.95226720406063)
]),
zoom: 1,
interactiveFlags:
InteractiveFlag.pinchZoom | InteractiveFlag.drag,
onPositionChanged: (MapPosition pos, hasGesture) {
//print("map position changed ${pos.center!.latitude}");
if (hasGesture) {
_resetTimer();
}
indexController.currentBound = [pos.bounds!];
},
onTap: (_, __) => popupController
.hideAllPopups(), // Hide popup when the map is tapped.
),
children: [
const BaseLayer(),
Obx(
() => indexController.routePointLenght > 0
? PolylineLayer(
polylines: [
Polyline(
points: getPoints()!,
strokeWidth: 6.0,
color: Colors.indigo),
],
)
: Container(),
),
CurrentLocationLayer(
followOnLocationUpdate: FollowOnLocationUpdate.never,
turnOnHeadingUpdate: TurnOnHeadingUpdate.never,
style: const LocationMarkerStyle(
marker: DefaultLocationMarker(
child: Icon(
Icons.navigation,
color: Colors.yellowAccent,
),
),
markerSize: Size(27, 27),
markerDirection: MarkerDirection.heading,
),
),
indexController.locations.isNotEmpty &&
indexController.locations[0].features.isNotEmpty
? MarkerLayer(
markers:
indexController.locations[0].features.map((i) {
//print("i si ${i.properties!['location_id']}");
RegExp regex = RegExp(r'([.]*0)(?!.*\d)');
GeoJSONMultiPoint p =
i!.geometry as GeoJSONMultiPoint;
//print(
// "lat is ${p.geoSerie!.geoPoints[0].latitude} and lon is ${p.geoSerie!.geoPoints[0].longitude}");
return Marker(
alignment: Alignment.center,
height: 27.0,
width: 127.0,
point: LatLng(
p.coordinates[0][1], p.coordinates[0][0]),
child: getMarkerShape(i, context));
}).toList(),
)
: const Center(child: CircularProgressIndicator()),
],
)),
const Positioned(top: 0, left: 0, child: GameStateWidget()),
// const Positioned(
// bottom: 10,
// left: 0,
// child: DebugWidget(),
// )
],
);
}
}