Dash page and smart-serow's palette, boxed widgets, attitude and G-meter
Ported from smart-serow's HUD: the four-colour palette with dark/bright variants (same theme JSON format, loaded at runtime; YUKART_THEME picks one), StatBox and StatBoxMain, WhiskeyMark and AccelGraph. The whole app takes its colours from the palette. Dash: attitude, G-meter, RPM, GNSS speed, pedal, coolant and telltales, each from its contracts signal; missing and stale draw in subdued. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DDwfd6Ki8UfG4hK6W5YpJz
This commit is contained in:
+266
@@ -0,0 +1,266 @@
|
||||
// The software dash: smart-serow's HUD layout and widgets, fed from the boundary.
|
||||
// A grid of boxes (lib/widgets/stat_box.dart): the instruments and the big numbers
|
||||
// in the main row, smaller readouts and telltales below. Every value names its
|
||||
// signal from contracts' signals.json and nothing else (app guideline 1).
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'boundary.dart';
|
||||
import 'theme/palette.dart';
|
||||
import 'widgets/accel_graph.dart';
|
||||
import 'widgets/stat_box.dart';
|
||||
import 'widgets/whiskey_mark.dart';
|
||||
|
||||
/// One signal's current state, as the dash needs it.
|
||||
class Reading {
|
||||
const Reading(this.value, {this.dim = false});
|
||||
|
||||
/// The value, or null when missing or known-without-value.
|
||||
final Object? value;
|
||||
|
||||
/// Missing or stale: drawn in subdued.
|
||||
final bool dim;
|
||||
|
||||
static Reading of(Boundary b, String name) {
|
||||
final e = b.signals[name];
|
||||
if (e is! Map) return const Reading(null, dim: true);
|
||||
final q = e['quality'] as String? ?? 'ok';
|
||||
return Reading(e['value'], dim: q != 'ok' || e['value'] == null);
|
||||
}
|
||||
|
||||
double? get number => value is num ? (value as num).toDouble() : null;
|
||||
bool get on => value == true;
|
||||
|
||||
String fixed([int decimals = 0]) =>
|
||||
number == null ? '—' : number!.toStringAsFixed(decimals);
|
||||
}
|
||||
|
||||
class DashPage extends StatelessWidget {
|
||||
const DashPage({super.key, required this.boundary, required this.themes});
|
||||
final Boundary boundary;
|
||||
final Themes themes;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ListenableBuilder(
|
||||
listenable: Listenable.merge([boundary, themes]),
|
||||
builder: (context, _) {
|
||||
final p = AppTheme.of(context);
|
||||
final b = boundary;
|
||||
Reading r(String n) => Reading.of(b, n);
|
||||
final rpm = r('engine_rpm');
|
||||
final speed = r('gnss_speed_kph');
|
||||
final pedal = r('accel_pedal_pct');
|
||||
final coolant = r('obd_coolant_temp_c');
|
||||
final lat = r('imu_accel_lat_g');
|
||||
final lon = r('imu_accel_lon_g');
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: p.background,
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
if (b.mock)
|
||||
Container(
|
||||
color: p.highlight,
|
||||
padding: const EdgeInsets.symmetric(vertical: 4),
|
||||
child: Text(
|
||||
'MOCK DATA — NOT FROM THE CAR',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
color: p.background,
|
||||
fontWeight: FontWeight.w900,
|
||||
letterSpacing: 2,
|
||||
),
|
||||
),
|
||||
),
|
||||
_DashBar(boundary: b, themes: themes),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
|
||||
child: Column(
|
||||
children: [
|
||||
// Main area: instruments and the big numbers.
|
||||
Expanded(
|
||||
flex: 7,
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: WhiskeyMark(
|
||||
roll: r('imu_roll_deg').number,
|
||||
pitch: r('imu_pitch_deg').number,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: AccelGraph(
|
||||
ax: lat.number,
|
||||
ay: lon.number,
|
||||
maxG: 0.8,
|
||||
ghostTrackPeriod: const Duration(seconds: 4),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Column(
|
||||
children: [
|
||||
StatBoxMain(
|
||||
value: rpm.fixed(),
|
||||
label: 'RPM',
|
||||
dim: rpm.dim,
|
||||
isWarning: () => (rpm.number ?? 0) > 6000,
|
||||
),
|
||||
StatBoxMain(
|
||||
value: speed.fixed(),
|
||||
unit: 'km/h',
|
||||
label: 'GNSS SPEED',
|
||||
dim: speed.dim,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
// Bottom row: smaller readouts and telltales.
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: Row(
|
||||
children: [
|
||||
StatBox(
|
||||
value: pedal.fixed(),
|
||||
unit: '%',
|
||||
label: 'PEDAL',
|
||||
dim: pedal.dim,
|
||||
),
|
||||
StatBox(
|
||||
value: coolant.fixed(),
|
||||
unit: '°C',
|
||||
label: 'COOLANT',
|
||||
dim: coolant.dim,
|
||||
isWarning: () => (coolant.number ?? 0) > 105,
|
||||
),
|
||||
Telltale(
|
||||
label: '◀',
|
||||
reading: r('indicator_left'),
|
||||
),
|
||||
Telltale(
|
||||
label: '▶',
|
||||
reading: r('indicator_right'),
|
||||
),
|
||||
Telltale(
|
||||
label: 'BRAKE',
|
||||
reading: r('brake_pedal'),
|
||||
),
|
||||
Telltale(
|
||||
label: 'PARK',
|
||||
reading: r('handbrake'),
|
||||
warn: true,
|
||||
),
|
||||
Telltale(
|
||||
label: 'LIGHTS',
|
||||
reading: r('side_lights'),
|
||||
),
|
||||
Telltale(
|
||||
label: 'DOOR',
|
||||
reading: r('door_open'),
|
||||
warn: true,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// An on/off lamp in the boxed pattern: the label is the lamp. Lit in foreground
|
||||
/// (highlight when [warn]), dark in subdued; missing shows as a dash.
|
||||
class Telltale extends StatelessWidget {
|
||||
const Telltale({
|
||||
super.key,
|
||||
required this.label,
|
||||
required this.reading,
|
||||
this.warn = false,
|
||||
this.flex = 1,
|
||||
});
|
||||
|
||||
final String label;
|
||||
final Reading reading;
|
||||
final bool warn;
|
||||
final int flex;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = AppTheme.of(context);
|
||||
final missing = reading.value == null;
|
||||
final lit = reading.on && !reading.dim;
|
||||
final color = lit
|
||||
? (warn ? p.highlight : p.foreground)
|
||||
: p.subdued.withValues(alpha: missing ? 0.35 : 0.6);
|
||||
return Expanded(
|
||||
flex: flex,
|
||||
child: LayoutBuilder(
|
||||
builder: (context, c) {
|
||||
final size = c.maxHeight * 0.3;
|
||||
return Center(
|
||||
child: Text(
|
||||
missing ? '—' : label,
|
||||
style: TextStyle(
|
||||
fontSize: size,
|
||||
fontWeight: lit ? FontWeight.w700 : FontWeight.w400,
|
||||
color: color,
|
||||
letterSpacing: 1,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// The dash's own thin top line: link state, back, and the dark/bright switch.
|
||||
class _DashBar extends StatelessWidget {
|
||||
const _DashBar({required this.boundary, required this.themes});
|
||||
final Boundary boundary;
|
||||
final Themes themes;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = AppTheme.of(context);
|
||||
final (text, color) = switch (boundary.state) {
|
||||
LinkState.up => ('LINK', p.subdued),
|
||||
LinkState.connecting => ('CONNECTING', p.highlight),
|
||||
LinkState.down => ('NO LINK', p.highlight),
|
||||
};
|
||||
return SizedBox(
|
||||
height: 40,
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).maybePop(),
|
||||
icon: Icon(Icons.arrow_back, color: p.subdued),
|
||||
),
|
||||
Text(text, style: TextStyle(color: color, letterSpacing: 2)),
|
||||
const Spacer(),
|
||||
IconButton(
|
||||
tooltip: themes.isDark ? 'Bright' : 'Dark',
|
||||
onPressed: themes.toggle,
|
||||
icon: Icon(
|
||||
themes.isDark ? Icons.light_mode : Icons.dark_mode,
|
||||
color: p.subdued,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user