Button

Schaltflächen ermöglichen Benutzern, mit einem einzigen Tippen Aktionen auszuführen und Auswahlen zu treffen.

Ausgefüllte Schaltfläche

Ausgefüllte Schaltflächen haben eine hohe Betonung und zeichnen sich durch die Verwendung von Erhöhung und Füllung aus. Sie enthalten Aktionen, die für Ihre App primär sind.

 New-UDButton -Variant 'contained' -Text 'Default'

Umrandete Schaltfläche

Umrandete Schaltflächen sind Schaltflächen mittlerer Betonung. Sie enthalten Aktionen, die wichtig sind, aber nicht die primäre Aktion in einer App darstellen.

New-UDButton -Variant 'outlined' -Text 'Default'

Schaltflächengröße steuern

Sie können die Pixelgröße einer Schaltfläche anhand der Pixelgröße mit dem Parameter Style steuern

New-UDButton -Id "Submit" -Text "Submit" -Style @{ Width = "150px"; Height = "100px" }

Schaltflächen mit Symbolen und Bezeichnung

Manchmal möchten Sie für bestimmte Schaltflächen Symbole verwenden, um die UX der Anwendung zu verbessern, da wir Logos leichter erkennen als reinen Text. Wenn Sie zum Beispiel eine Löschen-Schaltfläche haben, können Sie sie mit einem Mülleimer-Symbol kennzeichnen.

New-UDButton -Icon (New-UDIcon -Icon trash) -Text 'Delete'

Schaltflächen mit Event-Handlern

Sie können einen Skriptblock angeben, der ausgeführt wird, wenn die Schaltfläche geklickt wird

New-UDButton -Text 'Message Box' -OnClick {
    Show-UDToast -Message 'Hello, world!'
}

Lade-Schaltfläche

Lade-Schaltflächen zeigen ein Ladesymbol an, während ein Event-Handler ausgeführt wird. Dies ist bei länger laufenden Veranstaltungen nützlich.

New-UDButton -Text 'Message Box' -OnClick {
    Show-UDToast -Message 'Hello, world!'
    Start-Sleep 10
} -ShowLoading

Schaltflächengruppe

Eine Schaltflächengruppe erzeugt eine Schaltfläche mit einem Dropdown-Menü. Diese wird auch als geteilte Schaltfläche bezeichnet.

New-UDButtonGroup -Children {
    New-UDButtonGroupItem -Text "Button 1" -OnClick {
        Show-UDToast "Button 1"
    }
    New-UDButtonGroupItem -Text "Button 2" -OnClick {
        Show-UDToast "Button 2"
    }
    New-UDButtonGroupItem -Text "Button 3" -OnClick {
        Show-UDToast "Button 3"
    }
}

Schaltflächengruppe

Schaltfläche nach Klick deaktivieren

Dieses Beispiel verwendet Set-UDElement, um die Schaltfläche nach dem Ausführen einer Aktion zu deaktivieren.

New-UDButton -Id "btn1" -OnClick {
    Show-UDToast "Hello!"
    Set-UDElement -Id 'btn1' -Attributes @{
        disabled = $true
    }
}

API

• New-UDButton