GNSS/MobilApp
1
0
Fork 0
Code Issues 11 Pull Requests Actions Packages Projects 1 Releases 1 Wiki Activity

Track rögzítés vizuális visszajelzésének módosítása.

Browse Source
This commit is contained in:
gitea_admin
2026-06-16 02:06:13 +02:00
parent beb07fe007
commit 537897005c
8 changed files with 695 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/widgets/appbar/gnss_receiver_icon.dart
+174
View File
@@ -0,0 +1,174 @@
import 'package:flutter/material.dart';
class GnssReceiverIcon extends StatelessWidget {
final double size;
final Color? color;
final Color? surfaceColor;
const GnssReceiverIcon({
super.key,
this.size = 28,
this.color,
this.surfaceColor,
});
@override
Widget build(BuildContext context) {
final iconColor = color ??
IconTheme.of(context).color ??
Theme.of(context).colorScheme.onSurfaceVariant;
final bgColor = surfaceColor ?? Theme.of(context).colorScheme.surface;
return SizedBox(
width: size,
height: size,
child: CustomPaint(
painter: _GnssReceiverCustomIconPainter(
color: iconColor,
surfaceColor: bgColor,
),
),
);
}
}
class _GnssReceiverCustomIconPainter extends CustomPainter {
final Color color;
final Color surfaceColor;
const _GnssReceiverCustomIconPainter({
required this.color,
required this.surfaceColor,
});
@override
void paint(Canvas canvas, Size size) {
canvas.save();
// 100x100-as koordinátarendszerre rajzolunk,
// így az ikon jól skálázható.
canvas.scale(size.width / 100.0, size.height / 100.0);
final mainPaint = Paint()
..color = color
..style = PaintingStyle.fill
..isAntiAlias = true;
final bandPaint = Paint()
..color = Color.lerp(color, Colors.black, 0.35)!
..style = PaintingStyle.fill
..isAntiAlias = true;
final detailPaint = Paint()
..color = Color.lerp(color, surfaceColor, 0.72)!
..style = PaintingStyle.fill
..isAntiAlias = true;
final shadowPaint = Paint()
..color = Color.lerp(color, Colors.black, 0.18)!
..style = PaintingStyle.fill
..isAntiAlias = true;
// ── fő GNSS vevőtest ────────────────────────────────
final body = Path()
..moveTo(11, 34)
..cubicTo(11, 17, 28, 7, 50, 7)
..cubicTo(72, 7, 89, 17, 89, 34)
..cubicTo(89, 41, 85, 46, 79, 50)
..cubicTo(76, 52, 75, 56, 74, 62)
..lineTo(71, 75)
..cubicTo(70, 84, 63, 89, 55, 89)
..lineTo(45, 89)
..cubicTo(37, 89, 30, 84, 29, 75)
..lineTo(26, 62)
..cubicTo(25, 56, 24, 52, 21, 50)
..cubicTo(15, 46, 11, 41, 11, 34)
..close();
canvas.drawPath(body, mainPaint);
// ── felső sötét sáv ─────────────────────────────────
final band = RRect.fromRectAndRadius(
const Rect.fromLTRB(11, 29, 89, 43),
const Radius.circular(8),
);
canvas.drawRRect(band, bandPaint);
// ── kis felső kijelző / csík ─────────────────────────
canvas.drawRRect(
RRect.fromRectAndRadius(
const Rect.fromLTRB(43, 34, 57, 36.5),
const Radius.circular(1.2),
),
detailPaint,
);
// ── középső kijelző ─────────────────────────────────
canvas.drawRRect(
RRect.fromRectAndRadius(
const Rect.fromLTRB(38, 53, 62, 68),
const Radius.circular(1.5),
),
detailPaint,
);
// ── bal oldali kis jelzők ────────────────────────────
_drawLed(canvas, const Rect.fromLTRB(31, 55, 34.5, 58.5), detailPaint);
_drawLed(canvas, const Rect.fromLTRB(31, 61, 34.5, 64.5), detailPaint);
_drawLed(canvas, const Rect.fromLTRB(31, 67, 34.5, 70.5), detailPaint);
// ── jobb oldali kis jelzők ───────────────────────────
_drawLed(canvas, const Rect.fromLTRB(65.5, 55, 69, 58.5), detailPaint);
_drawLed(canvas, const Rect.fromLTRB(65.5, 61, 69, 64.5), detailPaint);
_drawLed(canvas, const Rect.fromLTRB(65.5, 67, 69, 70.5), detailPaint);
// ── alsó csatlakozó / bot ────────────────────────────
canvas.drawRect(
const Rect.fromLTRB(44, 89, 56, 98),
shadowPaint,
);
canvas.drawRect(
const Rect.fromLTRB(44, 98, 56, 118),
mainPaint,
);
// csíkok a boton
canvas.drawRect(
const Rect.fromLTRB(44, 102, 56, 104.5),
detailPaint..color = detailPaint.color.withOpacity(0.38),
);
canvas.drawRect(
const Rect.fromLTRB(44, 109, 56, 111),
detailPaint,
);
canvas.restore();
}
void _drawLed(Canvas canvas, Rect rect, Paint paint) {
canvas.drawRRect(
RRect.fromRectAndRadius(
rect,
const Radius.circular(0.8),
),
paint,
);
}
@override
bool shouldRepaint(covariant _GnssReceiverCustomIconPainter oldDelegate) {
return oldDelegate.color != color ||
oldDelegate.surfaceColor != surfaceColor;
}
}
lib/widgets/appbar/gnss_receiver_outline_icon.dart
+155
View File
@@ -0,0 +1,155 @@
import 'package:flutter/material.dart';
class GnssReceiverOutlineIcon extends StatelessWidget {
final double size;
final Color? color;
final double strokeWidth;
const GnssReceiverOutlineIcon({
super.key,
this.size = 26,
this.color,
this.strokeWidth = 2.1,
});
@override
Widget build(BuildContext context) {
final iconColor = color ??
IconTheme.of(context).color ??
Theme.of(context).colorScheme.onSurfaceVariant;
return SizedBox.square(
dimension: size,
child: CustomPaint(
painter: _GnssReceiverOutlineIconPainter(
color: iconColor,
strokeWidth: strokeWidth,
),
),
);
}
}
class _GnssReceiverOutlineIconPainter extends CustomPainter {
final Color color;
final double strokeWidth;
const _GnssReceiverOutlineIconPainter({
required this.color,
required this.strokeWidth,
});
@override
void paint(Canvas canvas, Size size) {
canvas.save();
// 100 x 100 koordinátarendszerre rajzolunk,
// így jól skálázódik 24–32 px méret között is.
canvas.scale(size.width / 100.0, size.height / 100.0);
final stroke = Paint()
..color = color
..style = PaintingStyle.stroke
..strokeWidth = strokeWidth * 100.0 / size.width
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round
..isAntiAlias = true;
final thinStroke = Paint()
..color = color.withOpacity(0.82)
..style = PaintingStyle.stroke
..strokeWidth = stroke.strokeWidth * 0.72
..strokeCap = StrokeCap.round
..strokeJoin = StrokeJoin.round
..isAntiAlias = true;
// ── felső GNSS fej / antenna ────────────────────────
//
// Kicsit hasonlít a feltöltött vevő formájára,
// de nem kitöltött, hanem outline.
final head = Path()
..moveTo(17, 34)
..cubicTo(17, 18, 31, 10, 50, 10)
..cubicTo(69, 10, 83, 18, 83, 34)
..cubicTo(83, 43, 76, 48, 68, 49)
..lineTo(32, 49)
..cubicTo(24, 48, 17, 43, 17, 34)
..close();
canvas.drawPath(head, stroke);
// ── alsó vevőtest ───────────────────────────────────
final body = RRect.fromRectAndRadius(
const Rect.fromLTRB(26, 47, 74, 76),
const Radius.circular(8),
);
canvas.drawRRect(body, stroke);
// ── kijelző ──────────────────────────────────────────
final display = RRect.fromRectAndRadius(
const Rect.fromLTRB(40, 56, 60, 66),
const Radius.circular(2),
);
canvas.drawRRect(display, thinStroke);
// ── felső kis jelzőcsík ──────────────────────────────
canvas.drawLine(
const Offset(43, 34),
const Offset(57, 34),
thinStroke,
);
// ── oldalsó gombok / státusz LED-ek ─────────────────
canvas.drawLine(
const Offset(33, 57),
const Offset(33, 57),
stroke,
);
canvas.drawLine(
const Offset(33, 64),
const Offset(33, 64),
stroke,
);
canvas.drawLine(
const Offset(67, 57),
const Offset(67, 57),
stroke,
);
canvas.drawLine(
const Offset(67, 64),
const Offset(67, 64),
stroke,
);
// ── nyak / csatlakozó ────────────────────────────────
canvas.drawLine(
const Offset(50, 76),
const Offset(50, 89),
stroke,
);
// ── alsó bot / csatlakozó rövid vonallal ─────────────
final pole = RRect.fromRectAndRadius(
const Rect.fromLTRB(44, 86, 56, 96),
const Radius.circular(2),
);
canvas.drawRRect(pole, stroke);
// kis gyűrű a nyakon
canvas.drawLine(
const Offset(44, 84),
const Offset(56, 84),
thinStroke,
);
canvas.restore();
}
@override
bool shouldRepaint(covariant _GnssReceiverOutlineIconPainter oldDelegate) {
return oldDelegate.color != color || oldDelegate.strokeWidth != strokeWidth;
}
}
lib/widgets/appbar/shell_map_appbar.dart
+39 -9
View File
@@ -12,8 +12,11 @@ import 'package:terepi_seged/services/ntrip_service.dart';
import 'package:terepi_seged/widgets/appbar/gnss_status_strip.dart';
import 'package:terepi_seged/widgets/gnss_status_chip.dart';
import 'package:terepi_seged/widgets/map_mode_menu_anchor.dart';
import 'package:terepi_seged/widgets/tracking/track_recording_action.dart';
import '../tracking/tracking_sheet.dart';
import 'gnss_receiver_icon.dart';
import 'gnss_receiver_outline_icon.dart';
class ShellMapAppBar extends StatelessWidget implements PreferredSizeWidget {
final MapSurveyController controller;
@@ -32,6 +35,7 @@ class ShellMapAppBar extends StatelessWidget implements PreferredSizeWidget {
toolbarHeight: 50,
automaticallyImplyLeading: false,
//leadingWidth: 44,
actionsPadding: EdgeInsets.zero,
titleSpacing: 0,
leading: Builder(builder: (context) {
return IconButton(
@@ -110,19 +114,45 @@ class ShellMapAppBar extends StatelessWidget implements PreferredSizeWidget {
]),
actions: [
const GnssIconStatusChip(),
// Obx(() {
// final isRec = TrackingController.to.isRecording.value;
// return Badge(
// isLabelVisible: isRec,
// label: null, // csak piros pont, szám nélkül
// backgroundColor: Colors.red,
// child: IconButton(
// icon: const Icon(Icons.route_outlined),
// tooltip: 'Nyomvonal',
// onPressed: () => _openTrackingSheet(context),
// ),
// );
// }),
Obx(() {
final isRec = TrackingController.to.isRecording.value;
return Badge(
isLabelVisible: isRec,
label: null, // csak piros pont, szám nélkül
backgroundColor: Colors.red,
child: IconButton(
icon: const Icon(Icons.route_outlined),
tooltip: 'Nyomvonal',
onPressed: () => _openTrackingSheet(context),
final connected = controller.gpsIsConnected;
return IconButton(
tooltip: connected
? 'GNSS vevő csatlakozva'
: 'GNSS vevő nincs csatlakoztatva',
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(
minWidth: 40,
minHeight: 44,
),
icon: GnssReceiverIcon(
size: 24,
color: connected
? Colors.green.shade700
: Theme.of(context).colorScheme.onSurfaceVariant,
),
onPressed: () {},
);
}),
TrackRecordingAction(
controller: TrackingController.to,
onTap: () => _openTrackingSheet(context),
),
PopupMenuButton(
tooltip: 'További funkciók',
icon: const Icon(Icons.more_vert),