Improve gauge grid layout

2026-07-07 23:00:49 +01:00
parent ceba71927d
commit 44403bea2b
6 changed files with 260 additions and 10 deletions
--- a/examples/layout_grid.py
+++ b/examples/layout_grid.py
@@ -0,0 +1,64 @@
+# pyright: reportGeneralTypeIssues=false
+
+import dearpygui.dearpygui as dpg
+
+import dpg_gauges as dpgg
+
+
+def main() -> None:
+    dpg.create_context()
+    try:
+        with dpg.window(label="Grid layout", width=820, height=620):
+            dpg.add_text("Three-column grid: fixed column cap, automatic rows")
+            with dpgg.gauge_panel(label="Wide panel", width=-1, height=270), dpgg.gauge_grid(
+                columns=3, min_column_width=190
+            ):
+                dpgg.analog_gauge(
+                    tag="grid_rpm", label="RPM", value=4200, max_value=8000, height=190
+                )
+                dpgg.digital_gauge(
+                    tag="grid_speed", label="Speed", value=88, unit="km/h", height=90
+                )
+                dpgg.bar_gauge(
+                    tag="grid_boost", label="Boost", value=12.5, max_value=30, unit="psi"
+                )
+                dpgg.status_light(tag="grid_ecu", label="ECU", state=True, height=70)
+                dpgg.battery_gauge(tag="grid_battery", label="Battery", value=74, height=160)
+
+            dpg.add_spacer(height=8)
+            dpg.add_text("Narrow panel: columns=3 auto-reduces to avoid horizontal scrolling")
+            with dpgg.gauge_panel(label="Narrow panel", width=390, height=250), dpgg.gauge_grid(
+                columns=3, min_column_width=180
+            ):
+                for index, value in enumerate((18, 42, 67, 91, 55), start=1):
+                    dpgg.digital_gauge(
+                        tag=f"narrow_{index}",
+                        label=f"Metric {index}",
+                        value=value,
+                        unit="%",
+                        height=72,
+                    )
+
+            dpg.add_spacer(height=8)
+            dpg.add_text("Panels can also occupy grid cells")
+            with dpgg.gauge_grid(columns=2, min_column_width=240):
+                with dpgg.gauge_panel(label="Left cell", height=120):
+                    dpgg.segmented_gauge(tag="left_segments", label="Load", value=70, height=80)
+                with dpgg.gauge_panel(label="Right cell", height=120):
+                    dpgg.multi_value_gauge(
+                        tag="right_values",
+                        label="Sensors",
+                        values={"oil": 82, "fuel": 64, "air": 31},
+                        height=92,
+                    )
+
+        dpg.create_viewport(title="dpg-gauges grid layout", width=860, height=660)
+        dpg.setup_dearpygui()
+        dpg.show_viewport()
+        dpg.start_dearpygui()
+    finally:
+        dpg.destroy_context()
+
+
+if __name__ == "__main__":
+    main()