434 lines
16 KiB
Dart
434 lines
16 KiB
Dart
|
|
import 'dart:async';
|
|
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_map/plugin_api.dart';
|
|
import 'package:flutter_map_location_marker/flutter_map_location_marker.dart';
|
|
import 'package:flutter_map_marker_popup/flutter_map_marker_popup.dart';
|
|
import 'package:flutter_map_tile_caching/flutter_map_tile_caching.dart';
|
|
import 'package:flutter_polyline_points/flutter_polyline_points.dart';
|
|
import 'package:geojson/geojson.dart';
|
|
import 'package:geolocator/geolocator.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/services/destination_service.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/bottom_sheet_widget.dart';
|
|
import 'package:rogapp/widgets/bread_crum_widget.dart';
|
|
|
|
|
|
class DestinationMapPage extends StatelessWidget {
|
|
DestinationMapPage({Key? key}) : super(key: key);
|
|
|
|
final IndexController indexController = Get.find<IndexController>();
|
|
|
|
final DestinationController destinationController = Get.find<DestinationController>();
|
|
StreamSubscription? subscription;
|
|
final PopupController _popupLayerController = PopupController();
|
|
|
|
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;
|
|
}
|
|
|
|
List<Marker>? getMarkers() {
|
|
List<Marker> pts = [];
|
|
int index = -1;
|
|
for (int i = 0; i < destinationController.destinations.length; i++) {
|
|
Destination d = destinationController.destinations[i];
|
|
print("^^^^ ${d} ^^^^");
|
|
Marker m = Marker(
|
|
point: LatLng(d.lat!, d.lon!),
|
|
anchorPos: AnchorPos.align(AnchorAlign.center),
|
|
builder:(cts){
|
|
|
|
return InkWell(
|
|
onTap: (){
|
|
print("-- Destination is --- ${d.name} ------");
|
|
if(d != null){
|
|
if(indexController.currentDestinationFeature.length > 0) {
|
|
indexController.currentDestinationFeature.clear();
|
|
}
|
|
indexController.currentDestinationFeature.add(d);
|
|
//indexController.getAction();
|
|
|
|
showModalBottomSheet(context: Get.context!, isScrollControlled: true,
|
|
builder:((context) => BottomSheetNew())
|
|
);
|
|
}
|
|
},
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width:20,
|
|
height:20,
|
|
decoration: BoxDecoration(
|
|
color: Colors.red,
|
|
shape: BoxShape.circle,
|
|
border: new Border.all(
|
|
color: Colors.white,
|
|
width: d.checkin_radious != null ? d.checkin_radious! : 1,
|
|
),
|
|
),
|
|
child: new Center(
|
|
child: new Text(
|
|
(i + 1).toString(),
|
|
style: TextStyle(color: Colors.white),
|
|
),
|
|
),
|
|
),
|
|
Container( color: Colors.yellow, child: Text(TextUtils.getDisplayText(d), style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.bold, overflow: TextOverflow.visible),)),
|
|
],
|
|
),
|
|
);
|
|
|
|
});
|
|
|
|
pts.add(m);
|
|
}
|
|
return pts;
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Obx((() =>
|
|
Stack(
|
|
children: [
|
|
indexController.is_rog_mapcontroller_loaded.value == false ?
|
|
Center(child: CircularProgressIndicator())
|
|
:
|
|
Padding(
|
|
padding: const EdgeInsets.only(left:8.0),
|
|
child: BreadCrumbWidget(mapController:indexController.rogMapController),
|
|
),
|
|
Padding(
|
|
padding: const EdgeInsets.only(top:50.0),
|
|
//child: TravelMap(),
|
|
child:
|
|
TravelMap(),
|
|
),
|
|
],
|
|
)
|
|
));
|
|
}
|
|
|
|
FlutterMap TravelMap() {
|
|
return FlutterMap(
|
|
mapController: indexController.rogMapController,
|
|
options: MapOptions(
|
|
onMapReady: (){
|
|
indexController.is_rog_mapcontroller_loaded.value = true;
|
|
subscription = indexController.rogMapController!.mapEventStream.listen((MapEvent mapEvent) {
|
|
if (mapEvent is MapEventMoveStart) {
|
|
}
|
|
if (mapEvent is MapEventMoveEnd) {
|
|
//destinationController.is_gps_selected.value = true;
|
|
//indexController.mapController!.move(c.center, c.zoom);
|
|
LatLngBounds bounds = indexController.rogMapController!.bounds!;
|
|
indexController.currentBound.clear();
|
|
indexController.currentBound.add(bounds);
|
|
if(indexController.currentUser.length <= 0){
|
|
indexController.loadLocationsBound();
|
|
}
|
|
}
|
|
});
|
|
} ,
|
|
bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
|
|
zoom: 1,
|
|
maxZoom: 42,
|
|
interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
|
|
),
|
|
children: [
|
|
BaseLayer(),
|
|
Obx(() =>
|
|
indexController.routePointLenght > 0 ?
|
|
PolylineLayer(
|
|
polylines: [
|
|
Polyline(
|
|
points: getPoints()!,
|
|
strokeWidth: 6.0,
|
|
color: Colors.indigo
|
|
),
|
|
],
|
|
)
|
|
|
|
:
|
|
Container(),
|
|
),
|
|
CurrentLocationLayer(),
|
|
MarkerLayer(
|
|
markers: getMarkers()!
|
|
),
|
|
],
|
|
|
|
);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
// class DestinationMapPage extends StatefulWidget {
|
|
// DestinationMapPage({ Key? key }) : super(key: key);
|
|
|
|
|
|
// @override
|
|
// State<DestinationMapPage> createState() => _DestinationMapPageState();
|
|
// }
|
|
|
|
//class _DestinationMapPageState extends State<DestinationMapPage> {
|
|
// final IndexController indexController = Get.find<IndexController>();
|
|
|
|
// final DestinationController destinationController = Get.find<DestinationController>();
|
|
// StreamSubscription? subscription;
|
|
// final PopupController _popupLayerController = PopupController();
|
|
|
|
// List<LatLng>? getPoints(List<PointLatLng> ptts){
|
|
// //print("##### --- route point ${indexController.routePoints.length}");
|
|
// List<LatLng> pts = [];
|
|
// for(PointLatLng p in ptts){
|
|
// LatLng l = LatLng(p.latitude, p.longitude);
|
|
// pts.add(l);
|
|
// }
|
|
// return pts;
|
|
// }
|
|
|
|
// String getDisplaytext(Destination dp){
|
|
// String txt = "";
|
|
// if(dp.cp! > 0){
|
|
// txt = "${dp.cp}";
|
|
// if(dp.checkin_point != null && dp.checkin_point! > 0){
|
|
// txt = txt + "{${dp.checkin_point}}";
|
|
// }
|
|
// if(dp.buy_point != null && dp.buy_point! > 0){
|
|
// txt = txt + "[${dp.buy_point}]";
|
|
// }
|
|
// }
|
|
// return txt;
|
|
// }
|
|
|
|
// List<Marker>? getMarkers() {
|
|
// List<Marker> pts = [];
|
|
// int index = -1;
|
|
// for (int i = 0; i < destinationController.destinations.length; i++) {
|
|
// Destination d = destinationController.destinations[i];
|
|
// //for(Destination d in destinationController.destinations){
|
|
// //print("-----lat ${lat}, ----- lon ${lan}");
|
|
// Marker m = Marker(
|
|
// point: LatLng(d.lat!, d.lon!),
|
|
// anchorPos: AnchorPos.align(AnchorAlign.center),
|
|
// builder:(cts){
|
|
|
|
// return InkWell(
|
|
// onTap: (){
|
|
// print("-- Destination is --- ${d.name} ------");
|
|
// if(d != null){
|
|
// if(indexController.currentDestinationFeature.length > 0) {
|
|
// indexController.currentDestinationFeature.clear();
|
|
// }
|
|
// indexController.currentDestinationFeature.add(d);
|
|
// //indexController.getAction();
|
|
|
|
// showModalBottomSheet(context: context, isScrollControlled: true,
|
|
// //builder:((context) => BottomSheetWidget())
|
|
// builder:((context) => BottomSheetNew())
|
|
// );
|
|
// }
|
|
// },
|
|
// child: Row(
|
|
// mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
// children: [
|
|
// Container(
|
|
// width:20,
|
|
// height:20,
|
|
// decoration: BoxDecoration(
|
|
// color: Colors.red,
|
|
// shape: BoxShape.circle,
|
|
// border: new Border.all(
|
|
// color: Colors.white,
|
|
// width: d.checkin_radious != null ? d.checkin_radious! : 1,
|
|
// ),
|
|
// ),
|
|
// child: new Center(
|
|
// child: new Text(
|
|
// (i + 1).toString(),
|
|
// style: TextStyle(color: Colors.white),
|
|
// ),
|
|
// ),
|
|
// ),
|
|
// Container( color: Colors.yellow, child: Text(getDisplaytext(d), style: TextStyle(fontSize: 15.0, fontWeight: FontWeight.bold, overflow: TextOverflow.visible),)),
|
|
// ],
|
|
// ),
|
|
// );
|
|
|
|
// //return Icon(Icons.pin_drop);
|
|
// // return IconButton(
|
|
// // onPressed: ()async {
|
|
// // Destination? fs = await destinationController.getDEstinationForLatLong(d.lat!, d.lon!);
|
|
// // print("-- Destination is --- ${fs!.name} ------");
|
|
// // if(fs != null){
|
|
// // if(indexController.currentDestinationFeature.length > 0) {
|
|
// // indexController.currentDestinationFeature.clear();
|
|
// // }
|
|
// // indexController.currentDestinationFeature.add(fs);
|
|
// // //indexController.getAction();
|
|
|
|
// // showModalBottomSheet(context: context, isScrollControlled: true,
|
|
// // //builder:((context) => BottomSheetWidget())
|
|
// // builder:((context) => BottomSheetNew())
|
|
// // );
|
|
// // }
|
|
// // },
|
|
// // icon: Container(
|
|
// // width: 60,
|
|
// // height: 60,
|
|
// // decoration: BoxDecoration(
|
|
// // borderRadius: BorderRadius.circular(d.checkin_radious ?? 0),
|
|
// // color: Colors.transparent,
|
|
// // border: BoxBorder()
|
|
// // ),
|
|
// // child: Icon(Icons.pin_drop)
|
|
// // )
|
|
// // );
|
|
|
|
// });
|
|
|
|
// pts.add(m);
|
|
// }
|
|
// return pts;
|
|
// }
|
|
|
|
// @override
|
|
// void initState() {
|
|
|
|
// //indexController.routePoints.clear();
|
|
// DestinationService.getDestinationLine(destinationController.destinations)?.then((value){
|
|
// //print("---- loading destination points ------ ${value}");
|
|
// setState(() {
|
|
// indexController.routePoints = value;
|
|
// });
|
|
// });
|
|
// super.initState();
|
|
// }
|
|
|
|
// void reload(){
|
|
// setState(() {
|
|
|
|
// });
|
|
// }
|
|
|
|
// @override
|
|
// Widget build(BuildContext context) {
|
|
// return Obx((() =>
|
|
// Stack(
|
|
// children: [
|
|
// indexController.is_rog_mapcontroller_loaded.value == false ?
|
|
// Center(child: CircularProgressIndicator())
|
|
// :
|
|
// BreadCrumbWidget(mapController:indexController.rogMapController),
|
|
// Padding(
|
|
// padding: const EdgeInsets.only(top:50.0),
|
|
// //child: TravelMap(),
|
|
// child:
|
|
// TravelMap(indexController.routePoints),
|
|
// ),
|
|
// // Positioned(
|
|
// // bottom: 200,
|
|
// // left: 10,
|
|
// // child: Container(
|
|
// // color: Colors.white,
|
|
// // child: Row(
|
|
// // children: [
|
|
// // Text(destinationController.gps[0]),
|
|
// // Text(destinationController.locationPermission[0])
|
|
// // ],
|
|
// // ),
|
|
// // )
|
|
// // ),
|
|
// ],
|
|
// )
|
|
// ));
|
|
// }
|
|
|
|
// FlutterMap TravelMap(List<PointLatLng> ptts) {
|
|
// return FlutterMap(
|
|
// options: MapOptions(
|
|
// onMapCreated: (c){
|
|
// indexController.rogMapController = c;
|
|
// indexController.rogMapController!.onReady.then((_) {
|
|
// indexController.is_rog_mapcontroller_loaded.value = true;
|
|
// subscription = indexController.rogMapController!.mapEventStream.listen((MapEvent mapEvent) {
|
|
// if (mapEvent is MapEventMoveStart) {
|
|
// //print(DateTime.now().toString() + ' [MapEventMoveStart] START');
|
|
// // do something
|
|
// }
|
|
// if (mapEvent is MapEventMoveEnd) {
|
|
// destinationController.isSelected.value = false;
|
|
// //print(DateTime.now().toString() + ' [MapEventMoveStart] END');
|
|
// //indexController.loadLocationsBound();
|
|
// }
|
|
// });
|
|
// });
|
|
// } ,
|
|
// bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
|
|
// zoom: 1,
|
|
// maxZoom: 42,
|
|
// interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
|
|
// //plugins: [LocationMarkerPlugin(),]
|
|
// ),
|
|
// children: [
|
|
// TileLayerWidget(
|
|
// options: TileLayerOptions(
|
|
// urlTemplate: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
|
|
// subdomains: ['a', 'b', 'c'],
|
|
// ),
|
|
// ),
|
|
// //Obx(() =>
|
|
// indexController.routePoints.length > 0 ?
|
|
// PolylineLayerWidget(
|
|
// options: PolylineLayerOptions(
|
|
// polylines: [
|
|
// Polyline(
|
|
// points: getPoints(ptts)!,
|
|
// strokeWidth: 6.0,
|
|
// color: Colors.indigo
|
|
// ),
|
|
// ],
|
|
// ),
|
|
// )
|
|
// :
|
|
// Container(),
|
|
// //),
|
|
// // PopupMarkerLayerWidget(
|
|
// // options: PopupMarkerLayerOptions(
|
|
// // popupController: _popupLayerController,
|
|
// // markers: _markers,
|
|
// // markerRotateAlignment:
|
|
// // PopupMarkerLayerOptions.rotationAlignmentFor(AnchorAlign.top),
|
|
// // popupBuilder: (BuildContext context, Marker marker) =>
|
|
|
|
// // examplePopup(marker),
|
|
// // ),
|
|
// // ),
|
|
// LocationMarkerLayerWidget(),
|
|
// MarkerLayerWidget(
|
|
// options: MarkerLayerOptions(
|
|
// markers: getMarkers()!
|
|
// ),
|
|
// ),
|
|
// ],
|
|
|
|
// );
|
|
// }
|
|
//} |