nouffer/rog_app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

added map cache

Browse Source
This commit is contained in:
Mohamed Nouffer
2023-03-17 11:54:12 +05:30
parent 044e5595c2
commit 05a812428a
15 changed files with 802 additions and 408 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
lib/main.dart
View File

@ -1,14 +1,37 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_map_tile_caching/flutter_map_tile_caching.dart';
import 'package:get/get.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:rogapp/pages/index/index_binding.dart';
import 'package:rogapp/routes/app_pages.dart';
import 'package:rogapp/utils/string_values.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:path/path.dart' as p;
void main() async {
WidgetsFlutterBinding.ensureInitialized();
FlutterMapTileCaching.initialise(await RootDirectory.normalCache);
final StoreDirectory instanceA = FMTC.instance('OpenStreetMap (A)');
await instanceA.manage.createAsync();
await instanceA.metadata.addAsync(
key: 'sourceURL',
value: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
);
await instanceA.metadata.addAsync(
key: 'validDuration',
value: '14',
);
await instanceA.metadata.addAsync(
key: 'behaviour',
value: 'cacheFirst',
);
void main() {
//WidgetsFlutterBinding.ensureInitialized();
runApp(MyApp());
}

2
lib/pages/destination/destination_controller.dart
View File

@ -396,6 +396,8 @@ class DestinationController extends GetxController {
}
if(indexController.locations.isEmpty) return;
//check for location in bounds
for(GeoJsonFeature fs in indexController.locations[0].collection){

30
lib/pages/destination_map/destination_map_page.dart
View File

@ -5,6 +5,7 @@ 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';
@ -15,6 +16,7 @@ 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';
@ -122,10 +124,9 @@ class DestinationMapPage extends StatelessWidget {
FlutterMap TravelMap() {
return FlutterMap(
mapController: indexController.rogMapController,
options: MapOptions(
onMapCreated: (c){
indexController.rogMapController = c;
indexController.rogMapController!.onReady.then((_) {
onMapReady: (){
indexController.is_rog_mapcontroller_loaded.value = true;
subscription = indexController.rogMapController!.mapEventStream.listen((MapEvent mapEvent) {
if (mapEvent is MapEventMoveStart) {
@ -133,7 +134,7 @@ class DestinationMapPage extends StatelessWidget {
if (mapEvent is MapEventMoveEnd) {
//destinationController.is_gps_selected.value = true;
//indexController.mapController!.move(c.center, c.zoom);
LatLngBounds bounds = c.bounds!;
LatLngBounds bounds = indexController.rogMapController!.bounds!;
indexController.currentBound.clear();
indexController.currentBound.add(bounds);
if(indexController.currentUser.length <= 0){
@ -141,7 +142,6 @@ class DestinationMapPage extends StatelessWidget {
}
}
});
});
} ,
bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
zoom: 1,
@ -149,16 +149,10 @@ class DestinationMapPage extends StatelessWidget {
interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
),
children: [
TileLayerWidget(
options: TileLayerOptions(
urlTemplate: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
subdomains: ['a', 'b', 'c'],
),
),
BaseLayer(),
Obx(() =>
indexController.routePointLenght > 0 ?
PolylineLayerWidget(
options: PolylineLayerOptions(
PolylineLayer(
polylines: [
Polyline(
points: getPoints()!,
@ -166,16 +160,14 @@ class DestinationMapPage extends StatelessWidget {
color: Colors.indigo
),
],
),
)
:
Container(),
),
LocationMarkerLayerWidget(),
MarkerLayerWidget(
options: MarkerLayerOptions(
markers: getMarkers()!
),
CurrentLocationLayer(),
MarkerLayer(
markers: getMarkers()!
),
],

4
lib/pages/index/index_controller.dart
View File

@ -46,8 +46,8 @@ class IndexController extends GetxController {
var is_custom_area_selected = false.obs;
MapController? mapController;
MapController? rogMapController;
MapController mapController = MapController();
MapController rogMapController = MapController();
var mode = 0.obs;

2
lib/pages/landing/landing_page.dart
View File

@ -39,7 +39,7 @@ class _LandingPageState extends State<LandingPage> {
Container(
height: MediaQuery.of(context).size.height/3,
decoration: BoxDecoration(
image:DecorationImage(image: AssetImage('assets/gradient_japanese_temple.jpg'))
image:DecorationImage(image: AssetImage('assets/images/gradient_japanese_temple.jpg'))
),
),
SizedBox(height: 20.0,),

24
lib/widgets/base_layer_widget.dart
View File

@ -1,22 +1,24 @@
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_tile_caching/flutter_map_tile_caching.dart';
class BaseLayer extends StatelessWidget {
const BaseLayer({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return TileLayerWidget(
options: TileLayerOptions(
backgroundColor: Colors.transparent,
//urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
urlTemplate: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png',
//urlTemplate: 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
//subdomains: ['a', 'b', 'c'],
//subdomains: ['TileMatrix', 'TileCol', 'TileRow'],
),
);
return TileLayer(
urlTemplate: "https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png",
tileProvider: FMTC.instance('OpenStreetMap (A)').getTileProvider(
FMTCTileProviderSettings(
behavior: CacheBehavior.values
.byName('cacheFirst'),
cachedValidDuration: Duration(
days: 14
),
),
),
);
}
}

203
lib/widgets/map_widget.dart
View File

@ -21,37 +21,63 @@ class MapWidget extends StatelessWidget {
StreamSubscription? subscription;
Widget getMarkerShape(GeoJsonFeature i){
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 Row(
mainAxisAlignment: MainAxisAlignment.start,
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
InkWell(
onTap: () {
GeoJsonFeature? fs = indexController.getFeatureForLatLong(p.geoSerie!.geoPoints[0].latitude, p.geoSerie!.geoPoints[0].longitude);
print("------- fs ${fs}------");
if(fs != null){
indexController.currentFeature.clear();
indexController.currentFeature.add(fs);
//print("----- fs is ${fs.properties!['photos']}");
indexController.getAction();
showModalBottomSheet(
context: context,
isScrollControlled: true,
isDismissible: true,
builder:((context) => BottomSheetNew())
//builder:((context) => BottomSheetWidget())
);
}
},
child: 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: [
Icon(Icons.circle,size: 6.0,),
i.properties!['cp'] == -1 ?
Transform.rotate(
alignment: Alignment.centerLeft,
origin: Offset.fromDirection(1, 26),
angle: 270 * pi / 180,
child: Icon(Icons.play_arrow_outlined, color: Colors.red, size: 70,)):
Container(color: Colors.transparent,),
],
)
),
child: Stack(
alignment: Alignment.center,
children: [
Icon(Icons.circle,size: 6.0,),
i.properties!['cp'] == -1 ?
Transform.rotate(
alignment: Alignment.centerLeft,
origin: Offset.fromDirection(1, 26),
angle: 270 * pi / 180,
child: Icon(Icons.play_arrow_outlined, color: Colors.red, size: 70,)):
Container(color: Colors.transparent,),
],
)
),
),
Container(color: Colors.white, child: Text(TextUtils.getDisplayTextFeture(i), style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color:Colors.red,))),
],
);
@ -71,14 +97,12 @@ class MapWidget extends StatelessWidget {
child: CircularProgressIndicator(),
):
FlutterMap(
//mapController: mapController,
mapController: indexController.mapController,
options: MapOptions(
onMapCreated: (c){
indexController.mapController = c;
indexController.mapController!.onReady.then((_) {
maxZoom:18.4,
onMapReady: (){
indexController.is_mapController_loaded.value = true;
subscription = indexController.mapController!.mapEventStream.listen((MapEvent mapEvent) {
subscription = indexController.mapController.mapEventStream.listen((MapEvent mapEvent) {
if (mapEvent is MapEventMoveStart) {
//print(DateTime.now().toString() + ' [MapEventMoveStart] START');
// do something
@ -89,34 +113,15 @@ class MapWidget extends StatelessWidget {
//indexController.rogMapController!.move(c.center, c.zoom);
}
});
});
},
//center: LatLng(37.15319600454702, 139.58765950528198),
bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
zoom: 1,
maxZoom: 24,
interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
plugins: [
MarkerClusterPlugin(),
],
onPositionChanged: (MapPosition pos, isvalue){
// LatLng c1 = pos.center?? LatLng(0, 0);
// Timer(Duration(milliseconds:800), () {
// print(pos.bounds!.center);
// print("Yeah, this line is printed after 3 second");
// LatLng c2 = pos.center?? LatLng(0, 0);
// if(c1.latitude != 0 && c1.latitude == c2.latitude){
// print("------ calling ----");
// //indexController.loadLocationsBound();
// }
// });
//
},
onTap: (_, __) =>
_popupController
@ -124,81 +129,29 @@ class MapWidget extends StatelessWidget {
),
children: [
BaseLayer(),
LocationMarkerLayerWidget(),
indexController.locations.length > 0 ?
MarkerClusterLayerWidget(
options: MarkerClusterLayerOptions(
spiderfyCircleRadius: 0,
spiderfySpiralDistanceMultiplier: 2,
circleSpiralSwitchover: 12,
maxClusterRadius: 0,
rotate: true,
onMarkerTap: (marker){
GeoJsonFeature? fs = indexController.getFeatureForLatLong(marker.point.latitude, marker.point.longitude);
//print("------- fs ${fs}------");
if(fs != null){
indexController.currentFeature.clear();
indexController.currentFeature.add(fs);
//print("----- fs is ${fs.properties!['photos']}");
indexController.getAction();
showModalBottomSheet(
context: context,
isScrollControlled: true,
isDismissible: true,
builder:((context) => BottomSheetNew())
//builder:((context) => BottomSheetWidget())
);
}
},
size: Size(40, 40),
anchor: AnchorPos.align(AnchorAlign.left),
fitBoundsOptions: const FitBoundsOptions(
padding: EdgeInsets.all(50),
maxZoom: 265,
),
markers:indexController.locations[0].collection.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(
anchorPos: AnchorPos.exactly(Anchor(108.0, 18.0)),
height: 32.0,
width: 120.0,
point: LatLng(p.geoSerie!.geoPoints[0].latitude, p.geoSerie!.geoPoints[0].longitude),
//builder: (ctx) => Icon(Icons.pin_drop),
// builder: (ctx) => i.properties!["category"] != null ?
// ImageIcon(
// AssetImage("assets/images/${i.properties!["category"]}.png"),
// color: Color(0xFF3A5A98),
// size:12.0,
// )
// : Icon(Icons.pin_drop),
builder: (ctx){
return getMarkerShape(i);
},
);
}).toList(),
builder: (context, markers) {
return Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20.0),
color: Colors.blue),
child: Center(
child: Text(
markers.length.toString(),
style: TextStyle(color: Colors.white),
),
),
);
},
),
): Container(height:0,width: 0),
CurrentLocationLayer(),
indexController.locations.isNotEmpty && indexController.locations[0].collection.isNotEmpty ?
MarkerLayer(
markers:indexController.locations[0].collection.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(
anchorPos: AnchorPos.exactly(Anchor(108.0, 18.0)),
height: 32.0,
width: 120.0,
point: LatLng(p.geoSerie!.geoPoints[0].latitude, p.geoSerie!.geoPoints[0].longitude),
builder: (ctx){
return getMarkerShape(i, context);
},
);
}).toList(),
)
:
Center(child: CircularProgressIndicator())
,
],
)
)