Mein Gebäude – Lampensteuerung

• Tutorial

Tutorial

Dieses Kapitel beschreibt die Überwachung und Kontrolle von Lampen in einem Gebäude. Es zeigt die Individualisierung ihrer visuellen Darstellung im digitalen Zwilling sowie die Implementierung von Steuerungen, um die Lampen ein- oder auszuschalten Direkt aus der Benutzeroberfläche.

In den meisten Installationen ist die Lampenaufsicht vorhanden und bildet Der Hauptvektor der Befehle, die von der Software an die Ausrüstung gesendet werden um das Ein- und Ausschalten zu steuern.

In diesem Tutorial sehen wir, wie man die Lampenanzeige individuell anpassen kann in der App, abhängig von ihrem Status sowie Einstellungsbuttons wodurch Befehle an die Lampen gesendet werden konnten.

Funktionale Ziele

1. Färbung der Geräteblase entsprechend dem Beleuchtungsstatus einer Lampe
2. Es wurde eine Quick Action-Taste hinzugefügt, um einen Befehl zum Ein- oder Ausschalten einer Lampe zu senden

Voraussetzungen

• Erstellung eines familienbezogenen Verhaltensskripts Light
• Vereinigung der Light zu einer Blase von Geräten im digitalen Zwilling

Färbung der Geräteblase entsprechend dem Beleuchtungsstatus einer Lampe

Um das uns gesetzte Ziel zu erreichen, müssen wir nur umsetzen Die Funktion Customize, bereits zuvor gesehen.

Der erste Schritt besteht darin, den Zustand der Variablen abzurufen Light um festzustellen, ob die Lampe an oder aus ist.

Das Grundstück icon Das Widget-Symbol ermöglicht es, das angezeigte Symbol zu ändern durch die Ausrüstung. Der Iconname muss mit einem Bild-Asset übereinstimmen Zuvor wurde er unserer Organisation hinzugefügt.

Das Grundstück iconBackgroundColor So kannst du die Hintergrundfarbe des Symbols ändern. Es ist möglich, einen Farbnamen oder direkt eine Farbe im hexadezimalen Format weiterzugeben.

function Customize(equipment, w2d, w3d)
{
  let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

  // Modification de l'icône et de la couleur de fond en fonction de l'état de la lumière
  w3d.icon = isOn ? "Icon Lamp_On" : "Icon Lamp_Off";
  w3d.iconBackgroundColor = isOn ? "yellow" : "";
}

Es wurde eine Schnellaktionstaste hinzugefügt, um einen Befehl zum Ein- und Ausschalten einer Lampe zu senden.

Um einen Button zum Bestellen hinzuzufügen, Wir müssen etwas Code zur Funktion hinzufügen Customize.

Das Grundstück quickAction Widgets ermöglicht es, Buttons hinzuzufügen Schnelle Interaktion, die so beschriftet ist, dass sie mit dem Text der Schnellaktion übereinstimmt.

In unserem Fall hängt der Text der Aktion vom Zustand der Lampe ab:

• Stromabschaltung
• Einschalten

Dann fügen wir die ExecuteQuickAction, Das wird aufgerufen, wenn der Nutzer auf den Button klickt.

Unsere Implementierung ruft den Endpunkt auf /api/Scene von unserem Server indem der Körper gesendet wird, der den notwendigen Parametern entspricht um das Licht an- oder auszuschalten.

Die beiden Versprechen then und catch Erlauben Sie uns, sie zu zeigen Nachrichten, wenn der Endpunkt eine Antwort zurückgibt. um den Benutzer über die korrekte oder falsche Ausführung des Auftrags zu informieren.

JS-Skript:

function Customize(equipment, w2d, w3d)
{
  let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

  // Affichage du bouton QuickAction avec le bon label
  w2d.quickAction = w3d.quickAction = isOn ? "Eteindre" : "Allumer";

  // Modification de l'icône et de la couleur de fond en fonction de l'état de la lumière
  w3d.icon = isOn ? "Icon Lamp_On" : "Icon Lamp_Off";
  w3d.iconBackgroundColor = isOn ? "yellow" : "";
}

// Implémentation de la QuickAction pour l'allumage/exctinction des lumières
function ExecuteQuickAction(equipment)
{
    let isOn = equipment.GetVariable("LIGHT").AsInt > 0;

    let serverUrl = "https://localhost:7003";

    // Construction du body à envoyer au endpoint
    let body = {
        sceneName : "Corridor Light",
        action : isOn ? "off ": "on"
    };

    // Envoi de la requète au endpoint server/api/Scene
    WebRequestProvider.Post(serverUrl + `/api/Scene`, JSON.stringify(body))
    .Then(response =>
    {
        // Affichage d'un toast de succès et récupération des données
        Immersive.Toaster.ToastSuccess("Commande éclairage Ok");
        Immersive.Hub.ObserveSingleUpdate();
    })
    .Catch(error =>
    {
        // Affichage d'une erreur en cas de problème
        Immersive.App.ShowPopup("Commande éclairage", "La commande n'a pas pu être effectuée");
    });
}