Constantin Leue
0d3dba2482
Measured the prototype screenshot pixel-for-pixel: content pills take up ~79% of the header's total height, matching its own CSS (height:38px, topBarWrap padding:5px 10px -> 48px total). The Flutter port had drifted to 34px for HeaderWindPill, MapSearchControls, and NavIconButton, while FlightModePill was left at the original 38px - so Fly mode looked inconsistent against itself, and both modes wasted more header height as margin than the prototype does. Bringing all four back to a shared 38px fixes both.
60 lines
2.1 KiB
Dart
60 lines
2.1 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
|
|
import '../providers/wind_provider.dart';
|
|
import 'wind_arrow_icon.dart';
|
|
|
|
/// Kopfleisten-Pille mit Windrichtung/-geschwindigkeit auf 120 m AGL ueber
|
|
/// dem Referenzort (Doku 3.8). Antippen schaltet die Wind-Marker an jedem
|
|
/// Wegpunkt ein/aus (HTML-Demonstrator: showPerWaypointWind).
|
|
class HeaderWindPill extends ConsumerWidget {
|
|
const HeaderWindPill({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
final state = ref.watch(headerWindProvider);
|
|
final sample = state.sample;
|
|
final active = state.showPerWaypoint;
|
|
|
|
return GestureDetector(
|
|
onTap: () => ref.read(headerWindProvider.notifier).toggleShowPerWaypoint(),
|
|
child: Container(
|
|
// 38 statt vorher 34 (Nutzerwunsch: Kopfleisten-Pillen/-Buttons
|
|
// einheitlich auf die im HTML-Demonstrator vermessene Hoehe bringen,
|
|
// siehe TopModeBar-Klassendoku) - deckungsgleich mit FlightModePill,
|
|
// das schon immer 38 nutzte.
|
|
height: 38,
|
|
padding: const EdgeInsets.symmetric(horizontal: 10),
|
|
decoration: BoxDecoration(
|
|
color: active
|
|
? const Color(0xFF4D9DFF).withValues(alpha: 0.32)
|
|
: Colors.black.withValues(alpha: 0.55),
|
|
borderRadius: BorderRadius.circular(19),
|
|
border: Border.all(
|
|
color: active
|
|
? const Color(0xFF4D9DFF)
|
|
: Colors.white.withValues(alpha: 0.4),
|
|
),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
if (sample != null) ...[
|
|
WindArrowIcon(dirFromDeg: sample.dirFromDeg, size: 15),
|
|
const SizedBox(width: 4),
|
|
],
|
|
Text(
|
|
sample != null ? '${sample.speedMs.round()} m/s' : '—',
|
|
style: const TextStyle(
|
|
color: Colors.white,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|