Raspberry Pi als digitaler Bilderrahmen im Kiosk-Modus – Hardware, Setup & Troubleshooting

External displayIch hatte die verrückte Idee, einen digitalen Bilderrahmen zu bauen um darauf das immer aktuellste Foto meiner Allsky-Kamera anzeigen zu lassen. Auslöser war vor allem die Erkenntnis, dass es bei indi-allsky mit Redirect Views total einfach ist, das immer aktuellste Bild ausspielen zu lassen. Und die zweite Erkenntnis: Touch-Displays sind gar nicht mal so teuer.

In diesem Beitrag dokumentiere ich ein praxiserprobtes Setup mit Raspberry Pi 4, HDMI-Touchdisplay und Chromium im echten Kiosk-Modus – inklusive typischer Stolperfallen und deren Lösungen.

Hardware-Setup

Für das Setup wurden folgende Komponenten verwendet:

  • Raspberry Pi 4 (2–8 GB RAM)
  • HDMI-Touchdisplay (10,1 Zoll, 1280×800) – gibt es z.B. beim großen chinesischen Online-Händler – Detailinfos hier
  • MicroSD-Karte (mind. 32 GB)
  • Getrennte Stromversorgung für Raspberry Pi und Display
  • USB-Touchkabel + HDMI-Kabel

Anders als vom Hersteller angegeben nutze ich weder ein Y-Kabel noch eine Durchschleiflösung für die Stromversorgung von Pi und Display sondern ein Dual-Port-Netzteil (USB-C für den Pi, USB-A/Micro-USB für das Display).

Betriebssystem und Basis-Konfiguration

Als Betriebssystem kommt Raspberry Pi OS Lite (Bookworm/Trixie) zum Einsatz. Das System läuft headless, Xorg wird ausschließlich für den Kiosk gestartet.

sudo apt update
sudo apt install --no-install-recommends xserver-xorg xinit chromium x11-xserver-utils xbanish

SSH sollte aktiviert sein, um das System auch ohne angeschlossenen Monitor administrieren zu können.

Auflösung und HDMI-Konfiguration

Das Display arbeitet mit einer nativen Auflösung von 1280×800. Unter modernen Raspberry-Pi-Versionen mit KMS/DRM wird die Auflösung zuverlässig über den Kernel gesetzt.

In /boot/firmware/cmdline.txt wird am Ende der (einzeiligen!) Konfiguration ergänzt:

video=HDMI-A-1:1280x800@60

Damit wird sichergestellt, dass Kernel, Xorg und Chromium konsistent mit der nativen Displayauflösung arbeiten.

Kiosk-Start mit Xorg und Chromium

Der eigentliche Kiosk-Start erfolgt über eine eigene .xinitrc. Chromium wird dabei als einziger Prozess per exec gestartet.

#!/bin/sh

unset SESSION_MANAGER
unset DBUS_SESSION_BUS_ADDRESS

xset s off
xset s noblank
xset +dpms
xset dpms 0 0 600

xbanish &
sleep 1

exec /usr/bin/chromium \
  --kiosk \
  --window-size=1280,800 \
  --window-position=0,0 \
  --force-device-scale-factor=1 \
  --noerrdialogs \
  --disable-session-crashed-bubble \
  --disable-infobars \
  --disable-translate \
  --disable-features=TranslateUI \
  --lang=de-DE \
  --disable-pinch \
  --overscroll-history-navigation=0 \
  --disable-features=TouchpadOverscrollHistoryNavigation \
  --disable-component-update \
  --disable-background-networking \
  --disable-sync \
  --disable-default-apps \
  --disable-extensions \
  --disable-popup-blocking \
  --disable-notifications \
  --autoplay-policy=no-user-gesture-required \
  file:///home/dante/kiosk/index.html

Damit startet Chromium direkt im Vollbild ohne UI, ohne Zoom-Effekte und ohne sichtbare Ränder. xbanish deaktivert den Mauszeiger.

HTML-Wrapper für den Bilderrahmen

Der Bilderrahmen selbst wird über eine lokale HTML-Datei gesteuert. Diese lädt ein Bild (oder eine URL) und aktualisiert es zyklisch. hostname.local müsst ihr bitte gegen euren Hostnamen austauschen.

<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=1280, height=800, initial-scale=1.0, user-scalable=no">

  <title>Kiosk</title>

  <style>
    html, body {
      margin: 0;
      padding: 0;
      width: 1280px;
      height: 800px;
      overflow: hidden;
      background: black;
    }

    img {
      display: block;
      width: 1280px;
      height: 800px;
      object-fit: contain;
    }
  </style>
</head>
<body>

  <img
    id="image"
    src="https://access.allsky-rodgau.de/indi-allsky/latestimage"
    alt="Allsky Image"
  >

  <script>
    setInterval(() => {
      const img = document.getElementById('image');
      img.src = 'https://access.allsky-rodgau.de/indi-allsky/latestimage?ts=' + Date.now();
    }, 20000);
  </script>

</body>
</html>

Chromium-Übersetzungs-Popup dauerhaft deaktivieren

In Chromium gibt es ein relativ nerviges Übersetzungs-Popup, dieses habe ich deaktiviert. Neuere Chromium-Versionen ignorieren reine Startflags teilweise. Die zuverlässigste Methode ist daher eine systemweite Policy.

sudo mkdir -p /etc/chromium/policies/managed
sudo nano /etc/chromium/policies/managed/disable-translate.json
{
  "TranslateEnabled": false,
  "TranslateForceTriggerOnLanguageDetection": false,
  "DefaultLanguages": ["de"],
  "AcceptLanguages": ["de", "de-DE"]
}

Nach einem Neustart erscheinen keinerlei Sprach- oder Übersetzungsdialoge mehr.

Energiesparmodus für das Display

Über DPMS lässt sich das Display nach Inaktivität automatisch abschalten. Touch oder Eingabe wecken es sofort wieder auf.

xset +dpms
xset dpms 0 0 600

Im Beispiel schaltet sich das Display nach 10 Minuten aus.

Optionales Troubleshooting

Kein Bild oder falsche Auflösung:

DISPLAY=:0 xrandr

Chromium startet nicht:

which chromium
journalctl -b | grep chromium

SSH reagiert verzögert:
Nach Kernel- oder Grafikänderungen kann der erste Boot deutlich länger dauern. Geduld! 2–3 Minuten sind normal.

Schwarze Ränder im Kiosk:
Fast immer ein Chromium-Viewport-Thema. Lösung: feste Fenstergröße per --window-size und keine Verwendung von vw/vh im CSS.

Hat dir dieser Beitrag gefallen?

Du kannst allsky-rodgau.de mit einem kleinen Kaffee auf BuyMeACoffee unterstützen.

Jetzt Kaffee spendieren!