Dialog-Steuerelement (in der Prüfung)

[Dieser Artikel ist Teil der Dokumentation zur Vorschauversion und kann geändert werden.]

Ein Steuerelement zum Gruppieren von Inhalten.

Dialogfeld-Steuerelement.

Important

  • Dies ist eine Funktion, die in Prüfung ist.
  • Vorschaufunktionen sind nicht für den Produktionsgebrauch gedacht und verfügen möglicherweise über eingeschränkte Funktionalität. Diese Features sind vor einer offiziellen Veröffentlichung verfügbar, damit Kunden frühzeitigen Zugriff erhalten und Feedback geben können.

Description

Ein Dialogfeld ist ein temporäres Popup-Fenster, das den Fokus von der Seite oder App nimmt und erfordert, dass man damit interagiert. Es wird hauptsächlich zum Bestätigen von Aktionen verwendet, z. B. zum Löschen einer Datei oder zum Auffordern einer Auswahl.

Diese Canvas-Komponente ahmt den Stil und das Verhalten des Fluent UI-Dialogfeld-Steuerelements nach. In der Dokumentation finden Sie bewährte Methoden.

Komponente im Creator Kit GitHub-Repository anzeigen

Eigenschaften

Schlüsseleigenschaften

Eigentum Description
Buttons Ein Dataset, das die Schaltflächen definiert (weitere Informationen zu Schaltflächeneigenschaften).
Title Text, der im Titelbereich angezeigt wird.
OverlayColor Im Überlagerungsbereich angezeigte Farbe.
DialogWidth Die Breite des Dialogfelds (nicht zu verwechseln mit der Steuerelementbreite, die die App-Breite umfassen soll).
DialogHeight Die Höhe des Dialogfelds (nicht zu verwechseln mit der Steuerelementhöhe, die der App-Höhe entsprechen sollte).
SubTitle Unter dem Titel angezeigter Text

Schaltflächeneigenschaften

Eigentum Description
Label Die Beschriftung auf der Schaltfläche.
ButtonType Enumeration, die das Design der Schaltfläche festlegt. Wählen Sie zwischen Standard und Primary.
Table(
    {
        Label: "Cancel", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Standard 
    },{
        Label: "Ok", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Primary
    }
)

Stileigenschaften

Eigentum Description
Theme Design-Objekt Erfahren Sie mehr über Themen.

Erfahren Sie mehr über die Formatierung im Inhaltsabschnitt des Bereichs "Format" des Bereichs "Panel".

Ereigniseigenschaften

Eigentum Description
OnCloseSelect Aktionsausdruck, der ausgeführt wird, wenn die Schaltfläche "Schließen" ausgewählt ist.
OnButtonSelect Aktionsausdruck, der ausgeführt wird, wenn eine der Interaktiven Schaltflächen ausgewählt ist.

Verhalten

Dialogfeldsichtbarkeit konfigurieren

Machen Sie das Dialog Steuerelement selbst (oder die Oberfläche, in der es sich befindet) sichtbar, wenn sich eine boolesche Variable (true/false) in "true" ändert. Weisen Sie diese Variable der Sichtbarkeitseigenschaft des Dialogfelds zu. Um das Dialogfeld nach der Darstellung auszublenden, aktualisieren Sie die Variable für die Reset-Eigenschaft, die durch die Auswahl des Symbols 'Schließen' ausgelöst wird.

Nachfolgend sehen Sie die Power Fx-Formel zum Öffnen des Dialogfelds in einer Aktionsformel für eine andere Komponente irgendwo in der App (z. B. die OnSelect Eigenschaft einer Schaltfläche):

UpdateContext({ showHideDialog: true })

Nachfolgend sehen Sie die Power Fx-Formel, um das Dialogfeld in der OnCloseSelect-Eigenschaft des Dialogfelds zu schließen:

UpdateContext({ showHideDialog: false })

Weisen Sie die Variable der Visible-Eigenschaft des Dialogs zu:

showHideDialog

Schaltflächenaktionen konfigurieren

Stellen Sie in der OnButtonSelect-Eigenschaft des Dialogfelds Aktionen in einer If()- oder Switch()-Bedingung auf der Grundlage des Self.SelectedButton.Label-Textwerts bereit, um die Aktion festzulegen. Je nach Aktion kann es sinnvoll sein, das Dialogfeld auch nach Abschluss der Aktion zu schließen.

    If( Self.SelectedButton.Label = "Send", 
        Notify("Email Sent")
    );
    UpdateContext({ showHideDialog: false })

Limitations

Diese Canvas-Komponente kann nur in Canvas-Apps und benutzerdefinierten Seiten verwendet werden.