Add shared UI components for mesh application

- Introduced `mesh_ui.dart` with reusable widgets including SectionHeader, MeshCard, StatusChip, StatTile, AvatarCircle, SignalBars, RouteChip, PulseDot, BottomSheetHeader, ErrorRetryCard, and ListEntrance.
- Implemented `path_map_ui.dart` for path map screens, featuring path distance calculations, playback controls, and a summary list of observed paths.
- Created `themed_map_tile_layer.dart` for shared cached map tiles with automatic dark-mode treatment.
This commit is contained in:
zjs81
2026-06-12 21:04:02 -07:00
parent 6a31d304d3
commit 51d6210920
72 changed files with 16778 additions and 7110 deletions
+79 -34
View File
@@ -4,6 +4,7 @@ import 'package:provider/provider.dart';
import '../l10n/l10n.dart';
import '../services/app_debug_log_service.dart';
import '../theme/mesh_theme.dart';
import '../widgets/adaptive_app_bar_title.dart';
import '../helpers/snack_bar_builder.dart';
@@ -58,27 +59,57 @@ class AppDebugLogScreen extends StatelessWidget {
child: hasEntries
? ListView.separated(
itemCount: entries.length,
separatorBuilder: (_, _) => const Divider(height: 1),
separatorBuilder: (_, _) =>
const Divider(height: 1, color: MeshPalette.line),
itemBuilder: (context, index) {
final entry = entries[index];
return ListTile(
dense: true,
leading: _buildLevelIcon(context, entry.level),
title: Text(
'[${entry.tag}] ${entry.message}',
style: const TextStyle(
fontSize: 12,
fontFamily: 'monospace',
),
return Container(
color: MeshPalette.bg,
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
subtitle: Text(
entry.formattedTime,
style: TextStyle(
fontSize: 10,
color: Theme.of(
context,
).colorScheme.onSurfaceVariant,
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildLevelIcon(context, entry.level),
const SizedBox(width: 10),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text.rich(
TextSpan(
children: [
TextSpan(
text: '[${entry.tag}] ',
style: MeshTheme.mono(
fontSize: 11.5,
color: _levelColor(entry.level),
),
),
TextSpan(
text: entry.message,
style: MeshTheme.mono(
fontSize: 11.5,
color: MeshPalette.ink2,
),
),
],
),
),
const SizedBox(height: 2),
Text(
entry.formattedTime,
style: MeshTheme.mono(
fontSize: 9.5,
color: MeshPalette.ink4,
),
),
],
),
),
],
),
);
},
@@ -87,29 +118,25 @@ class AppDebugLogScreen extends StatelessWidget {
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
const Icon(
Icons.bug_report_outlined,
size: 64,
color: Theme.of(context).colorScheme.onSurfaceVariant,
color: MeshPalette.ink3,
),
const SizedBox(height: 16),
Text(
context.l10n.debugLog_noEntries,
style: TextStyle(
style: const TextStyle(
fontSize: 16,
color: Theme.of(
context,
).colorScheme.onSurfaceVariant,
color: MeshPalette.ink3,
),
),
const SizedBox(height: 8),
Text(
context.l10n.debugLog_enableInSettings,
style: TextStyle(
style: const TextStyle(
fontSize: 12,
color: Theme.of(
context,
).colorScheme.onSurfaceVariant,
color: MeshPalette.ink3,
),
),
],
@@ -121,19 +148,37 @@ class AppDebugLogScreen extends StatelessWidget {
);
}
Widget _buildLevelIcon(BuildContext context, AppDebugLogLevel level) {
final colorScheme = Theme.of(context).colorScheme;
Color _levelColor(AppDebugLogLevel level) {
switch (level) {
case AppDebugLogLevel.info:
return Icon(Icons.info_outline, size: 18, color: colorScheme.primary);
return MeshPalette.blue;
case AppDebugLogLevel.warning:
return Icon(
return MeshPalette.warn;
case AppDebugLogLevel.error:
return MeshPalette.alert;
}
}
Widget _buildLevelIcon(BuildContext context, AppDebugLogLevel level) {
switch (level) {
case AppDebugLogLevel.info:
return const Icon(
Icons.info_outline,
size: 18,
color: MeshPalette.blue,
);
case AppDebugLogLevel.warning:
return const Icon(
Icons.warning_amber_outlined,
size: 18,
color: colorScheme.tertiary,
color: MeshPalette.warn,
);
case AppDebugLogLevel.error:
return Icon(Icons.error_outline, size: 18, color: colorScheme.error);
return const Icon(
Icons.error_outline,
size: 18,
color: MeshPalette.alert,
);
}
}
}