Reaktionsfähige Benutzeroberfläche erstellen

Entwickeln Sie eine
FactoryTalk Optix-Anwendung
mit mehreren Layouts, die für Viewports unterschiedlicher Größe angepasst wurden.
  1. Erstellen Sie Bildschirmtypen für verschiedene Anwendungslayouts. Weitere Informationen finden Sie unter Bildschirm.
    TIPP: Beginnen Sie mit der Ausarbeitung von drei Layouts für verschiedene Viewports, wie beispielsweise klein, mittel und groß. Weitere Informationen finden Sie unter Bildschirmgrößen und Haltepunkte für responsives Design – Windows-Apps | Microsoft Learn.
  2. Erstellen Sie eine NetLogic, die die Fensterbreite (und -höhe) liest und einen Wert basierend auf den Haltepunkten ausgibt.
    Erstellen Sie beispielsweise eine NetLogic, die die Fensterbreite liest und einen
    Klein
    ,
    Mittel
    oder
    Groß
    -Enumerationswert zurückgibt.
    Wenn Sie die Größe des Fensters ändern und so die Haltepunktwerte überschreiten, gibt die NetLogic zur Laufzeit einen Wert zurück.
  3. Erstellen Sie einen Bereichslader mit einem Schlüssel-Wert-Konverter, der die von NetLogic ausgegebenen Werte in dynamische Links zu den Ziel-Bildschirmtypen übersetzt.
    Zur Laufzeit zeigt der Bereichslader je nach Fensterbreite einen bestimmten Bildschirmtyp an. Wenn Sie die Größe des Fensters ändern und dabei Haltepunktwerte überschreiten, ändert sich das Layout der Anwendung, um es an die verschiedenen Viewportgrößen anzupassen.
  4. (Optional) So führen Sie eine reaktionsfähige Anwendung in unterstützten Webbrowsern aus:
    1. Fügen Sie ein Web-Präsentationsmodul hinzu. Weitere Informationen finden Sie unter Präsentationsmodule konfigurieren.
    2. Strecken Sie das Projekt im Webbrowserfenster. Wählen Sie in der
      Projektansicht
      die Option
      MainWindow (type)
      aus und:
      • Erstellen Sie in
        Eigenschaften
        einen dynamischen Link zwischen
        Vollbild
        und
        Aliase
        {Sitzung}
        Sitzung
        Sitzung der Benutzeroberfläche
        Web-Sitzung
        .
        Weitere Informationen zu dynamischen Links finden Sie unter Dynamische Links erstellen.
        Der Alias
        {Session}/IsWeb
        wird in
        Wahr
        aufgelöst, wenn das Projekt in einem Webbrowser ausgeführt wird. Weitere Informationen finden Sie unter Profilobjekte für verschiedene Präsentationsmodule.
        Zur Laufzeit zeigt das native Präsentationsmodul eine fensterbasierte Anwendung und das Web-Präsentationsmodul einen bestimmten Bildschirmtyp basierend auf der Breite des Webbrowser-Fensters an.
      • Setzen Sie in
        Eigenschaften
        die Option
        Vollbild
        auf
        Wahr
        .
        Zur Laufzeit zeigt das native Präsentationsmodul eine Vollbildanwendung und das Web-Präsentationsmodul einen bestimmten Bildschirmtyp basierend auf der Breite des Webbrowser-Fensters an.
    Wenn Sie die Größe des Webbrowser-Fensters ändern und dabei Haltepunktwerte überschreiten, ändert sich das Layout der Anwendung, um es an die verschiedenen Viewportgrößen anzupassen.
Rückmeldung geben
Haben Sie Fragen oder Feedback zu dieser Dokumentation? Bitte geben Sie hier Ihr Feedback ab.