In diesem Teil der Serie installieren wir Kivy, erstellen das Grundlayout unserer App und integrieren zwei Live‑Labels, die Temperatur und Luftfeuchtigkeit anzeigen. Das Layout wird vollständig in einer .kv‑Datei definiert. Beim Start initialisiert die App automatisch die Datenbank und legt Beispieldaten an.

1. Ziel dieses Artikels

Wir bauen das Grundgerüst der App:

• Kivy installieren
• Layout in .kv definieren
• zwei Live‑Labels über der Grafik anzeigen
• Platzhalter für das Diagramm einfügen
• Datenbank beim Start automatisch initialisieren

Die Live‑Labels werden in Artikel 5 mit echten Werten gefüllt.

2. Kivy installieren

2.1 venv aktivieren (Beispiel Windows, PyCharm‑Terminal)

venv\Scripts\activate

2.2 Kivy + Windows‑Dependencies installieren

pip install "kivy[base]" kivy-deps.sdl2 kivy-deps.glew kivy-deps.angle

Linux/Raspberry Pi:

pip install kivy

3. .kv‑Layout erstellen

Erstelle:

nano visualizer.kv

Inhalt:

BoxLayout:
    orientation: "vertical"
    padding: 10
    spacing: 10

    BoxLayout:
        orientation: "horizontal"
        size_hint_y: 0.15
        spacing: 20

        Label:
            id: temp_label
            text: "Temperatur: -- °C"
            font_size: "20sp"

        Label:
            id: hum_label
            text: "Luftfeuchtigkeit: -- %"
            font_size: "20sp"

    BoxLayout:
        id: graph_container
        size_hint_y: 0.75

    Button:
        text: "Aktualisieren"
        size_hint_y: 0.1
        on_release: app.update_plot()

Was hier passiert:

• Zwei Live‑Labels oben (Temperatur & Luftfeuchtigkeit)
• graph_container als Platzhalter für das Diagramm
• Button, der später das Diagramm neu lädt

4. Python‑App erstellen

Erstelle:

nano VisualizerApp.py

Inhalt:

from kivy.app import App
from kivy.lang import Builder
from db_init import initialize_database


class VisualizerApp(App):
    def build(self):
        # Datenbank initialisieren (Artikel 3)
        initialize_database()

    def update_plot(self):
        # Wird in Artikel 5 implementiert
        print("Diagramm wird in Artikel 5 implementiert.")


if __name__ == "__main__":
    VisualizerApp().run()

5. Ausblick auf Artikel 5

Im nächsten Artikel:

• binden wir Matplotlib ein
• setzen das Diagramm in graph_container
• aktualisieren die Live‑Labels
• nutzen Clock.schedule_interval() für automatische Updates