Skip to content

Commit

Permalink
Improved example app
Browse files Browse the repository at this point in the history
  • Loading branch information
JaffaKetchup committed Oct 15, 2024
1 parent eae1ed7 commit c5c223c
Show file tree
Hide file tree
Showing 5 changed files with 138 additions and 176 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -409,8 +409,6 @@ class _GreyscaleMaskerRenderer extends RenderProxyBox {

layerHandleIndex++;
}

context.canvas.drawCircle(offset, 100, Paint()..color = Colors.blue);
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,20 @@ import 'package:provider/provider.dart';
import '../../../../../shared/state/region_selection_provider.dart';

class CustomPolygonSnappingIndicator extends StatelessWidget {
const CustomPolygonSnappingIndicator({
super.key,
});
const CustomPolygonSnappingIndicator({super.key});

@override
Widget build(BuildContext context) {
final coords = context.select<RegionSelectionProvider, List<LatLng>>(
(p) => p.currentConstructingCoordinates,
);
final customPolygonSnap = context.select<RegionSelectionProvider, bool>(
(p) => p.customPolygonSnap,
);

return MarkerLayer(
markers: [
if (coords.isNotEmpty &&
context.select<RegionSelectionProvider, bool>(
(p) => p.customPolygonSnap,
))
if (coords.isNotEmpty && customPolygonSnap)
Marker(
height: 32,
width: 32,
Expand All @@ -32,12 +30,7 @@ class CustomPolygonSnappingIndicator extends StatelessWidget {
borderRadius: BorderRadius.circular(16),
border: Border.all(width: 2),
),
child: const Center(
child: Icon(
Icons.auto_fix_normal,
size: 18,
),
),
child: const Center(child: Icon(Icons.auto_fix_normal, size: 18)),
),
),
],
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,153 +9,60 @@ import '../../../../../shared/state/region_selection_provider.dart';
class RegionShape extends StatelessWidget {
const RegionShape({super.key});

static const _fullWorldPolygon = [
LatLng(-90, 180),
LatLng(90, 180),
LatLng(90, -180),
LatLng(-90, -180),
];

@override
Widget build(BuildContext context) => Consumer<RegionSelectionProvider>(
builder: (context, provider, _) => Stack(
fit: StackFit.expand,
children: [
for (final MapEntry(key: region, value: color)
in provider.constructedRegions.entries)
switch (region) {
RectangleRegion(:final bounds) => PolygonLayer(
polygons: [
Polygon(
points: [
bounds.northWest,
bounds.northEast,
bounds.southEast,
bounds.southWest,
],
color: color.toColor().withValues(alpha: 0.7),
),
],
),
CircleRegion(:final center, :final radius) => CircleLayer(
circles: [
CircleMarker(
point: center,
radius: radius * 1000,
useRadiusInMeter: true,
color: color.toColor().withValues(alpha: 0.7),
),
],
),
LineRegion() => PolygonLayer(
polygons:
/* Polyline(
points: line,
strokeWidth: radius * 2,
useStrokeWidthInMeter: true,
color: color.toColor().withValues(alpha: 0.7),
strokeJoin: StrokeJoin.miter,
strokeCap: StrokeCap.square,
),*/
region
.toOutlines(1)
.map(
(o) => Polygon(
points: o,
color: color.toColor().withValues(alpha: 0.7),
),
)
.toList(growable: false),
),
CustomPolygonRegion(:final outline) => PolygonLayer(
polygons: [
Polygon(
points: outline,
color: color.toColor().withValues(alpha: 0.7),
),
],
),
MultiRegion() => throw UnsupportedError(
'Cannot support `MultiRegion`s here',
),
},
if (provider.currentConstructingCoordinates.isNotEmpty)
if (provider.currentRegionType == RegionType.line)
/* PolylineLayer(
polylines: [
Polyline(
points: [
...provider.currentConstructingCoordinates,
provider.currentNewPointPos,
builder: (context, provider, _) {
final ccc = provider.currentConstructingCoordinates;
final cnpp = provider.currentNewPointPos;

late final renderConstructingRegion = provider.currentRegionType ==
RegionType.line
? LineRegion([...ccc, cnpp], provider.lineRadius)
.toOutlines(1)
.toList(growable: false)
: [
switch (provider.currentRegionType) {
RegionType.rectangle when ccc.length == 1 =>
RectangleRegion(LatLngBounds.fromPoints([ccc[0], cnpp]))
.toOutline()
.toList(),
RegionType.rectangle when ccc.length != 1 =>
RectangleRegion(LatLngBounds.fromPoints(ccc))
.toOutline()
.toList(),
RegionType.circle => CircleRegion(
ccc[0],
const Distance(roundResult: false).distance(
ccc[0],
ccc.length == 1 ? cnpp : ccc[1],
) /
1000,
).toOutline().toList(),
RegionType.customPolygon => [
...ccc,
if (provider.customPolygonSnap) ccc.first else cnpp,
],
color: Colors.white.withValues(alpha: 2 / 3),
strokeWidth: provider.lineRadius * 2,
strokeJoin: StrokeJoin.miter,
strokeCap: StrokeCap.square,
useStrokeWidthInMeter: true,
),
],
)*/
PolygonLayer(
polygons: LineRegion(
[
...provider.currentConstructingCoordinates,
provider.currentNewPointPos,
],
provider.lineRadius * 2,
)
.toOutlines(1)
.map(
(o) => Polygon(
points: o,
color: Colors.white.withValues(alpha: 2 / 3),
),
)
.toList(growable: false),
)
else
_ => throw UnsupportedError('Unreachable.'),
},
];

return Stack(
fit: StackFit.expand,
children: [
for (final MapEntry(key: region, value: color)
in provider.constructedRegions.entries)
_renderConstructedRegion(region, color),
if (ccc.isNotEmpty) // Construction in progress
PolygonLayer(
polygons: [
Polygon(
points: _fullWorldPolygon,
holePointsList: [
switch (provider.currentRegionType) {
RegionType.circle => CircleRegion(
provider.currentConstructingCoordinates[0],
const Distance(roundResult: false).distance(
provider.currentConstructingCoordinates[0],
provider.currentConstructingCoordinates
.length ==
1
? provider.currentNewPointPos
: provider
.currentConstructingCoordinates[1],
) /
1000,
).toOutline().toList(),
RegionType.rectangle => RectangleRegion(
LatLngBounds.fromPoints(
provider.currentConstructingCoordinates
.length ==
1
? [
provider
.currentConstructingCoordinates[0],
provider.currentNewPointPos,
]
: provider.currentConstructingCoordinates,
),
).toOutline().toList(),
RegionType.customPolygon => [
...provider.currentConstructingCoordinates,
if (provider.customPolygonSnap)
provider.currentConstructingCoordinates.first
else
provider.currentNewPointPos,
],
_ => throw UnsupportedError('Unreachable.'),
},
points: const [
LatLng(-90, 180),
LatLng(90, 180),
LatLng(90, -180),
LatLng(-90, -180),
],
holePointsList: renderConstructingRegion,
borderColor: Colors.black,
borderStrokeWidth: 2,
color: Theme.of(context)
Expand All @@ -165,7 +72,56 @@ class RegionShape extends StatelessWidget {
),
],
),
],
),
],
);
},
);

Widget _renderConstructedRegion(BaseRegion region, HSLColor color) =>
switch (region) {
RectangleRegion(:final bounds) => PolygonLayer(
polygons: [
Polygon(
points: [
bounds.northWest,
bounds.northEast,
bounds.southEast,
bounds.southWest,
],
color: color.toColor().withValues(alpha: 0.7),
),
],
),
CircleRegion(:final center, :final radius) => CircleLayer(
circles: [
CircleMarker(
point: center,
radius: radius * 1000,
useRadiusInMeter: true,
color: color.toColor().withValues(alpha: 0.7),
),
],
),
LineRegion() => PolygonLayer(
polygons: region
.toOutlines(1)
.map(
(o) => Polygon(
points: o,
color: color.toColor().withValues(alpha: 0.7),
),
)
.toList(growable: false),
),
CustomPolygonRegion(:final outline) => PolygonLayer(
polygons: [
Polygon(
points: outline,
color: color.toColor().withValues(alpha: 0.7),
),
],
),
MultiRegion() =>
throw UnsupportedError('Cannot support `MultiRegion`s here'),
};
}
22 changes: 9 additions & 13 deletions example/lib/src/screens/main/map_view/map_view.dart
Original file line number Diff line number Diff line change
Expand Up @@ -154,12 +154,12 @@ class _MapViewState extends State<MapView> with TickerProviderStateMixin {
LatLng(45.3052535669648, 14.476223064038985),
5,
).toDownloadable(
minZoom: 0,
maxZoom: 12,
minZoom: 5,
maxZoom: 15,
options: TileLayer(
//urlTemplate: 'http://127.0.0.1:7070/{z}/{x}/{y}',
urlTemplate:
'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
urlTemplate: 'http://0.0.0.0:7070/{z}/{x}/{y}',
//urlTemplate:
// 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
),
),
parallelThreads: 3,
Expand Down Expand Up @@ -411,15 +411,11 @@ class _MapViewState extends State<MapView> with TickerProviderStateMixin {
children: [
DownloadProgressMasker(
downloadProgressStream: _testingDownloadTileCoordsStream,
/*tileCoordinates: Stream.periodic(
const Duration(seconds: 5),
_testingCoordsList.elementAtOrNull,
).whereNotNull(),*/
minZoom: 0,
maxZoom: 12,
minZoom: 5,
maxZoom: 15,
child: tileLayer,
),
PolygonLayer(
/*PolygonLayer(
polygons: [
Polygon(
points: [
Expand All @@ -437,7 +433,7 @@ class _MapViewState extends State<MapView> with TickerProviderStateMixin {
color: Colors.black.withAlpha(255 ~/ 2),
),
],
),
),*/
if (widget.mode == MapViewMode.downloadRegion) ...[
const RegionShape(),
const CustomPolygonSnappingIndicator(),
Expand Down
Loading

0 comments on commit c5c223c

Please sign in to comment.