Embedded-App-Shell

hex-browser als Embedded App Shell für Flutter, Web-Apps, QML und RTSP-Streams

hex-browser ist eine Embedded-App-Shell für Systeme, die eine stabile und zielgerichtete Benutzeroberfläche brauchen. Auf Basis des Qt-6/QML-Stacks unterstützt er mehrere Tabs und vereint natives Flutter, Web-Apps, QML-Apps, <so>-Plugins und RTSP-Streams, sodass Anwendungsteams in ihrem eigenen Ökosystem bleiben können, statt die komplette Embedded-UI für jedes Gerät neu aufzubauen.

Embedded-App-ShellKiosk-Shell mit mehreren TabsOptimiert für Low-RAM-ZieleWeb-Apps inklusive
  • App-Shell: Eine einzige Shell für Bedienpanels, lokale Anwendungen, Service-Tools, Remote-Inhalte und Fullscreen-Web-Workflows.
  • Low-Memory-Tuning für Embedded: Hintergrund-Tabs können verworfen werden, die Renderer-Prozesszahl ist begrenzt, und Chromium-Low-End-Flags werden für knappe Hardware aktiviert.
  • Ökosystem und Service: Entwickler bleiben in ihrem eigenen Anwendungs-Ökosystem, während VNC, Watchdog-Integration, Startup-Splash, Tastatur-Steuerung, Popup-Policy und Dark-Mode in der Shell bleiben.

App-Shell zuerst, Browser inklusive

hex-browser ist weniger als Browser-Wrapper zu verstehen, sondern vielmehr als Embedded App Shell und Kiosk-Starter. Web-Apps sind dabei nur ein unterstützter Inhaltspfad neben nativem Flutter, QML-Szenen, .so-Plugins und RTSP-Streams.

Eine Konfiguration, gemischte Inhalte

Dasselbe Deployment kann natives Flutter, Remote-Web-Anwendungen, lokale QML-Apps, pluginbasierten nativen Code und Live-Video-Feeds kombinieren, ohne die Shell zu wechseln.

Konfigurationsumfang für den Feldeinsatz

Fullscreen-Verhalten, Rotation, Popup-Policy, persistenter Speicher, Navbar-Verhalten, Tastatur-Handling, Screenshots, VNC und Debug-Schalter werden zentral über die Konfiguration gesteuert. In Kombination mit ttmdaemon erweitert sich der steuerbare Konfigurationsumfang deutlich.

Web-App-Darstellung im hex-browser
Web-Apps bei Bedarf
Integrierte Web-Engine, Popups und Fullscreen-Kontrolle
Web-Apps bleiben ein unterstützter Inhaltspfad innerhalb derselben Shell. hex-browser stellt dafür eine eingebettete Web-Engine bereit und unterstützt dynamische Tabs, Navigation, Overlay-Dialoge sowie kiosk-spezifisches Popup- und Fullscreen-Verhalten.
QML-Apps und native Plugins
QML-Apps und native Plugins
Lokales oder entferntes QML plus native .so-Plugins
hex-browser kann Web-Views, QML-Views und native Erweiterungen in einer gemeinsamen Shell zusammenführen. Native Plugins werden als .so-Bibliotheken eingebunden und ermöglichen projektspezifische Erweiterungen, ohne die gesamte Bedienoberfläche neu aufzubauen.
Natives Flutter Plugin im hex-browser
Natives Flutter Plugin
Flutter-Oberflächen direkt in der Shell
Flutter-basierte Bedienoberflächen laufen nativ über ein Plugin hinter der Shell. Sie bleiben echte Flutter-Anwendungen und werden nicht als klassischer Browser-Tab gerendert.
RTSP- und RTSPS-Streams im hex-browser
RTSP/RTSPS-Streams
Live-Video für Kamera- und Monitoring-Szenarien
RTSP- und RTSPS-Quellen können als eigene Inhaltspfade direkt in der Shell angezeigt werden. So lassen sich Kamera-Feeds, Monitoring-Ansichten und Medienquellen kontrolliert in Kiosk-Workflows einbinden.
Embedded-Integration und Robustheit im hex-browser mit ttmdaemon, VNC und Watchdog
Embedded-Integration und Robustheit
ttmdaemon, VNC, Watchdog und Reset-Schwellen
Teams können sich auf ihr eigenes Code-Ökosystem konzentrieren, während hex-browser das Kiosk-Verhalten übernimmt. In Kombination mit ttmdaemon entstehen stabile Schnittstellen für Konfiguration, Startverhalten, Recovery und Servicezugang – von der Inbetriebnahme bis zum Betrieb im Feld.

Vorbereitet für echte Bedienoberflächen

hex-browser passt zu Umgebungen, in denen Bediener einen dedizierten Ablauf, klare Zustände und vorhersagbares Recovery brauchen.

Industrielle Maschinensteuerung im hex-browser

Industrielle Maschinensteuerung

Maschinen-HMIs, Linien-Dashboards, Alarmzustände und touch-orientierte Bedienoberflächen für die Industrieautomation.

Haus- und Gebäudeautomation im hex-browser

Haus- und Gebäudeautomation

Wall Panels, Energie-Dashboards, Raumsteuerung und Orchestrierung vernetzter Geräte mit einer dedizierten Kiosk-Oberfläche.

Browser-im-Browser-Workflows im hex-browser

Browser-im-Browser-Workflows

Verschachtelte Web-Tools, Service-Konsolen und kontrollierte Popup-Flows innerhalb einer verwalteten Kiosk-Shell.

Feature-Screencast im hex-browser

Feature-Screencast

Eine saubere Bühne für Navigation, Tab-Wechsel, Plugin-Laden, Remote-Zugriff und weitere Browser-Funktionen in Bewegung.

Für unbeaufsichtigte Geräte gebaut

Die aktuelle Codebasis ist klar auf Embedded-App-Hosting statt auf allgemeines Desktop-Browsing ausgelegt. Low-End-Chromium-Flags werden früh gesetzt, Betriebsverhalten ist konfigurierbar, und Recovery-Pfade sind für langlaufende Kiosk-Installationen gedacht.

  • Hintergrund-Web-Tabs können verworfen werden, um WebEngine-RAM auf knappen Targets gezielt freizugeben.
  • Qt WebEngine startet mit begrenzter Renderer-Prozesszahl, Low-Res-Tiling und Low-End-Device-Mode für Embedded-Hardware.
  • Die Konfiguration deckt Fullscreen, Rotation, virtuelle Tastatur, persistenten Web-Speicher, Screenshot-Pfade, Popup-Policy und Remote-Debugging ab.
  • Optionaler VNC-Service, systemd-Watchdog-Integration, Reset-Schwellen-Monitoring und das breitere ttmdaemon-Setup vereinfachen Inbetriebnahme und Service im Feld.

Plugins und Erweiterungspfad

hex-browser stellt einen nativen Plugin-Pfad bereit, damit Teams die Shell für ihre eigenen Geräte, Protokolle, Medienpfade und Anwendungsmodelle erweitern können.

Plugins und Erweiterungspfad
Referenz-Plugin auf GitHub

Das öffentliche Beispiel-Repository zeigt den Einstiegspfad über das HexBrowserPluginInterface für native Erweiterungen und QML-basierte Plugin-UIs.

Beispiel-Repository öffnen
Natives Flutter-Plugin

Flutter wird als natives Plugin hinter der Shell integriert. Für das Anwendungsteam bleibt es eine Flutter-Anwendung und keine Browser-App.

Plugins für den eigenen Stack

Über <so> geladene Plugins erlauben die Integration von eigenen Protokollen, Geräte-Steuerung, Medienpipelines oder projektspezifischen Anwendungen in dieselbe Shell.

Unterstützte Inhaltspfade

Die Routing-Schicht unterscheidet die wichtigsten Inhaltstypen direkt anhand der konfigurierten URL.

Web-Appshttp://- und https://-Inhalte werden in der integrierten Chromium-basierten Web-View gerendert.
QML-ViewsLokales dateibasiertes QML oder entfernte <qml>-URLs werden in eine dedizierte QML-View geroutet.
Native PluginsNative Plugins werden über <so>...-URLs oder dateibasierte .so-Pfade via hex-browser-Plugin-Schnittstelle geladen.
RTSP-Streamsrtsp://- und rtsps://-Quellen werden direkt in Kiosk-Tabs für Live-Kamera- und Monitoring-Szenarien angezeigt.

JSON-Konfigurationsreferenz aus dem Sourcecode

Diese Tabelle basiert auf den Schluesseln, die im aktuellen hex-browser-Sourcecode wirklich verdrahtet sind, nicht nur auf der Beispielkonfiguration. Sie deckt Startup-Keys, Tab-Parsing, Runtime-UI, WebEngine-Verhalten, Persistenz, VNC und Recovery-Schalter ab.

Source-Basis: gui/main.qml, gui/PanelView.qml, gui/Custom*View.qml, misc.cpp, StartupLogoResolver.cpp.

Tabs und Routing

Diese Keys definieren, welche Tabs existieren und wie hex-browser jede konfigurierte Quelle auf Web-View, QML-View, natives Plugin oder RTSP-Player mappt.

Shell, Navbar und Bedienwerkzeuge

Diese Keys formen die Kiosk-Shell selbst: Navigationsverhalten, visuelle Gestaltung, Tab-Icons und Bediener-Schaltflaechen.

Tastatur, Gesten und Input-Handling

Diese Keys justieren die virtuelle Tastatur, das Swipe-Modell und das Pointer-Verhalten fuer Touch-Geraete.

WebEngine- und View-Verhalten

Diese Top-Level-Keys werden in jede erzeugte View geschrieben. Im aktuellen Sourcecode haben die meisten davon konkrete Wirkung auf Chromium-Web-Tabs; Plugin-, QML- und RTSP-Tabs spiegeln die gleiche Property-Oberflaeche vor allem der Konsistenz halber.

Storage, Helligkeit, Timer und Lifecycle

Diese Keys beeinflussen Persistenz, Screenshots, Backlight-Verhalten, Tab-Lifecycle und screensaverbezogene Timer.

Startup, Systemintegration und Splashscreen

Diese Keys werden frueh beziehungsweise beim Booten ausgewertet und beeinflussen Umgebungssetup, Rotation, Farbschema, Splash-Handling und Debugging.

Reload-, VNC- und Resilience-Steuerung

Diese Keys steuern automatische Aktualisierung, Remote-Service-Zugriff und schwellenwertgesteuertes Recovery-Verhalten.