MobilApp/lib/pages/field_trip/presentations/views/fiels_trip_view.dart

114 lines
4.4 KiB
Dart

import 'package:flutter_map/flutter_map.dart';
import 'package:flutter_map_location_marker/flutter_map_location_marker.dart';
import 'package:flutter_map_polygon_editor/polygon_editor.dart';
import 'package:get/get.dart';
import 'package:latlong2/latlong.dart';
import 'package:terepi_seged/pages/field_trip/presentations/controllers/field_trip_controller.dart';
import 'package:flutter/material.dart';
class FieldTripView extends GetView<FieldTripController> {
const FieldTripView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
extendBody: true,
appBar: AppBar(
title: const Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Terepbejárás'),
],
)),
body: Column(
children: [
Expanded(
child: Stack(children: [
Obx(() => controller.mapIsInitialized.value
? FlutterMap(
mapController: controller.mapController,
options: controller.mapOptions,
children: [
TileLayer(
urlTemplate:
'http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}',
subdomains: const ['mt0', 'mt1', 'mt2', 'mt3'],
maxNativeZoom: 18,
),
CurrentLocationLayer(
alignPositionOnUpdate: AlignOnUpdate.once,
),
MarkerLayer(markers: controller.pointNotes),
PolylineLayer(
polylines: controller.polylineNotes,
),
PolygonLayer(
polygons: controller.polygonNotes,
useAltRendering: true,
),
// PolylineLayer(polylines: [
// Polyline(
// points: [
// const LatLng(47.65, 19.00),
// const LatLng(47.64, 19.02),
// const LatLng(47.69, 19.22),
// ],
// strokeWidth: 8,
// color: const Color(0xFF60399E),
// hitValue: (
// title: 'Purple Line',
// subtitle: 'Nothing really special here...',
// ),
// ),
// ]),
PolygonEditor(
controller: controller.polygonEditorController,
throttleDuration: Duration.zero)
],
)
: const Center(child: CircularProgressIndicator())),
Positioned(
bottom: 3,
right: 3,
child: Row(
children: [
IconButton.filled(
iconSize: 32,
onPressed: () {
controller.startPointEdition();
},
icon: const Icon(Icons.flag)),
IconButton.filled(
iconSize: 32,
onPressed: () {
controller.startPolylineEdition();
},
icon: const Icon(Icons.polyline)),
IconButton.filled(
iconSize: 32,
onPressed: () {
controller.startPolygonEdition();
},
icon: const Icon(Icons.border_outer)),
IconButton.filled(
iconSize: 32,
onPressed: () {
controller.saveNote();
},
icon: const Icon(Icons.done)),
IconButton.filled(
iconSize: 32,
onPressed: () {
controller.cancelEditorController();
},
icon: const Icon(Icons.cancel))
],
))
]))
],
),
);
}
}