Pulsante

I pulsanti consentono agli utenti di eseguire azioni ed effettuare scelte con un solo tocco.

Pulsante contained

I pulsanti contained hanno un'enfasi alta e si distinguono per l'uso dell'elevazione e del riempimento. Contengono le azioni principali della sua app.

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

Pulsante outlined

I pulsanti outlined hanno un'enfasi media. Contengono azioni importanti, ma che non sono l'azione principale di un'app.

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

Controllare la dimensione del pulsante

È possibile controllare la dimensione in pixel di un pulsante utilizzando il parametro Style

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

Pulsanti con icone ed etichetta

A volte potrebbe voler inserire icone in determinati pulsanti per migliorare la UX dell'applicazione, poiché riconosciamo i loghi più facilmente del testo semplice. Ad esempio, se ha un pulsante di eliminazione, può etichettarlo con un'icona a forma di cestino.

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

Pulsanti con gestori di eventi

È possibile specificare un blocco di script da eseguire quando si fa clic sul pulsante

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

Pulsante di caricamento

I pulsanti di caricamento visualizzano un'icona di caricamento mentre è in esecuzione un gestore di eventi. Questo è utile per gli eventi di lunga durata.

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

Gruppo di pulsanti

Un gruppo di pulsanti produce un pulsante con un menu a discesa. Viene anche chiamato split button.

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"
    }
}

Gruppo di pulsanti

Disabilitare il pulsante dopo il clic

Questo esempio utilizza Set-UDElement per disabilitare il pulsante dopo aver eseguito un'azione.

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

API

• New-UDButton