Anpassungsausrüstung in der Liste

• Tutorial

Die in Blau umrissenen Informationen können mit Javascript modifiziert werden.

Training

Die Bindung ist der Schritt, der die verbindet. 3D-Ansicht (grafische Objekte auf der Karte) an die DOM der Ausrüstung (beaufsichtigte Geschäftseinheiten). Konkret schaffen wir stabile Verbindungen zwischen einem visuellen Objekt und einem immersiven Gerät, sodass jede Aktion oder jede Daten (Zustand, Variable, Alarm) die gute visuelle Darstellung beeinflusst – und umgekehrt (Auswahl, Fokus, Ausrüstungsblätter).

Widget2D Überblick

Das Widget2D ist die Darstellung eines Geräts in der Benutzeroberfläche. Die Widget2D werden in der Liste der Geräte links neben dem Betrachter angezeigt.

Das Widget2D besteht aus drei verschiedenen Teilen:

• Der Titel: was standardmäßig den Namen der Ausrüstung darstellt
• Sein Untertitel: was standardmäßig die Familie der Geräte repräsentiert.
• Der Informationsteil: In Form eines Textes oder Mit einem Symbol gibt es schnelle Informationen über den Status der Ausrüstung. Standardmäßig ist es nicht befüllt. Sie kann zum Beispiel verwendet werden, um den Temperaturwert eines Temperatursensors darzustellen oder eine Tür ein Symbol für geschlossene oder offene Tür anzuzeigen.

Anpassung des Inhalts eines Widget2D

Durch die JS-Skripte können wir die im Widget2D sichtbaren Informationen verändern; dafür müssen wir nur die Funktion hinzufügen Customize.

// Modifies the content of widget2D and widget 3D for a given equipment.
function Customize(equipment, widget2d, widget3d)
{.
    Widget2D.text = "Hello World !";
}

Wenn diese Funktion in einem Skript vorhanden ist, wird sie jedes der von diesem Skript betroffenen Geräte aufgerufen, jedes Mal, wenn das Gerät verändert wird oder ein UI-Element in der Schnittstelle erscheint.

Die Funktion "Anpassen" stellt drei Parameter frei:

• Ausrüstung: Die Ausrüstung, die individuell angepasst werden soll
• widget2D: Das UI-Objekt zur Änderung der Darstellung der Geräte in allen 2D-Listen.
• widget3D: Das UI-Objekt, um die Darstellung der Ausrüstung in 3D zu verändern. (Diese Funktion wird im nächsten Tutorial vorgestellt)

Beschreibung des Widget2D-Objekts (bearbeitbare Felder):

• widget2D.title
  • Der fettgedruckte Titel oben im Widget
  • Format: String
  • Standard: Der Name der Ausrüstung
• widget2D.subtitle
  • Der Text unter dem Titel.
  • Format: String
  • Standard: Der Name der Gerätefamilie.
• widget2D.text
  • Informationstext oben rechts im Widget
  • Format: String
  • Standard: Keine.
• widget2D.textColor
  • Die Textfarbe widget2D.text
  • Format: Farbe
• widget2D.icon
  • Ein Symbol oben rechts im 2D-Widget. Wenn widget2D.text bereits gesetzt ist, ist das Symbol verborgen.
  • Format: Bild
  • Standard: leer, falls widget2D.text bereits definiert ist, ansonsten nimmt er das Standard-Symbol der Gerätefamilie an.
• widget2D.iconColor
  • Die Farbe, die auf widget2D.icon angewendet werden soll.
  • Format: Farbe
• widget2D.iconBackgroundColor
  • Die Hintergrundfarbe der Blase.
  • Format: Farbe
  • Standard: durchsichtig.

Widget2D-Beispiel zeigt Text an, um die Temperatur eines Sensors anzuzeigen

TODO

Widget2D-Beispiel Anzeige eines Symbols zur Darstellung des Status einer Tür

TODO 2