dashboard: replace vehicle sample text with gauges

firmware/esp32-s3-dashboard/dashboard_config.h

@@ -1,6 +1,6 @@
 #pragma once
 
-static const char *DASHBOARD_VERSION = "0.1.47-vehicle-card-newlines";
+static const char *DASHBOARD_VERSION = "0.1.48-vehicle-gauge-card";
 
 // Update these if your Cargo ESP AP credentials are different.
 static const char *CARGO_WIFI_SSID = "OverlandController";

firmware/esp32-s3-dashboard/esp32-s3-dashboard.ino

@@ -29,6 +29,12 @@ static lv_obj_t *wifi_icon_label = nullptr;
 static lv_obj_t *wifi_bars_obj[4] = {nullptr};
 static lv_obj_t *cargo_status_dot = nullptr;
 static lv_obj_t *outside_status_temp_label = nullptr;
+
+static lv_obj_t *vehicle_coolant_meter = nullptr;
+static lv_meter_indicator_t *vehicle_coolant_needle = nullptr;
+static lv_obj_t *vehicle_coolant_value_label = nullptr;
+static lv_obj_t *vehicle_fuel_bar = nullptr;
+static lv_obj_t *vehicle_fuel_value_label = nullptr;
 static lv_obj_t *relay_buttons[6] = {nullptr};
 static lv_obj_t *relay_button_labels[6] = {nullptr};
 
@@ -1129,19 +1135,77 @@ static void create_overland_overview_screen()
         lv_obj_align(temp_tile_name_labels[i], LV_ALIGN_TOP_MID, 0, 86);
     }
 
-    lv_obj_t *vehicle_label = lv_label_create(vehicle_card);
+    lv_obj_t *coolant_title = lv_label_create(vehicle_card);
-    lv_label_set_text(vehicle_label,
+    lv_label_set_text(coolant_title, "Coolant");
-        "Coolant 188\n"
+    lv_obj_set_style_text_color(coolant_title, lv_color_hex(0xDDE3EA), 0);
-        "Trans   --\n"
+    lv_obj_set_style_text_font(coolant_title, &lv_font_montserrat_26, 0);
-        "Fuel    --%\n"
+    lv_obj_align(coolant_title, LV_ALIGN_TOP_MID, 0, 10);
-        "4WD     --\n"
+
-        "Tilt    --"
+#if LV_USE_METER
-    );
+    vehicle_coolant_meter = lv_meter_create(vehicle_card);
-    lv_obj_set_style_text_color(vehicle_label, lv_color_hex(0xDDE3EA), 0);
+    lv_obj_set_size(vehicle_coolant_meter, 180, 180);
-    lv_obj_set_style_text_font(vehicle_label, &lv_font_montserrat_30, 0);
+    lv_obj_align(vehicle_coolant_meter, LV_ALIGN_TOP_MID, 0, 36);
-    lv_obj_set_width(vehicle_label, 260);
+    lv_obj_set_style_bg_opa(vehicle_coolant_meter, LV_OPA_TRANSP, 0);
-    lv_label_set_long_mode(vehicle_label, LV_LABEL_LONG_WRAP);
+    lv_obj_set_style_border_width(vehicle_coolant_meter, 0, 0);
-    lv_obj_align(vehicle_label, LV_ALIGN_CENTER, 0, 0);
+    lv_obj_clear_flag(vehicle_coolant_meter, LV_OBJ_FLAG_SCROLLABLE);
+
+    lv_meter_scale_t *coolant_scale = lv_meter_add_scale(vehicle_coolant_meter);
+    lv_meter_set_scale_range(vehicle_coolant_meter, coolant_scale, 100, 260, 270, 135);
+    lv_meter_set_scale_ticks(vehicle_coolant_meter, coolant_scale, 33, 2, 8, lv_color_hex(0x7D8996));
+    lv_meter_set_scale_major_ticks(vehicle_coolant_meter, coolant_scale, 4, 4, 12, lv_color_hex(0xDDE3EA), 8);
+
+    lv_meter_indicator_t *cool_arc = lv_meter_add_arc(vehicle_coolant_meter, coolant_scale, 5, lv_color_hex(0x84CAFF), 0);
+    lv_meter_set_indicator_start_value(vehicle_coolant_meter, cool_arc, 100);
+    lv_meter_set_indicator_end_value(vehicle_coolant_meter, cool_arc, 150);
+
+    lv_meter_indicator_t *hot_arc = lv_meter_add_arc(vehicle_coolant_meter, coolant_scale, 5, lv_color_hex(0xF97066), 0);
+    lv_meter_set_indicator_start_value(vehicle_coolant_meter, hot_arc, 220);
+    lv_meter_set_indicator_end_value(vehicle_coolant_meter, hot_arc, 260);
+
+    vehicle_coolant_needle = lv_meter_add_needle_line(vehicle_coolant_meter, coolant_scale, 4, lv_color_hex(0xFFFFFF), -14);
+    lv_meter_set_indicator_value(vehicle_coolant_meter, vehicle_coolant_needle, 188);
+#endif
+
+    vehicle_coolant_value_label = lv_label_create(vehicle_card);
+    lv_label_set_text(vehicle_coolant_value_label, "188°");
+    lv_obj_set_style_text_color(vehicle_coolant_value_label, lv_color_hex(0xFFFFFF), 0);
+    lv_obj_set_style_text_font(vehicle_coolant_value_label, &lv_font_montserrat_40, 0);
+    lv_obj_set_width(vehicle_coolant_value_label, 120);
+    lv_obj_set_style_text_align(vehicle_coolant_value_label, LV_TEXT_ALIGN_CENTER, 0);
+    lv_obj_align(vehicle_coolant_value_label, LV_ALIGN_TOP_MID, 0, 120);
+
+    lv_obj_t *fuel_title = lv_label_create(vehicle_card);
+    lv_label_set_text(fuel_title, "Fuel");
+    lv_obj_set_style_text_color(fuel_title, lv_color_hex(0xDDE3EA), 0);
+    lv_obj_set_style_text_font(fuel_title, &lv_font_montserrat_26, 0);
+    lv_obj_align(fuel_title, LV_ALIGN_BOTTOM_LEFT, 18, -38);
+
+    vehicle_fuel_bar = lv_bar_create(vehicle_card);
+    lv_obj_set_size(vehicle_fuel_bar, 150, 22);
+    lv_obj_align(vehicle_fuel_bar, LV_ALIGN_BOTTOM_LEFT, 80, -42);
+    lv_bar_set_range(vehicle_fuel_bar, 0, 100);
+    lv_bar_set_value(vehicle_fuel_bar, 72, LV_ANIM_OFF);
+    lv_obj_set_style_radius(vehicle_fuel_bar, 4, 0);
+    lv_obj_set_style_radius(vehicle_fuel_bar, 4, LV_PART_INDICATOR);
+    lv_obj_set_style_bg_color(vehicle_fuel_bar, lv_color_hex(0x17202A), 0);
+    lv_obj_set_style_bg_color(vehicle_fuel_bar, lv_color_hex(0x32D583), LV_PART_INDICATOR);
+    lv_obj_set_style_border_color(vehicle_fuel_bar, lv_color_hex(0x7D8996), 0);
+    lv_obj_set_style_border_width(vehicle_fuel_bar, 2, 0);
+
+    for (int i = 1; i <= 3; i++) {
+        lv_obj_t *tick = lv_obj_create(vehicle_card);
+        lv_obj_set_size(tick, 2, 28);
+        lv_obj_set_style_bg_color(tick, lv_color_hex(0xDDE3EA), 0);
+        lv_obj_set_style_border_width(tick, 0, 0);
+        lv_obj_set_style_radius(tick, 0, 0);
+        lv_obj_align(tick, LV_ALIGN_BOTTOM_LEFT, 80 + (i * 37), -39);
+    }
+
+    vehicle_fuel_value_label = lv_label_create(vehicle_card);
+    lv_label_set_text(vehicle_fuel_value_label, "72%");
+    lv_obj_set_style_text_color(vehicle_fuel_value_label, lv_color_hex(0xFFFFFF), 0);
+    lv_obj_set_style_text_font(vehicle_fuel_value_label, &lv_font_montserrat_30, 0);
+    lv_obj_align(vehicle_fuel_value_label, LV_ALIGN_BOTTOM_RIGHT, -16, -35);
 
     for (int i = 0; i < 6; i++) {
         relay_buttons[i] = lv_btn_create(relay_card);